По материалам доклада «Семантическая вёрстка» на конференциях ClientSide 2007 и UA Web 2008.

Современный взгляд на организацию кода

Начало. Продолжение — «Семантическая вёрстка. Часть вторая».

Прежде всего, давайте договоримся: семантическая вёрстка — это не гербалайф. Она не поможет вам в одночасье научиться верстать в восемь раз быстрее, IE6 вдруг не перестанет бажить, да и волосы не станут гладкими и шелковистыми, скорее наоборот. Более того, использование данного подхода потребует от вас бóльших умственных усилий. Как на освоение методики, так и в работе с ней.

В чём же смысл? Зачем я предлагаю использовать подход, который, на первый взгляд, только усложняет жизнь? Просто поверьте — оно того стоит, но обо всём по порядку.

Семантика?

Семантика (фр. sémantique от греч. σημαντικός — обозначающий)

Понятие «семантика» пришло к нам из лингвистики в несколько сокращённом значении для того, чтобы можно было применить его к HTML-вёрстке. Прежде всего, семантика в вёрстке — это совокупность смысловых отношений, возникающих в документе. Однако для существования таких отношений необходим документ, который возникает благодаря внедрению HTML-разметки в простой текст.

Читать дальше…

Комментарии: 38

CSS-нудизм

8 Апрель 2008

Сегодня CSS Naked Day. И вся красота семантической вёрстки перед вами. Присоединяйтесь, ещё есть время!

ps: прочитал забавные и слегка занудные мысли по поводу CSS Naked Day. Что ж, тоже точка зрения, хоть и скучная.

Комментарии: 10

Позавчера блоги ведущих западных веб-разработчиков пестрили восторгами:

Роджер Йохансон (Roger Johansson)

Когда я проснулся сегодня утром и проверил RSS-фиды, мне пришлось протереть глаза и вчитаться снова. Я сплю и вижу сон? Да вроде нет — несколько источников в один голос утверждают, что Майкрософт изменила своё прежнее решение относительно поведения IE8 по умолчанию: так же, как IE7, пока не указано обратное.

Питер-Пол Кох (Peter-Paul Koch)

Команда IE сделала именно то, чего ждали все разработчики, знакомые с веб-стандартами. Если вам нужно поведение IE7 — отлично — придётся кое-что сделать. Если вы хотите получить поведение по стандартам, а также применить концепцию прогрессивного улучшения — не нужно делать ничего. В этом что-то есть. Кажется команда IE умеет слушать.

Эрик Мейер (Eric Meyer)

А теперь кое-что, чего я не ожидал увидеть, проснувшись сегодня утром: «Майкрософт расширяет поддержку веб-стандартов» … Кроме шуток, это заголовок последнего их пресс-релиза. … Иначе говоря, команда IE, похоже, использует последние PR-ходы Майкрософт для своей, а также нашей, выгоды.

И конечно же Молли Хольцшлаг (Molly Holzschlag)

Эй, танцуем! IE8 в совместимом со стандартами режиме по умолчанию.

А что же сегодня? А сегодня ночью мы получили ту пресловутую версию IE8, пока только бету, но её уже можно начать щупать. Благо, что на панели IE8 появляется кнопочка «Toggle IE7 Emulation mode», которая позволяет, хоть и с перезапуском, но всё же переключаться между двумя браузерами.

Читать дальше…

Комментарии: 18

Карманный валидатор

22 Февраль 2008
Значок в доке

Зачастую HTML-валидатор — это не только способ похвастаться аккуратным кодом, поставив зелёную галочку на сайт, но ещё и полезный инструмент для непосредственной разработки. Контроль аккуратности кода, отсутствия каких-то опечаток или неуместных вещей стоит производить как можно чаще.

Потенциально, код можно периодически скармливать той самой последней инстанции на W3C, но это не слишком удобно для локальных файлов или полевых условий. Альтернативным решением можно назвать использование плагинов для браузеров: HTML Validator для Firefox и Safari Tidy для Safari, оба они основаны на движке HTML Tidy и, к слову сказать, невероятно криво сделаны. Но W3C HTML Validator и Tidy — это два разных проекта, хоть и преследующие схожие цели. Не берусь судить об их различиях, но факт остаётся фактом.

Есть и другая возможность проверять свой код локально: W3C HTML Vadlidator не только распространяется в виде открытого исходного кода, но также доступен в виде готовых пакетов для *nix-платформ и, в частности, отдельного приложения для Mac OS X — Validator S.A.C. Это приложение устанавливается простым перетаскиванием в папку «Программы», имеет знакомый интерфейс и позволяет проверять как локальные, так и удалённые страницы и получать результаты идентичные онлайн-валидатору.

Комментарии: 11

Возвращение favicon

14 Февраль 2008

Помните, как в своё время люди радовались favicon’кам? Сайты с ними очень хотелось добавить на панель закладок, чтобы, не глядя на ярлык, с разбегу кликать на запомнившийся значок.

Потом истерия немного утихла: веб-мастера более-менее научились работать с иконками; доля IE6, изредка понимающего их по чистой случайности, начала падать; Яндекс решил показывать их в поисковой выдаче — и эта приятная мелочь стала признаком аккуратности и хорошего тона.

Просмотр в Safari

Сегодня, благодаря Apple, значки возвращаются в новом виде: слегка потолстев до размеров 57×57 пикселов, только на платформе iPhone и iPod Touch — но они снова с нами. С выходом в январе прошивки 1.1.3 на указанной платформе, пользователи получили возможность создавать закладки для страниц прямо на панели программ. По умолчанию, этот значок (webclip) показывает уменьшенное изображение той части страницы, на которую вы добавляете закладку.

Но для того, чтобы значок выглядел так, как нужно вам, достаточно указать путь к иконке в специальном элементе <link>:

  1. <head>
  2. <link rel="apple-touch-icon" href="favicon.png"/>
  3. </head>

Читать дальше…

Комментарии: 14