No public Twitter messages.


Этот блог устарел и, скорее всего, больше не будет обновляться. В ближайшем будущем он переедет сюда.
9 апреля 2010 // Веб-разработка

Сегодня CSS Naked Day 2010!

CSS Naked Day

CSS Naked Day был учреждён в 2006м году Дастином Диазом, дабы продвигать и популяризировать веб-стандарты. Отключая CSS показать всему миру, что сайт сделан с учётом всех стандартов, обладает семантической вёрсткой и хорошей структурой.

Идея мне очень нравится и вы сами можете поглядеть, что блог мой структурирован на ура и я вообще даволен как всё сделал :)

теги: , , ,

комментарии отключены.


14 декабря 2009 // Веб-разработка

Валидный счётчик LiveInternet

В последние годы для русскоговорящих веб-девелоперов стало почти стандартом вешать на свои сайты (помимо дефолтного во всём мире Google Analytics) счётчик LiveInternet.

Однажды, я прочитал несколько книг по веб-стандартам и немного спецификации xhtml, после чего, само собой, код стал весьма и весьма валиден. В каждом конкретном случае хотелось, чтобы этот факт подтверждал и тот самый валидатор, даже не смотря на то, что многие, как и у нас, так и на западе называют его «всего-лишь скриптом». Разумеется столкнулся я с рядом проблем возникающих от чужого кода (со своим, благо, справился без проблем), одной из главных стала валидация кода счётчика LiveInternet при доктайпе xhtml1.0 transitional. Сначала я пытался отловить проблемы в коде и создать универсальный и валидный код. Из этого ничего не вышло. Однако решение подсказал сам LiveInternet.

При кастомизации кода счётчика необходимо выбрать пункт «отдельный код для логотипа и для счётчика», а на сайт просто вставляем их друг за другом, или вообще в разных местах. И валидатор счастлив.

Вот он, валидный код счётчика LiveInternet на все времена:

<!--LiveInternet counter-->
<script type="text/javascript">new Image().src = "http://counter.yadro.ru/hit?r" + escape(document.referrer) + ((typeof(screen)=="undefined")?"" : ";s"+screen.width+"*"+screen.height+"*" + (screen.colorDepth?screen.colorDepth:screen.pixelDepth)) + ";u"+escape(document.URL) + ";h"+escape(document.title.substring(0,80)) + ";" +Math.random();</script>
<!--/LiveInternet-->

<!--LiveInternet logo-->
<a href="http://www.liveinternet.ru/click" target="_blank">
<img src="http://counter.yadro.ru/logo?38.2" border="0" width="31" height="31" alt="" title="LiveInternet"/>
</a>
<!--/LiveInternet-->

Всех с началом новой недели!

теги: , ,

5 комментариев.


7 декабря 2009 // Веб-разработка

ЧПУ в CMS Made Simple

В этой CMS настройки ЧПУ сделаны очень уж не очевидно и после каждой установки приходится лезть на официальный форум и искать там нужную запись, в которой написано что надо делать.

Решил для простоты написать этот не мудрёный процесс сюда, чтобы и люди находили и мне далеко за этми идти не надо было.

Для настройки ЧПУ на сайте с CMS Made Simple необходимо:

1. В файле config.php найти блок #URL Settings и установить настройки как здесь:

#------------
#URL Settings
#------------
#What type of URL rewriting should we be using for pretty URLs?  Valid options are:
#'none', 'internal', and 'mod_rewrite'.  'internal' will not work with IIS some CGI
#configurations. 'mod_rewrite' requires proper apache configuration, a valid
#.htaccess file and most likely {metadata} in your page templates.  For more
#information, see:
#http://wiki.cmsmadesimple.org/index.php/FAQ/Installation/Pretty_URLs#Pretty_URL.27s
$config['url_rewriting'] = 'mod_rewrite';

#Extension to use if you're using mod_rewrite for pretty URLs.
$config['page_extension'] = '/';

#If you're using the internal pretty url mechanism or mod_rewrite, would you like to
#show urls in their hierarchy?  (ex. http://www.mysite.com/parent/parent/childpage)
$config['use_hierarchy'] = true;

#If using none of the above options, what should we be using for the query string
#variable?  (ex. http://www.mysite.com/index.php?page=somecontent)
$config['query_var'] = 'page';

2. В корне сайта создаём файл .htaccess и записываем в него следующее:

RewriteEngine on# 301 Redirect all requests that don't contain a dot or trailing slash to
# include a trailing slash
RewriteCond %{REQUEST_URI} !/$
RewriteCond %{REQUEST_URI} !\.
RewriteRule ^(.*) %{REQUEST_URI}/ [R=301,L]

# Rewrites urls in the form of /parent/child/
# but only rewrites if the requested URL is not a file or directory
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.+)$ index.php?page=$1 [QSA]

теги: ,

13 комментариев.


2 декабря 2009 // Веб-разработка

4 основных принципа хорошего дизайна

1. Контраст

Смысл этого принципа состоит в том, чтобы не располагать рядом друг с другом похожие элементы. Если элементы просто неодинаковы (отличаются гарнитурой, цветом, размером, толщиной линий, формой и т. д.), необходимо сделать их очень разными. Контраст нередко является самым сильным визуальным средством привлечения внимания — именно он заставляет читателя посмотреть на страницу.

2. Повтор

Визуальные элементы дизайна (цвета, фигуры, текстуры, пространственные пропорции, толщина линий, концептуальные решения) должны повторяться. Это структурирует работу и усиливает её стилистическую целостность.

3. Выравнивание

Ни один элемент страницы не должен занимать случайное место. Каждый элемент нуждается в визуальной связи с соседними. Благодаря этому страница выглядит ясно, утонченно и свежо.

4. Приближенность

Связанные между собой элементы следует группировать. Тогда они образуют визуальный элемент, а не рассеиваются по странице. Это помогает организовать информацию, уменьшая беспорядок и помогая читателю увидеть структуру документа.

© Робин Вильямс «Дизайн для НЕдизайнеров»

теги: , , ,

комментарии отключены.


27 июля 2009 // Веб-разработка

Установка Zend Optimizer на Denwer

На днях я стал бета-тестером Handy.CMS 3.1. Как протестирую о результатах всенеприменно сообщу. Пост в общем-то не о том. Система для установки требует наличие на сервере Zend Optimizer. Что бы его установить каждый раз приходится напрягать мозги ибо чтобы скачать пакет с официального сайта надо пройти обязательную процедуру регистрации или, что ещё хуже — вспоминать свой логин и пароль, после чего пакет нужно будет ещё инсталлировать и привязывать к Denwer, хотя всё легко настраивается и без этих премудростей. По этому я коротенько расскажу как упрощённым способом ставить Zend Optimizer на Denwer. Дальше →

теги: , , ,

комментарии отключены.


23 июля 2009 // Веб-разработка

Validation и Browser Compatibility в Dreamweaver CS4

Сегодня хочу познакомить вас с двумя вкусностями Dreamweaver, которые использую постоянно, это Validation и Browser Compatibility. Если честно не знаю были ли эти функции в предыдущих версиях Dreamweaer, но наткнулся я на них уже в CS4.

Browser Compatibility

Window → Results → Browser Compatibility

Dreamweaver Browser Compatibility

Как легко понять из названия эта функция проверяет код на поддержку различными браузерами и подсказывает как себя будут вести различные браузеры с текущим кодом. Функция заточена под все нужные браузеры и даже под Internet Explorer for Macintosh, хотя я, лично, никогда и не стремился верстать с поддержкой этого браузера. Однако даже с последними апдейтами функция не владеет информацией о FF 3.5, IE8 (только 8.0b1), Opera 10 (и даже 9.5), Safari 4, что, впрочем, не беда. Самое главное — исчерпывающая информация о IE6.

Кстати у Adobe есть страница с решениями и хаками для различных браузеров, мне, правда, ни разу так и не пригодилась.

Validation

Window → Results → Validation

Dreamweaver Validation

Эта функция, как опять же, не трудно догадаться из названия помогает провести валидацию документа по веб-стандартам «не выходя из дома». Пользуюсь постоянно. Позволяет проверить как текущий документ, так и весь сайт разом.

Однако замечены мною и случаи, когда мнения валидатора Dreamweaver и валидатора w3c расходились, например так у меня было с счётчиком liveinternet, в котором валидатор w3c при доктайпе xhtml 1.0 transitional находил кучу ошибок, в то время как Dreamweaver радовался хорошему коду.

Помимо классических стандартов HTML и XHTML этот валидатор также проверяет документ по множеству других стандартов и технологий, большинство из которых я никогда и не использовал, так что рассказать про них ничего не могу, к ним относятся ColdFusion (Basic, 3.0-MX 7), Internet Explorer Extensions, Netscape Navigator Extensions, SMIL 1.0, WML и JavaServer Page Tags.

Enjoy! :)

теги: , , , ,

1 комментарий.


21 июля 2009 // Веб-разработка

Функция Live View в Dreamweaver CS4

Я думаю большинство из вас для вёрстки сайтов использует Dreamweaver, ясное дело. Я тоже. Когда-то начинал со второй версии этой замечательной штуки, тогда она ещё принадлежала Macromedia. Долго я использовал вторую, потом переполз на 4, но уже не помню чем не понравилась — стал использовать UltraDev, он, кажется, был старее, но мне нравился больше. Тогда я интересовался новыми фишечками и всякими вкусностями новых версий, а когда уже полностью освоился и стал просто верстать вкусности как-то само собой ушли на второй план. И версии стал менять как тапочки, 8.0, CS3, ну и, затем, CS4.

Кнопки Live View и Live Code на панели задач

Кнопки Live View и Live Code на панели задач

Решил я поискать вкусностей для любимого инструмента и первая же найденая вкусность оказалась невероятно удобной и полезной, имя ей — Live View. Она позволяет посмотреть как сайт выглядит в браузере прямо в окне редактирования.

В Dreamweaver CS4 вшит WebKit, что, надо сказать, существенно сокращает время отладки макета. Функция запускает все динамические элементы страницы реализованые с помощью CSS, Flash и JavaScript (включая фрэймворки вроде jQuery, MooTools, Prototype и т.п.). Кстати для JavaScript присутствует ещё и функция Live Code – она позволяет в реальном времени просматривать изменение страницы, подобно FireBug и DragonFly.

P.S. Недавно думал попробывать сделать макет с нуля и до конца в Microsoft Expression Web 2, и вот именно отсутствие альтернативы функции Live View не дало мне завершить начатое :)

P.P.S. Видео с сайта Adobe.

теги: , , , ,

комментарии отключены.



  • twitter
  • rss
  • хабр
  • жежека
  • ластфм