Пепелсбей.net
RSS-трансляцияВысокотехнологично
7 мая 2008Не могу обойти вниманием уникальное для рунета явление — WebHiTech — первый технологический конкурс, ориентированный на веб-стандарты. Вы только вчитайтесь в это заявление:
Миссия конкурса WebHiTech — посильное содействие повышению культуры веб-разработки в Рунете посредством популяризации уважительного отношения веб-разработчиков к духу и букве актуальных рекомендаций Консорциума W3C.
Весьма серьёзные условия участия сайта в конкурсе, а также состав жюри дают мне уверенность в том, что эти заявления о миссии не останутся просто словами, и мы с вами, в кои-то веки, увидим по-настоящему интересный конкурс, а как результат — лучшие с технологической точки зрения сайты рунета среди победителей.
Срок приёма заявок на участие — с 3 апреля по 25 сентября 2008 года включительно. Времени более чем достаточно. Причём скажу вам, как инсайдер, что уровень заявок на данный момент таков, что у любого мало-мальски приличного сайта сейчас есть шансы если и не на победу, то как минимум на хорошее место в общем рейтинге конкурса.
Найсбокс
2 мая 2008Вспоминая про вечный конфликт дизайнера и верстальщика, нельзя не упомянуть такую интересную тему, как отрисовка элементов форм в стиле сайта или, говоря по-птичьи, кастомные контролы. Мне вообще придётся много говорить не по-человечьи, поскольку адекватных эквивалентов некоторым терминам в русском языке пока не существует.
И ладно бы, если дизайнеру понравилось поле поиска со скруглёнными краями из Mac OS X. Другое дело, когда он берётся за кнопку «Обзор», выпадающие списки или чекбоксы с радиобатонами — остаётся только молча сжать кулаки. И не потому, что это долго и сложно делать… Скорее потому, что тем самым дизайнер заставляет пользователя думать «боже, что это за хрень такая?» — он прячет то, к чему пользователь привык в своей системе или браузере. А это может привести к тому, что он, потратив время на попытку разобраться в интерфейсе, может плюнуть на все и уйти.
Но бывает, что очень надо. Поэтому предлагаю вам одно из решений проблемы с чекбоксами и радиобатонами, прототип которого я использовал в проекте «Магазин одной футболки» для Livejournal.
Найсбокс — для того, чтобы увидеть решение в действии, нажмите «Nice!».
Суть метода заключается в том, что мы, во-первых, оборачиваем наши контролы прямо в <label>:
<legend>Оркестра</legend><ul><li><label for="first-1"><input type="radio" name="first" id="first-1" />Представляет</label></li></ul>
Семантическая вёрстка. Часть вторая
24 апреля 2008По материалам доклада «Семантическая вёрстка» на конференциях ClientSide 2007 и UA Web 2008.
Современный взгляд на организацию кода
Продолжение. Начало — «Семантическая вёрстка. Часть первая»
Второй уровень семантики: именование элементов
Для создания второго смыслового уровня документа у нас есть два способа именования элементов: id и class. Каждый имеет свои особенности, в силу которых формируются типичные ситуации применения каждого из них.
Имя элемента характеризует его функциональность или содержимое: упорядоченный список (первый уровень семантики) комментариев (второй уровень семантики).
<ol id="comments"><li>Первый</li><li>Второй</li></ol>
Согласно спецификации, id — это имя уникального элемента, в большей степени подходит для создания структурной разметки документа:
<body><div id="header"> … </div><div id="content"> … </div><div id="footer"> … </div></body>
CSS-фреймворки
23 апреля 2008Вашему вниманию предлагается видеозапись доклада «CSS-фреймворки», прозвучавшего на конференции РИТ-2008. Обзорный доклад-размышление о практической пользе CSS-фреймворков.
Для лучшего понимания некоторых моментов, не попавших в кадр, доступна сама презентация: CSS-фреймворки (PDF, 237 КБ), а также версия видео для iPod/iPhone: CSS-фреймворки (H.264, 66 МБ)
Семантическая вёрстка. Часть первая
22 апреля 2008По материалам доклада «Семантическая вёрстка» на конференциях ClientSide 2007 и UA Web 2008.
Современный взгляд на организацию кода
Начало. Продолжение — «Семантическая вёрстка. Часть вторая».
Прежде всего, давайте договоримся: семантическая вёрстка — это не гербалайф. Она не поможет вам в одночасье научиться верстать в восемь раз быстрее, IE6 вдруг не перестанет бажить, да и волосы не станут гладкими и шелковистыми, скорее наоборот. Более того, использование данного подхода потребует от вас бóльших умственных усилий. Как на освоение методики, так и в работе с ней.
В чём же смысл? Зачем я предлагаю использовать подход, который, на первый взгляд, только усложняет жизнь? Просто поверьте — оно того стоит, но обо всём по порядку.
Семантика?
Семантика (фр. sémantique от греч. σημαντικός — обозначающий)
Понятие «семантика» пришло к нам из лингвистики в несколько сокращённом значении для того, чтобы можно было применить его к HTML-вёрстке. Прежде всего, семантика в вёрстке — это совокупность смысловых отношений, возникающих в документе. Однако для существования таких отношений необходим документ, который возникает благодаря внедрению HTML-разметки в простой текст.