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

Надеюсь, Вы уже просмотрели видеоурок по внутренней оптимизации сайта. Теперь время поговорить о семантической разметке.

Это достаточно важная часть при внутренней оптимизации.

Семантическая разметка - это контент с грамотно проставленными HTML-тегами форматирования.

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

Чтобы понять на примере, что же такое семантическая разметка, просмотрите созданные вами HTML-документы с отключенным внешним форматированием (CSS-стили, JavaScript и изображения).

Вы можете в тексте найти заголовки, абзацы, ссылки и важные фразы?

Если ответ положительный, то ваш документ придерживается семантики.

Как же правильно использовать HTML-элементы для разметки?

В первую очередь следует выделить заголовки <h1> - <h6>

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

Для одной страницы необходимо вычленить один общий заголовок и заключить его в <h1>. Подзаголовков может быть любое количество, но не рекомендуется перескакивать с одного уровня заголовков на другой – например, использовать <h3> после <h1>, пропуская <h2>. Это в том числе означает, что в хорошо структурированном документе не может быть заголовка второго уровня без заголовка первого.

Так же важны и другие HTML-элементы: теги абзаца <p>, списка <ul> и <ol>, логического выделения более важных слов и фраз в тексте (<strong> и <b> - полужирным, <em> - курсивом, <u> - подчеркиванием) и тег alt для описания изображений.

Советую использовать их для грамотного построения структуры текста.

Для семантической разметки используют 2 метода верстки: табличный и блочный (дивовый).

Табличная верстка – на основе основе таблиц. Текст находится в ячейках. В этом случае код очень трудно воспринимается поисковиками, особенно если используются вложенные таблицы. Этот метод считается устаревшим, т.к. в таблицах необходимо размещать только соответствующие табличные данные: какую-либо статистику, расписание, расчеты и прочее. Но по причине простоты использования табличная верстка встречается довольно часто.

При блочной верстке текст расположен в блоках <div> с присвоенными им css-стилями. Метод считается грамотным и современным!

Без сомнения, семантическая разметка необходима для веб-страниц. Вот несколько преимуществ такого подхода к оптимизации сайта:

• Повышается читабельность, т.к. страницы ресурса не потеряют своей структуры даже при недоступности изображения, скриптов или CSS;
• Текст веб-страниц сайта будет понятен для людей, читающих его с помощью спецпрограмм для чтения с экрана;
• Семантическая разметка улучшает уровень индексации страниц и повышает релевантность под определенные запросы;
• Упрощается редактирование текста, снижаются затраты на редизайн;
• Уменьшается вес страниц сайта, а значит увеличивается скорость загрузки за счет компактности страницы.

Постовой:

Обмениваемся ссылками с FullSeo

• Twit

Подписаться на RSS