CSS и семантическая разметка

Визуальная компоновка

И, наконец, отображение материала. Красивые, простые и легкие в использовании компоновки порождают доверие и собирают гораздо больше читателей, чем плохо спроектированный контент, помещенный между рекламными блоками, занимающими почти всю страницу. Подробнее по этой теме вы можете почитать в статье "The Golden Ratio in Web Design" сайта NetTuts (http://nettuts.com/tutorials/other/the-golden-ratio-in-web-design/), в которой есть отличные иллюстрации и советы по компоновке web-контента на странице.

Каскадные таблицы стилей (CSS) обычно упоминаются как лучшая практика для web-разработок общего назначения, но их принципы дают также и некоторые косвенные преимущества в смысле оптимизации. Компания Google рекомендует не превышать размер страницы в 101 Кбайт. И общепринятым было мнение, что маленькие страницы дают определенные преимущества. Однако теперь поисковые движки отрицают, что размер кода каким-либо образом учитывается (если только он не чрезмерно большой). И, тем не менее, поддержание небольших размеров файлов означает, что загрузка происходит быстрее, коэффициент прерванных запросов меньше, а вероятность быть до конца прочитанным и чаще получать ссылки выше.

CSS могут также помочь и в решении другой горячо дискутируемой проблемы – соотношение кода к тексту. Некоторые профессионалы в области оптимизации клянутся, что уменьшение соотношения кода к тексту (меньше кода – больше текста) может значительно помочь на больших web-сайтах (с многими тысячами страниц). Ваш опыт может подсказывать вам другое, но поскольку хорошие CSS облегчают все это, то нет никакой причины не сделать этот принцип частью вашей стандартной процедуры web-разработки. Используйте бестабличные CSS, хранящиеся во внешних файлах, делайте внешние вызовы JavaScript, отделяйте уровень контента от уровня презентации, как это показано на сайте CSS Zen Garden (http://www.csszengarden.com/), который предлагает множество подготовленных пользователями таблиц стилей (форматирующих один и тот же HTML-контент).

И, наконец, CSS предоставляет простое средство для "семантической" разметки. Например, прочитайте статью "Writing Semantic Markup" (http://www.digital-web.com/articles/writing_semantic_markup/) в журнале Digital Web Magazine. Для задач оптимизации применимы только несколько основных тегов, а разные интерпретации микроформатов (с использованием таких тегов, как <author> или <address>) гораздо менее важны. Движки отсортировывают семантику, поскольку очень мало web-издателей используют этот способ кодирования, однако есть свидетельства, что она помогает для местного поиска. Использование кода CSS для выделения, для цитирования/ссылок, а также для уменьшения использования таблиц и других раздутых механизмов форматирования в языке HTML, может дать позитивный эффект.