30 SEO требований при разработке нового сайта

BOOX

Стаж на ФС с 2012 года
Команда форума
Служба безопасности
Private Club
Регистрация
23/1/18
Сообщения
29.223
Репутация
11.695
Реакции
61.957
RUB
50
SEO требования актуальны в первую очередь под Google, однако большая их часть подойдет и для Яндекса.


Проектирование сайта с участием SEO-специалиста и с учетом SEO требований значительно упрощает дальнейший процесс продвижения и ускорят рост органического трафика с поисковых систем.

Приведенные ниже базовые SEO требования при разработке нового сайта рекомендуется дополнить и конкретизировать под ваш сайт на основе анализа конкурентов, всех видов страниц конкурентов и их функционала, а также микроразметки.

chrome-seo-copy-1.jpg

1. Корректный ответ сервера

Должна быть настроена отдача корректных кодов HTTP ответа сервера: 200, 301, 404, 503.

2. 301 редиректы с зеркал и ошибочных url

Должны быть настроены шаблонные 301 редиректы
Следует также проверить, чтобы страницы вида , и т.п. были недоступны (404) или редиректили на страницы с корректным url.

3. Страница 404 ошибки

Страница 404 ошибки должна отдавать код 404 и быть сделана в шаблоне сайта со ссылками на основные страницы, а также содержать текстовую информацию об ошибке.

4. Настройка Link rel canonical

На каждой странице сайта необходимо настроить атрибут rel="canonical". Он определяет каноническую страницу для поисковых систем.
Технические требования
  • URL в canonical указывается в абсолютном виде, т.е. .
  • Для страниц с get-параметрами ( ) в url в качестве каноничной указывается страница без него.
  • Для страниц с пагинацией в качестве каноничной указывается эта же страница с пагинацией, даже если используется get-параметр (!!!).
  • Для страниц с полностью одинаковым контентом, но разным url обязательно должна быть указана только одна каноничная страница.

5. Настройка meta robots

Необходима возможность добавлять мета-тег <meta name="robots" content="..." /> для всех страниц сайта, а также шаблонно для разделов. По умолчанию значение тега должно быть <meta name="robots" content="index, follow" />.

6. robots.txt на время разработки сайта

На время разработки сайта на его тестовой версии размещаем в корневом каталоге сайта вариант robots.txt запрещающий его обход ботами поисковых систем:
User-agent: *
Disallow: /

7. robots.txt для созданного сайта

В robots.txt запрещаем обход страниц с вводом персональных данных, авторизации, поиска информации, сортировок, фильтров и т.п. Добавляем ссылку на карту сайта. Пример:
User-agent: *
Disallow: /cart/
Disallow: /profile/
Disallow: /user/
Disallow: /payment/
Disallow: *sort=
Disallow: *filter=
Sitemap:

8. sitemap.xml

Sitemap.xml рекомендуется для всех сайтов, у которых более 100 страниц.
Технические требования к sitemap.xml:
  • Xml разметка.
  • Должен содержать только URL, отдающие код 200.
  • Должен содержать только URL, доступные для индексации в поисковых системах.
  • Максимальное количество URL - 50 000.
  • Если на сайте более 50 000 Url, то создается индексный файл карт и дочерние карты сайта.
  • Размер каждого файла - до 10 Мб.
  • Не должно быть пустых полей.
  • Обновление файла минимум 1 раз в сутки, лучше сразу после создания или удаления страниц с сайта.
  • Кодировка - UTF-8.
  • Упоминанием url sitemap в robots.txt
Теги к заполнению:
  • <loc> - URL страницы в абсолютном виде,
  • <lastmod> - дата последнего обновления контента страницы (можно пропустить этот тег, но желательно передавать в него актуальную дату создания / правки контента).
Если на сайте более 50000 url доступных для индексирования в поисковых системах, то создается индексный файл карты сайта и дочерние. Также можно создавать отдельную карту сайта для видео, картинок и новостей. Документация от Google по ссылке

9. Мультирегиональные сайты

В случае сайта с контентом на разных языках, либо имеющего отличия в контенте и политиках под разные страны, рекомендуется использовать языковые папки. Соответственно контент располагаем в этих папках, например,
Для корректного ранжирования таких сайтов в различных регионах обязательно добавить атрибуты hreflang на страницы у которых есть альтернативы на других языках. Пример:
webp


Технические требования:
  • Hreflang должны быть на всех страницах сайта, у которых есть альтернативы на других языках.
  • URL внутри тега должен быть абсолютный.
  • Все ссылки hreflang должны быть взаимными.
  • Возможно также указание пар “язык-страна”.
Подробности см. в рекомендациях Google

10. Переключатель языков

Добавляем в шаблон страниц сайта переключатель языков, в котором будут указаны гиперссылки на другие языковые варианты текущей (!!!) страницы. Переключатель выводим только для тех страниц, для которых есть альтернативы на других языках.
Частая ошибка в переключателе - ссылки стоят на главные страницы языковых папок, либо гиперссылки вообще отсутствуют.

11. Серверный рендеринг или пререндер для сайтов на JS-фреймворках

Если сайт планируется создать на JS-фреймворках таких как React, Vue и т.п. то обязательно рекомендуется подключить серверный рендеринг страниц в статический html-код для ботов поисковых систем. Это типичная рекомендация для SPA / PWA сайтов. Для React используется Next.js, для Vue - Nuxt.js. Подробнее о видах рендеринга можно прочитать здесь
В статическом коде должны быть:
  • Мета-теги и h1.
  • Meta robots, canonical, hreflang.
  • Микроразметка и OpenGraph разметка.
  • Все элементы перелинковки: футер, меню, пагинация и т.п.
  • Все тексты и картинки.
  • Товары (хотя бы 20-30 шт.), их названия, цены если это листинг.
После внедрения на тесте проверям все ли корректно работает по методике вот этой статьи

12. Политика по наличию контента и картинок в html-коде

Даже на не SPA / PWA сайтах часть контента страницы может подгружаться после загрузки html-кода. Поэтому важно чтобы:
  • Весь текстовый контент должен быть в статичном html-коде.
  • Lazy-load для товаров и картинок рекомендуется настраивать только с 3 экрана, но точно не с первого.
  • Визуальное скрытие контента, если оно требуется, делаем при помощи CSS (а не подгружаем его по нажатию на кнопку). Вариантов много: .

13. Пагинация

Технические требования к страницам пагинации:
  • Должны быть доступны для обхода поисковыми ботами и индексации.
  • На страницах не выводим SEO-текст и не выводим оптимизированные мета-теги.
  • Для мета-тегов и H1 рекомендуется использовать шаблон: %Название раздела% - Страница %page-number%.
  • Первая страница пагинации т.е. /catalog/page-1 или /catalog/?page=1 должна редиректить на основную страницу листинга /catalog/.
  • Несуществующие страницы пагинации должны отдавать 404 код, например, ?page=0, ?page=9999.
  • Каноничной должна быть сама страница пагинации (!!!), а не страница листинга.

14. Open Graph разметка

Open Graph разметка нужна для корректного отображения ссылок на сайт в соцсетях и мессенджерах.
Обязательные элементы:
  • og:title — название страницы.
  • og:description — описание страницы.
  • og:type — тип объекта.
  • og:image — URL изображения, описывающего объект.
  • og:url — канонический URL страницы.
Справочная информация:

15. Микроразметка Schema.org

Рекомендуется размещать разметку Schema.org в виде кода JSON-LD в разделе <head> html-кода страницы. Какую разметку применяем:
  • Organization для Главной, Контактов, О компании.
  • LocalBusiness аналогичный вариант, если вы предоставляете сервис только в одном или нескольких регионах, а не по всей стране.
  • Webpage или другой контейнер с информацией о компании, контактах, странице, сайте, соцсетях и т.п. Применяем на всех страницах.
  • BreadcrumbList на всех страницах, где есть хлебные крошки.
  • ItemList с вложенным типом Product для листингов с продукцией.
  • Product с вложенным типом AggregateOffer для страницы с одним товаром или офером, т.е. если есть предложения от разных продавцов.
  • Product и если есть функционал (!!!) рейтинга товара или отзывы, то с типом AggregateRating - для страниц товаров
  • Article , , с сущностью “author” с типом “Person” (с указанием автора, ссылкой на его профиль на сайте и соцсети).
  • FAQPage для блока вопросов и ответов после статьи.
  • NewsArticle для новостей.

Обязательно валидируем разметку тут

16. Закрытие от индексации тестовых сайтов и поддоменов

Тестовые сайты и технические поддомены необходимо закрыть от индексации при помощи следующих вариантов (любой из):
  • Http-авторизации.
  • Отдачи 404, 403 кода по всем страницам.
  • Запрета индексации в meta robots и обхода в robots.txt (только в robots.txt закрыть недостаточно).
Обязательно проверяем не закрыли ли от индексации основной домен!

17. Политика в отношении внешних ссылок и пользовательского контента

Если на сайте возможна публикация комментариев / отзывов или статей пользователей, то перед публикацией они должны проходить как минимум автоматическую модерацию (лучше ручную). Для защиты от спама рекомендуется использовать ReCaptcha.
Рекомендуется для внешних ссылок (ссылок на сторонние сайты со страниц вашего сайта) использовать атрибуты rel="nofollow" и target="_blank". Гиперссылки из комментариев и со страницы профиля пользователя (если этот функционал есть) недопустимы.

18. Структура сайта и URL страниц

Общие рекомендации по структуре URL посадочных страниц:
  • Использовать ЧПУ (человеко понятные url).
  • Использовать в url тематические и ключевые слова, но не более 2х раз если это однокоренные слова.
  • Избегать использования динамических параметров в url.
  • Не использовать в адресе параметров id-сессии.
  • В качестве разделителя слов использовать “-”.
  • Все символы, кроме латиницы и цифр в символьном коде адреса страницы заменять на “-”.
  • Использовать только символы в нижнем регистре.
Для сайтов под различные языки возможно использование символов локального языка в url. Пример:

webp

Символы арабского алфавита в url

19. Семантическая разметка HTML

Рекомендуется использовать следующие структурные элементы в коде:
  • <header>,
  • <nav>,
  • <article>,
  • <section>,
  • <footer>,
  • <main>.
Подробнее .
Заголовки контента оформляем в теги <H1>…<H4>. Меню и прочие элементы в шаблоне сайта оформляем при помощи CSS, не используем для этого теги H.

20. Блоки для навигации и SEO перелинковки

Меню
В меню необходимо разместить ссылки на все основные разделы и подразделы сайта.
Дополнительно в раскрывающихся или выпадающих списках рекомендуется вывести наиболее важные для SEO и пользователей страницы.
Футер
В футере рекомендуется вывести:
  • Логотип, название бренда и контактную информацию.
  • Ссылки на мобильные приложения в сторах и группы в соцсетях.
  • Ссылки на онлайн чат / службу поддержки.
  • Ссылки о компании и услугах: Контакты, О компании, FAQ, Помощь.
  • Ссылки на политики: Политика конфиденциальности, Политика об обработке cookies и т.п.
  • Ссылки на важные для SEO страницы, которые не влезли в меню.
Хлебные крошки
Выводим на всех внутренних страницах, последний пункт крошек (текущая страница) делаем некликабельным.
Дополнительные блоки перелинковки для SEO
Для каждой страницы используем минимум 2-3 дополнительных блока для перелинковки. Идеи для блоков берем на основе конкурентов.

21. Мета-теги и title

Нужна возможность задавать вручную для каждой страницы: Title, Description, H1. Также нужна возможность настраивать шаблоны тегов по разделам сайта, т.е. для всех страниц одного вида.

22. SEO тексты

На каждой посадочной странице необходимо по умолчанию предусмотреть минимум одно поле для SEO текста внизу страницы.
Оптимальный вариант: одной поле на небольшой текст 100-150 слов вверху страницы и второе поле внизу страницы.
При верстке абзацев внутри текста используем <p>, но не <div> или <span>.

23. Гиперссылки

Гиперссылки должны быть оформлены в виде <a href="/catalog/page/">anchor</a>, другие варианты недопустимы. При оформлении ссылки в виде кнопки button или любым другим способом дублируем ее также ссылкой <a href=””>.

24. Картинки

Рекомендуется использовать сгенерированные или созданные клиентом изображения. Стоковые картинки не рекомендованы, но возможны.
Нельзя использовать картинки из интернета без письменного разрешения правообладателей во избежание судебных претензий. Обязательно предупредите об этом заказчика сайта.

Технические требования к картинкам:
  • Настроить ресайз и сжатие картинок при загрузке через CMS.
  • Использовать ключевые слова в названии файла картинки.
  • Для ускорения загрузки картинок можно использовать CDN.
  • Использовать адаптивные изображения и указывать путь к ним в теге srcset.
  • Путь к изображению с максимальным разрешением указывать в теге src.
  • Нужна возможность заполнять alt изображения вручную, он должен быть тематичным изображению и абзацу, в котором он расположен.
  • Не использовать CSS для показа важных картинок.

Не SEO, но не менее полезно

Далее приведены краткие рекомендации, которые повышают удобство использование сайта, его безопасность и скорость загрузки.

25. Адаптивность сайта

Само-собой разумеется также надо помнить про принцип mobile-first.

26. Валидность HTML

Можно проверить в , однако для SEO специалиста достаточно сложно понять какие ошибки критичные, а какие нет.

webp

27. SSL сертификат

Корректность работы сертификата можно проверить в одном из чекеров, например, в .
  • Для большинства сайтов подойдут сертификаты подтверждающие домен (DV SSL).
  • Для сайтов коммерческих компаний и сайтов с онлайн-платежами и авторизацией лучше использовать сертификаты подтверждающие организацию (OV SSL).
  • Для крупных финансовых компаний, е-комов и т.п. лучше использовать сертификаты с расширенной проверкой (EV SSL).

28. Сжатие данных

Для JS, CSS, шрифтов и прочих статических ресурсов должно использоваться сжатие, например, GZIP. Также следует включать сжатие текста.

29. Кеширование

Задайте правила кэширования для статических объектов. Для неизменяемых объектов имеет смысл выбрать срок кэширования от месяца и более.

30. HTTP Security Headers

HTTP заголовки важны для безопасности сайта. Рекомендуется настроить обработку:
  • X-Frame-Options
  • Strict-Transport-Security
  • X-Content-Type-Options
  • Referrer-Policy
  • Content-Security-Policy
Проверяем Security Headers тут


 
  • Теги
    seo оптимизация разработка нового сайта
  • Сверху Снизу