Рассылка
SEOЧек-листыSEO для разработчиков

Чек-лист по SEO для разработчиков

2022-11-11
(57)
SEO для разработчиков

Часто предприниматели и даже маркетологи создавая продающий сайт игнорируют SEO, думая о том, что поисковой оптимизацией нужно заниматься намного позже (вероятно, когда сайт уже будет готов). Это приводит к тому, что на плечи разработчиков ложится учет SEO-требований платформы, которые им никто не предоставляет. Именно в этот момент происходит спасение клиента от того, чтобы при запуске сайта он не выстрелил себе в ногу.

Так что же должен учесть разработчик сайта из области SEO, чтобы ему не пришлось потом переделывать свою работу?

Семантическая и структурированная верстка
Пункт №1 - Семантическая и структурированная верстка.

Используйте в коде страниц сайта теги, соответствующие роли элементов: для шапки сайта — <header>, для подвала сайта — <footer>, а для основного меню — <nav> (по-прежнему проверяя их уровень поддержки браузерами). Если вы хотите вывести таблицу, то используйте тег <table>, а не набор контейнеров <div>. Основной заголовок страницы должен находиться в теге <h1>, а остальные заголовки в зависимости от уровня вложенности в тегах <h2>, <h3> .. <h6>.

Семантические URL страниц
Пункт №2 - Семантические URL страниц.

Первое, что поисковая система узнает о странице — её адрес. Исходя из адреса страницы алгоритмы поиска могут представлять каким запросам она соответствует. Этим нужно пользоваться и использовать транслитерацию основного слова или фразы, которым соответствует страница. Например, вместо "page-187" лучше использовать "ugolnye-grili".

Возможность публикации SEO-тегов
Пункт №3 - Возможность публикации SEO-тегов.

У владельца сайта и маркетологов должна быть возможность без затруднений исправить тег Title и мета-тег Description каждой страницы. Как правило именно их содержимое берется в качестве заголовка и текста описания страницы в поиске.

Настройка SSR или его альтернатив
Пункт №4 - Настройка SSR или его альтернатив.

Отлично, если ваш проект использует Server Side Rendering, когда сервер сразу отдает итоговый HTML браузеру, без необходимости дополнительной загрузки базового контента посредством JavaScript.

Если же вы работаете на технологиях SPA (React, Angular и т.п.), то обязательно настройте пререндеринг итогового HTML для поисковых ботов. В противном случае поисковые системы не увидят часть вашего контента, а может и вообще посчитают страницы пустыми и малополезными.

Настройка 404 ошибки
Пункт №5 - Настройка 404 ошибки.

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

Автообновляемая XML карта сайта
Пункт №6 - Автообновляемая XML карта сайта.

Самый простой способ узнать об изменениях в страницах сайта для поискового бота — посетить файл XML карты сайта, со списком действующих страниц сайта и датой их последнего обновления (атрибут <lastmod>).

Закрытие служебных директорий
Пункт №7 - Закрытие служебных директорий.

Для того, чтобы поисковые системы не тратили свои ресурсы на обход ваших служебных директорий с ядром сайта и важными серверными скриптами, их нужно закрывать от сканирования. Делается это директивами вроде "Disallow: /cgi-bin/" в файле robots.txt, который всегда расположен в корневой директории сайта (если его создали).

Установка HTTP-авторизации на тестовом домене
Пункт №8 - Установка HTTP-авторизации на тестовом домене.

Создали тестовый домен для показа сайта клиенту перед релизом? Обязательно ещё в момент создания этого домена настройте для него HTTP-авторизацию. Так поисковые боты никогда не доберутся до вашего тестового домена и его контент не попадет в поиск.

Альтернативный текст для изображений
Пункт №9 - Альтернативный текст для изображений.

Используете не только иконки и текстуры, но и значимые для контента изображения — логотип, фотографии, баннеры и инфографику? Обязательно заполните для них содержимое атрибута alt тега <img>, где лаконично расскажите о том, что на них изображено.

Указание языка контента
Пункт №10 - Указание языка контента.

Не забудьте указать контейнеру <html> атрибут lang со значением языкового кода того языка, который используется на сайте. В контенте выводятся цитаты на других языках? Укажите и их контейнерам атрибуты lang с соответствующими языковыми кодами по стандарту ISO 639-1.

Оптимизация скорости загрузки
Пункт №11 - Оптимизация скорости загрузки.

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

Иконки сайта
Пункт №12 - Иконки сайта.

Укажите в контейнере <head> каждой страницы тег <link>, ссылающийся на фавиконку сайта (лучше всего в формате SVG). Добавьте иконки "apple-touch-icon" различного разрешения, чтобы в закладках у пользователей мобильных устройств ссылка на ваш сайт выглядела привлекательно.

Разметка для социальных сетей
Пункт №13 - Разметка для социальных сетей.

При публикации ссылки в социальных сетях и мессенджерах сайт может выглядеть всяко.. Повлиять на то, какой заголовок, изображение и описание покажет социальная сеть можно используя микроразметку Open Graph, а именно - её поля title, description, image.

Всплывающие формы и скрытый контент
Пункт №14 - Всплывающие формы и скрытый контент.

Наверняка на вашем сайте есть всплывающие формы, которые дублируются на каждой странице: обратный звонок, заявка, форма подписки. Не выводите их в базовом HTML странице (просто скрывая посредством CSS), гораздо лучше выводить весь их контент с помощью JavaScript, чтобы он не делал страницы сайта менее уникальными и релевантными запросам пользователей.

Отсутствие двойной вёрстки
Пункт №15 - Отсутствие двойной вёрстки.

Не создавайте две версии меню и других элементов в HTML-коде, скрывая одну на мобильных устройствах, а другую — на компьютерах. Поисковые боты читают именно ваш HTML, а значит, они увидят дублирование контента и ссылок.

Недоступность технических дублей
Пункт №16 - Недоступность технических дублей.

Закройте доступ к своим индексным файлам (index.php, index.html и т.п.) с помощью 301 редиректов на адреса соответствующих директорий. Также важно убедиться, что на основную версию сайта перенаправляют 301 редиректами и её 3 остальных зеркала: с префиксом www, без префикса www, с протоколом http и с протоколом https.

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

Указание основных версий страниц
Пункт №17 - Указание основных версий страниц.

Укажите с помощью тега <link> с атрибутом rel=canonical основной адрес для каждой страницы. В случае, если поисковый бот посетит эту страниц с дополнительными параметрами или в какой-то вложенной директории, то поймет какая версия является основной и должна попасть в поиск.

Отсутствие географических редиректов
Пункт №18 - Отсутствие географических редиректов.

Откажитесь от так называемых гео-редиректов: когда с помощью сторонних сервисов сопоставляется IP пользователя с регионом и происходит его перенаправление на соответствующую региональную версию сайта. Поисковый бот Google сканирует сайты из Сан-Франциско, а Яндекса — из Москвы, а значит часть вашего контента будет для них недоступно.

Если исходя из бизнес-задач вам все-таки нужно делать такие редиректы, то убедитесь, что не перенаправляете поискового бота.

Оцени чек-лист
Илья Горбачев - автор SEO Rocket
Автор чек-листа
Илья Горбачев
Управляющий партнёр в Rocket Agency.

Продвигал основные сайты таких компаний как ВТБ, Альфа-Банк, Газпром АГНКС, Технопарк и BMW Борисхоф.

Спикер конференций Optimization в Сколково, Merge в Иннополисе, SEO без воды и многих других.

Хочешь больше крутых материалов, разбор своего сайта или доступ к уникальным приватным сервисам?

Илья Горбачев, создатель Rocket Club.

Тогда присоединяйся к моему закрытому клубу.