SEO-оптимизированная верстка сайта

Поисковые системы оценивают не только наличие ключевых слов, также оценивается их расположение на странице. Чем выше слова – тем релевантнее страницы. Поэтому при СЕО-верстке сайта все текстовые поля располагаются в коде как можно ближе к началу документа

Примеры SEO-верстки html страниц

В стандартном варианте пример кода обычной страницы выглядит так:

<body>
<div id="wrapper">
<div id="header"></div>
<div id="sidebar"></div>
<div id="content">Тут расположен важный контент</div>
<div id="footer"></div>
</div>
</body>

Не прилагая особенных усилий, блок с контентом можно вынести выше сайдбара. Тогда пример СЕО-верстки будет выглядеть так:

<body>
<div id="wrapper">
<div id="header"></div>
<div id="content">Тут расположен важный контент</div>
<div id="sidebar"></div>
<div id="footer"></div>
</div>
</body>

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

Важные для SEO элементы при верстке сайта

Ряд элементов html имеет ключевое значение при внутренней оптимизации сайта. При сео-верстке сайта стоит уделять внимание тегам:

1. Title;
2. H1-h3;
3. Keywords;
4. Description;
5. Alt у изображений.

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

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

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

Советы по SEO верстке

1. Необходимо писать максимально оптимизированный код – чем короче, тем лучше.
2. Стили и скрипты необходимо вынести в отдельные файлы. И здесь нужно стараться писать максимально кратко.
3. Используйте на сайте навигационную цепочку.
4. Постарайтесь не использовать в верстке страниц теги выделения текста: жирный, курсив. Эти теги лучше использовать в тексте, стиль прочих элементов сайта можно задать при помощи стилей.
5. Теги заголовков должны использоваться только в заголовках. Не нужно применять их для оформления элементов сайта.
6. Ссылки на сайте лучше оформлять контрастным цветом и подчеркиванием. Так точно ни у кого не возникнет сомнения, что это именно ссылка.
7. Не нужно делать невидимых элементов на сайте.
8. Старайтесь не создавать слишком длинных страниц – они долго индексируются, часто их никто не дочитывает до конца.

Основное правило, которому стоит следовать при SEO-верстке – это простота. Чем проще и короче при сохранении функциональности будет ваш код, тем выше будут позиции сайта.