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 имеет ключевое значение при внутренней оптимизации сайта. При сео-верстке сайта стоит уделять внимание тегам:
- Title;
- H1-h3;
- Keywords;
- Description;
- Alt у изображений.
Эти теги используются для определения релевантности страницы сайта. Важно использовать из по назначению.
Например, заголовки при верстке сайта часто применяются для разметки элементов страницы таких как пункты меню, надписи и прочее. Это неверно. Заголовки нужно использовать только в качестве заголовков. Внешний вид прочих элементов можно задать с помощью стилей.
Ключевые слова, описание и альт-текст изображения при создании сайтов часто игнорируются. Хотя в разной степени также участвуют в SEO-оптимизации.
Советы по SEO верстке
- Необходимо писать максимально оптимизированный код – чем короче, тем лучше.
- Стили и скрипты необходимо вынести в отдельные файлы. И здесь нужно стараться писать максимально кратко.
- Используйте на сайте навигационную цепочку.
- Постарайтесь не использовать в верстке страниц теги выделения текста: жирный, курсив. Эти теги лучше использовать в тексте, стиль прочих элементов сайта можно задать при помощи стилей.
- Теги заголовков должны использоваться только в заголовках. Не нужно применять их для оформления элементов сайта.
- Ссылки на сайте лучше оформлять контрастным цветом и подчеркиванием. Так точно ни у кого не возникнет сомнения, что это именно ссылка.
- Не нужно делать невидимых элементов на сайте.
- Старайтесь не создавать слишком длинных страниц – они долго индексируются, часто их никто не дочитывает до конца.
Основное правило, которому стоит следовать при SEO-верстке – это простота. Чем проще и короче при сохранении функциональности будет ваш код, тем выше будут позиции сайта.
Возможно, вам будет интересно
У нас можно заказать поисковое продвижение сайтов на конструкторе Wix, UMI, Ucoz и других системах, мы работаем при бюджете от 14 000 рублей по договору с гарантиями достижения результата. У нас есть опыт поисковой оптимизация сайтов, разработанных на конструкторах, и мы знаем, что достичь результатов можно и в рамках такого проекта. Что нужно учесть при выборе конструктора сайта […]
Другие задачи интернет-маркетинга – это взаимодействие с клиентом, получение обратной связи и продвижение корпоративного бренда. Структура и инструменты рекламы в интернете К основным инструмента интернет-маркетинга обычно относят медийную и контекстную рекламу, поисковое продвижение, социальные сети, рассылки по электронной почте. Простейшая структура интернет-маркетинга выглядит так: Создание стратегии; Привлечение трафика; Аналитика; Удержание клиентов. Иногда оптимизацию сайта в поисковиках и понятие интернет-маркетинга разделяют между […]
При заказе сайта важно точно понимать что именно вы хотите получить. Основная цель коммерческих проектов — получение прибыли. Задачи могут быть разными — информирование клиентов, онлайн продажи, дополнительный сервис и прочее. Если вы будете знать зачем вам нужен сайт, вам будет проще найти подрядчика, поставить ему задачу и оценить результат Преимущества сотрудничества с веб-студиями и […]