Надеюсь, Вы уже просмотрели видеоурок по внутренней оптимизации сайта.
Теперь время поговорить о семантической разметке.
Это достаточно важная часть при внутренней оптимизации.
Семантическая разметка - это контент с грамотно проставленными HTML-тегами форматирования.
От семантической разметки зависит не только правильное отображение
текста, но и релевантность страницы. К сожалению, большинство веб-мастеров не
придают этому должного значения.
Чтобы понять на примере, что же такое семантическая разметка, просмотрите созданные вами HTML-документы с отключенным внешним форматированием (CSS-стили, JavaScript и изображения).
Вы можете в тексте найти заголовки, абзацы, ссылки и важные фразы?
Если ответ положительный, то ваш документ придерживается семантики.
Как же правильно использовать HTML-элементы для разметки?
В первую очередь следует выделить заголовки <h1> - <h6>
Заголовки призваны вкратце разъяснять, аннотировать текст, который за
ними следует. Поэтому заключать в них большие куски текста не имеет
смысла.
Для одной страницы необходимо вычленить один общий заголовок и заключить его
в <h1>. Подзаголовков может быть любое количество, но не рекомендуется перескакивать с одного уровня заголовков на другой
– например, использовать <h3> после <h1>, пропуская <h2>.
Это в том числе означает, что в хорошо структурированном документе не может быть
заголовка второго уровня без заголовка первого.
Так же важны и другие HTML-элементы: теги абзаца <p>, списка <ul>
и <ol>, логического выделения более важных слов и фраз в тексте (<strong> и <b> - полужирным, <em> - курсивом, <u>
- подчеркиванием) и тег alt для описания изображений.
Советую использовать их для грамотного построения структуры текста.
Для семантической разметки используют 2 метода верстки:
табличный и блочный (дивовый).
Табличная верстка – на основе основе таблиц. Текст
находится в ячейках. В этом случае код очень трудно воспринимается
поисковиками, особенно если используются вложенные таблицы. Этот метод
считается устаревшим, т.к. в таблицах необходимо размещать только
соответствующие табличные данные: какую-либо статистику, расписание,
расчеты и прочее. Но по причине простоты использования табличная верстка
встречается довольно часто.
При блочной верстке текст расположен в блоках <div> с присвоенными им css-стилями. Метод считается грамотным и современным!
Преимущества семантической разметки
Без сомнения, семантическая разметка необходима для веб-страниц. Вот несколько преимуществ такого подхода к оптимизации сайта:
- Повышается читабельность, т.к. страницы ресурса не потеряют своей
структуры даже при недоступности изображения, скриптов или CSS;
- Текст веб-страниц сайта будет понятен для людей, читающих его с помощью спецпрограмм
для чтения с экрана;
- Семантическая разметка улучшает уровень индексации страниц и повышает релевантность под определенные запросы;
- Упрощается редактирование текста, снижаются затраты на редизайн;
- Уменьшается вес страниц сайта, а значит увеличивается скорость загрузки за счет компактности страницы.
|