Безупречная структура продвигаемого сайта

Вебмастерам следует в использовать три тега в коде верстки сайта:

  • <article>Текст статьи</article>
  • <nav>Меню навигации</nav>
  • <aside>Сайдбар</aside>

С этими тегами, поисковые системы моментально распознают структуру сайта, где основной контент, и где навигация. Чуть подробнее о HTML5-семантике написано тут.

Пример каркаса страницы с подобной структурой:

  1. Контент у юзера как на ладони. Моментально получает, что искал.
  2. Логотип и текст под ним сразу тянут на себя внимание, но при этом не раздражают, не мешают чтению основного текста.
  3. Используются современные теги <nav>, <aside> и <article> — можно получить большой плюс в дневник для поисковиков
  4. Текст статьи располагается в самом верху кода, сразу же после тега <body>:
<html>
<head>
<title>Идеальная структура сайта</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
</head>
<body>
<article>
<h1>Заголовок статьи</h1>
<p>Photoshop’s version of Lorem Ipsum. Proin gravida nibh vel velit auctor aliquet. Aenean sollicitudin, lorem quis bibendum auctor, nisi elit consequat ipsum, nec sagittis sem nibh id elit. Duis sed odio sit amet nibh vulputate cursus a sit amet mauris. Morbi accumsan ipsum velit. Nam nec tellus a odio tincidunt auctor a ornare odio. Sed non mauris vitae erat consequat auctor eu in elit.</p>
</article>
</body>
</html>

Повторюсь, рецепт «SEO-friendly» кода предельно прост:

  1. Теги <nav>, <aside> и <article>
  2. 2) Блок <article> всегда вверху (в CSS прописываем position:absolute, кто слабо разбирается в верстке – можете глянуть код)
Задать вопрос?

Вы можете задать любой вопрос напрямую нашим сотрудникам

Заказать услугу

Вы выбрали услугу

Подать заявку

Вы можете отправить свое резюме по доступной в студии вакансии
«»

Ваша заявка отправлена!

Наши сотрудники свяжутся с вами в ближайшее время!

Максим Набиуллин
Максим Набиуллин
Пишите или звоните для консультации эксперту компании