Подготовили подробную инструкцию, как сделать SEO-friendly сайт и учесть все основные SEO-требования на этапе разработки сайта.
Это статья очень важна, так как соблюдение SEO-требований на этапе создания нового сайта позволяет сэкономить много денег и времени на внесении дополнительных правок.
Ниже представлена подробная инструкция с основными SEO-требования, которые необходимо предусмотреть на этапе создания нового сайта.
Сформировать ЧПУ адреса для всех страниц сайта
ЧПУ (Человеко-понятные URL) — это адреса страниц сайта, которые содержат понятные человеку слова, отражающие содержимое страницы. ЧПУ адреса удобны для пользователей, помогают улучшить юзабилити сайта и облегчают его индексацию поисковыми роботами.
Для формирования ЧПУ адресов для всех страниц необходимо следовать нескольким правилам:
Использовать только латинские символы, цифры, и дефисы.
Слова в адресах следует разделять дефисом, а не пробелами и нижним подчеркиванием.
Использовать строчные буквы в адресах страниц.
Избегать использования слишком длинных адресов страниц.
Проверять уникальность ЧПУ адресов, чтобы избежать дублирования адресов страниц.
Не использовать в конце URL index.html, html.
URL для всех страниц должны быть закрыты слешем / в конце.
Кроме того, при формировании ЧПУ адресов для всех страниц сайта необходимо убедиться, что ЧПУ адреса устанавливаются автоматически для каждой новой страницы. Например, при формировании заголовка h1 автоматически подтягивать заголовок в URL, прописав его транслитом на латинице.
Настроить 301 редиректы на главное зеркало
Главное зеркало рекомендуется указать с https протоколом и без www.
Необходимо настроить 301 редиректы:
С www на без www
С http на https
Со страниц без / на страницы со / в конце
Со страниц с верхним регистром на страницы с нижним регистром символов
C /index.php и /index.html на главную страницу
Добавить тег title на все страницы сайта
На каждой странице в тегах <head> должен быть размещен тег <title> с уникальным содержанием.
На этапе разработки необходимо предусмотреть возможность автоматической генерации тега title по заданному шаблону. Также необходимо предусмотреть, чтобы тег можно было вручную редактировать на всех страницах сайта.
Добавить мета-тег description на все страницы сайта
На каждой странице в тегах <head> должен быть размещен мета-тег description с уникальным описанием страницы. Мета-тег необходимо оформить следующим образом:
<meta name="description" content="Описание страницы сайта." />На этапе разработки необходимо предусмотреть возможность автоматической генерации мета-тега title по заданному шаблону. Также необходимо предусмотреть, чтобы мета-тег можно было вручную редактировать на всех страницах сайта.
Мета-тег Keyword оставлять незаполненным
В настоящий момент мета-тег Keyword не учитывается поисковыми системами как фактор ранжирования и не оказывает положительного влияния на позиции сайта. В связи с этим необходимо оставить данный тег незаполненным.
При этом наличие необходимо, если на страницах не будет хватать плотности ключевых слов и оптимизатор примет решение вручную заполнить тег для увеличение плотности ключей в html-коде.
Главное требование к оформлению контента: оформить весь контент в html-коде
Весь текстовый контент и все важные элементы страниц должны быть оформлены в html-коде соответствующими тегами. Не следует допускать загрузку контента с помощью скриптов.
Критично важно оформить в html-коде следующие элементы:
Заголовки
Весь текстовый контент
Все ссылки
Тексты кнопок, форм и других элементов
Функциональные элементы (фильтрация, сортировка)
Изображения
Навигацию (меню, хлебные крошки, футер)
Пагинацию (ссылки на страницы пагинации обязательно должны присутствовать в коде)
Код микроразметки
Выпадающие списки в главном меню
Добавить заголовок h1 на все страницы сайта
На каждой странице сайта должен быть размещен основной заголовок, размеченный тегами <h1>. Данный заголовок должен быть, в том числе, на главной странице сайта.
Тегами <h1> должен быть размечен только один заголовок на странице.
Критично важно не использовать теги <h1> для выделения каких-либо элементов, кроме основного заголовка.
Подзаголовки на страницах размечать тегами h2-h3, либо стилями
Все подзаголовки, как на коммерческих страницах, так и на страницах статей и новостей, необходимо размечать тегами <h2> — <h3>, в соответствии с их иерархией.
Если заголовок не отражает структуру страницы и не имеет большого значения, такие заголовки необходимо размечать стилями, например выделять жирным шрифтом.
Требования к разметке текста
Текстовый контент на страницах сайта необходимо размечать соответствующими тегами, например:
<p> — параграф
<a> — ссылка
<table>, <td>, <tr> — таблицы
<ul> — маркированный список
<ol> — нумерованный список
<li> — элемент списка
Почему это важно? Правильная разметка текста и его элементов позволяет улучшить восприятие контента поисковыми системами. Кроме того, некоторые элементы могут подтянуться в сниппет страницы в поисковых системах, что в свою очередь может положительно сказаться на CTR (например, в некоторых случаях, в сниппеты выводятся табличные данные).
Оформление ссылок
Ссылки необходимо размечать тегами <a>. Ссылки в сквозных блоках необходимо открывать в текущем окне. Также в текущем окне необходимо открывать навигационные ссылки.
Ссылки, размещенные в тексте, а также все ссылки на внешние источники необходимо открывать в новом окне, добавив к ним атрибут target=”_blank”.
Ссылки необходимо оформить цветом, отличающимся от основного текста. Также можно выделить их жирным шрифтом, либо подчеркиванием. При наведении необходимо выделять ссылки.
Настроить 404 код ответа сервера для несуществующих страниц
Все несуществующие страницы должны отдавать 404 код ответа сервера.
При подстановке лишних символов в текущий URL страницы она также должна отдавать 404 код ответа.
Создать страницу 404 ошибки
При попадании на несуществующие страницы сайта, должна открывать страница 404 ошибки с навигационным меню и с предложением перейти на главную страницу или воспользоваться поиском по сайту.
Добавить тег Canonical на все страницы сайта
На всех страницах сайта необходимо разместить тег Canonical, указывающий основной адрес страницы без GET-параметров. Данный тег следует разместить в коде сайта в раздел <head></head>.
При размещении тега необходимо соблюсти последовательность атрибутов тега link:
<link rel="canonical" href="https://site.ru">Сгенерировать xml-карту сайта
Необходимо сгенерировать xml-карту в кодировке UTF-8 со списком всех канонических страниц сайта.
Описание формата сайта можно найти по ссылке:
В карте сайта должны присутствовать только ссылки на существующие канонические страницы с 200 кодом ответа. Не следует включать в карту сайта страницы с GET-параметрами.
В карте сайта необходимо разместить ссылку на страницу и дату последнего обновления, пример:
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="https://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://site.ru/</loc>
<lastmod>2022-08-01</lastmod>
</url>
<url>
<loc>https://site.ru/page/</loc>
<lastmod>2022-08-01</lastmod>
</url>
</urlset>Рекомендуем реализовать автоматическую генерацию карты сайта (чтобы при добавлении на сайт новых страниц они добавлялись в карту сайта). Также рекомендуем автоматически обновлять карту сайта раз в неделю.
Карту сайта необходимо разместить в корневом каталоге сайта с название sitemap.xml.
Пример: https://site.ru/sitemap.xml.
Скорость загрузки страниц и скорость ответа сервера
По данным некоторых исследований и заявлений представителей поисковых систем, для обеспечения удобства работы пользователей с сайтом необходимо достичь следующие показатели по скорости загрузки страниц сайта:
CLS не выше 0,1
LCP не выше 2,5 сек.
FID не выше 100 мс
Скорость ответа сервера не должна превышать 300 мс, а в идеале обеспечить скорость ответа менее 200 мс.
Переезд на защищенный https протокол
Перед релизом необходимо перевести сайт на защищенный https протокол и настроить 301 редирект с http на https. Например, со страницы http://site/ на https://site.ru/.
Оптимизация страниц пагинации
Страницы пагинации должны быть доступны для индексации. В связи с этим необходимо убедиться, что в html-коде сайта присутствуют ссылки на все страницы пагинации.
На страницах пагинации рекомендуем разместить тег Canonical в разделе <head></head>, указывающий адрес страницы пагинации:
<link rel="canonical" href="https://www.site/category/page-2/">На страницах пагинации необходимо уникализировать тег title во избежание дублей страниц.
[title] — Страница [номер страницы]
Купить кроссовки в интернет-магазине — Страница 2
Для первых страниц пагинации рекомендуем настроить 301 редирект на основные страницы без GET-параметров.
Например, со страницы https://www.site/catalog/page-1/ на https://www.site/catalog/.
При этом в html-коде необходимо разместить ссылку на основную каноническую страницу с 200 кодом ответа.
Также рекомендуем деоптимизировать страницы пагинации, чтобы не снижать релевантность основной страницы:
Сократить title, например продублировав заголовок h1 + страница (номер страницы)
Удалить SEO-текст или описание категории (если текст присутствует на странице)
Добавить микроразметку Schema.org
Стандартные элементы сайта необходимо разметить микроразметкой Schema.org. Для разметки данных рекомендуем использовать html-код, так как JSON не распознается Яндексом.
Хлебные крошки — https://schema.org/BreadcrumbList
Рейтинг — https://schema.org/AggregateRating
Контакты — https://schema.org/Organization
Новости — https://schema.org/NewsArticle
Товары — https://schema.org/Product
Отзывы — https://schema.org/Review
Статьи — https://schema.org/Article
Вопросы и ответы — https://schema.org/FAQPage
Подробнее о том, что такое микроразметки и готовые примеры кода микроразметки приведены в статье.
Для больших проектов настроить заголовки Last Modified и If-Modified-Since
Для больших сайтов (особенно важно для интернет-магазинов с большим ассортиментом товаров) настроить заголовки Last Modified и If-Modified-Since.
HTTP заголовок Last-Modified сообщает клиенту (браузеру, поисковому роботу) время последнего изменения страницы. Если клиент получил заголовок Last-Modified, то при следующем обращении к адресу, при условии, что страница есть в локальном кэше, он добавит запрос If-Modified-Since (не изменилась ли страница после даты, полученной в Last-Modified). В свою очередь сервер, получив запрос If-Modified-Since должен сверить полученную временную метку с временем последнего изменения страницы и, если страница не изменялась ответить 304 Not Modified.
Таким образом, если поисковый робот получит ответ 304 Not Modified, то он не будет обходить страницу, а будет обрабатывать только страницы с изменениями, тем самым повышая эффективность обхода сайта.
Подробнее: https://last-modified.com/ru/if-modified-since.html
На всех страницах сайта разместить навигационную цепочку Хлебные крошки
На всех страницах сайта, за исключением главной страницы, необходимо разместить навигационную цепочку Хлебные крошки. Навигационную цепочку необходимо разместить в начале страницы перед заголовком h1.
Хлебные крошки должны содержать путь к странице, начиная с главной страницы и включая последнюю страницу цепочки.
Все элементы цепочки, за исключением последней страницы, следует оформить в виде гиперссылок. Последний элемент цепочки следует оформить в виде текста более прозрачным шрифтом, чем остальные элементы цепочки.
Хлебные крошки необходимо разметить микроразметкой https://schema.org/BreadcrumbList.
Оптимизировать изображения
Необходимо использовать современные форматы изображений:
jpeg
jpg
png
svg
Вес изображений не должен превышать 1,5 мб.
Для всех изображений необходимо заполнить атрибут alt. Если данный атрибут не заполнен вручную при добавлении изображения, необходимо заполнить alt автоматически, подтянув в него заголовок h1.
URL изображения желательно оформить в виде ЧПУ.
Если на сайте размещено большое количество изображений, необходимо сгенерировать sitemap.xml для изображений.
Подробнее ознакомиться с файлом Sitemap можно в руководстве Google.
Комментарии (8)
ITairoff
00.00.0000 00:00Т.е. сайты без хлебных крошек будет индексироваться хуже чем с ними? А есть какие-то источники информации или это выводы из личного опыта?
sergeantgrey
00.00.0000 00:00+1да, они будут хуже. разница невелика, но если хочешь быть в топе рейтинга - каждая доля процента важна. проверял на нескольких проектах, где у нас топ 3 выдачи гугла.
для примера https://www.semrush.com/blog/breadcrumbs-for-websites/
ITairoff
00.00.0000 00:00По поводу паганации есть вопрос. Вопрос не от SЕО специалиста, а от разработчика. Если у меня кол-во страниц меняется динамически, скажем сегодня их 20, завтра будет 10 (продали много чего, что было в категории). Как должен реагировать сайт с точки зрения SEO? Куда мне вести пользователя с url `.../page-20` ?
Katyara12
00.00.0000 00:00-1Есть замечания по статье:
1) Для страниц пагинации зачем указывать каноникал на саму себя, а не на основную страницу категории?
Ведь в вашем случае страницы пагинации будут конкурировать между собой в результатах поиска.
2) Оптимизация изображений
С каких пор png, jpeg, jpg - современные форматы изображений? Автор, почитай, пожалуйста, про webp хотя бы :)
3) Забыли указать, что следует проверить дубли страниц с www.site.ru, /index.php, /index.html, /index.htm, /main.php, /main.html, /main.htm, /default.php, /default.html, /default.htm, со множеством слешей в url.
4) По sitemap.xml стоило бы указать рекомендуемый максимальный размер по ссылкам (макс 50к в одном файле) и весу файла 50мб.
5) Тема файла robots.txt так же не раскрыта, что надо закрыть от индексации, а что наоборот стоит открыть :)
dimsog
00.00.0000 00:00-1С каноникал для страниц не согласен, мы всегда указываем главную страницу, без пагинации, потому что могут быть проблемы:
1) сортировка
2) фильтрация
3) у вас обнаружены дубли страниц, аааа!
JohnnyYours
00.00.0000 00:00Спасибо за статью! ЗдОрово написано... но вот для меня это реальная проблема: таких советов, как вы даете, можно найти на просторах нэта с полсотни. Но почему-то никто не пишет КАК это сделать...
Например, вы пишите "На этапе разработки необходимо предусмотреть возможность автоматической генерации мета-тега title по заданному шаблону. Также необходимо предусмотреть, чтобы мета-тег можно было вручную редактировать на всех страницах сайта. " Как сделать, эту мазафака, автогенерацию????
Такая же ерунда с ЧПУ: как это делается?
И так практически по каждому пункту.
Тщетно пытаюсь найти, уже долгое время, типа, список SEO необходимых работ (примерно как вы расписали) в одной статье. Пока не повезло.
Если вы владеете данной тайной, может, сможете расписать и принести благо таким вот "чайникам", как я? А то живу, мучаюсь...))
digitalnomad777
00.00.0000 00:00отличная статья. по тегам title, description, H1, alt я бы добавил, что помимо уникальности и включения ключевых слов необходимо учитывать рекомендуемое количество символов. читал об этом во многих источниках, все рекомендуют примерно одинаковые диапазоны: по H1 40-60, по title чуть больше — до 80, по description около 150-200. alt заголовки до 100
monochromer
Я правильно понимаю, что в таком случае сортировка элементов пагинации должна работать так, чтобы на первых страницах были самые старые товары (пример магазина), а на последних - самые новые? Иначе, если на странице `page-1` будут отображаться самые новые товары, то со временем проиндексированный контент не будет соответствовать текущему.