Разработка и оптимизация сайта - это комплексный процесс, включающий в себя множество нюансов, от которых зависит не только удобство сайта для пользователей, но и его успешное продвижение.
Рассмотрим подробно основные рекомендации и лучшие практики по технической оптимизации сайта, которые помогут сделать ресурс более дружелюбным для поисковых систем, повысить его релевантность и конверсию.
Рассматриваемые аспекты включают в себя SEO-оптимизацию контента, настройку файлов robots.txt и sitemap, работу с редиректами, скорость загрузки, адаптивность, использование микроразметки и другие важные моменты.
1. Закрытие сайта от индексации
При разработке сайта на домене или поддомене, пока сайт еще не готов к публикации, рекомендуется закрыть его на техническое обслуживание и от индексации поисковыми системами.
Правильный robots.txt для поисковых систем с запретом индексирования:
User-agent: *
Disallow: /
2. Настройка файла Robots.txt
Когда сайт готов, в файле Robots.txt закрываем от индексирования:
админ. разделы, фильтры и сортировки, кэш, логи, корзина, страницы с параметрами, которые не хотим индексировать.
Разрешаем к индексированию:
файлы js, css, изображения, pdf, doc, xls.
Добавляем ссылку на карту сайта sitemap.xml
https://yandex.ru/support/webmaster/controlling-robot/robots-txt.html
https://support.google.com/webmasters/answer/6062608?hl=ru&ref_topic=6061961
3. Настройка карты сайта Sitemap.xml
Для упрощения процесса индексации поисковыми системами рекомендуется использовать автоматически обновляемую карту сайта в формате XML. Это позволит быстрее добавлять новые страницы в индекс.
4. Код в шаблоне (валидность кода)
Шаблон страницы строится по правилам:
- Все открывающиеся теги должны иметь закрывающиеся.
- Вложенность должна быть логичная и конечная.
- Если не будет каких-то важных тегов или закрывающих — может поехать верстка. Могут быть проблемы валидации кода, могут не читаться какие-то важные моменты типа микроразметки.
- Все основные теги — html, head, body должны быть в каждом шаблоне.
- Скрипты нужно подгружать из отдельных js-файлов (за исключением скриптов метрики, аналитикс).
- Не оставлять больших кусков закомментированного кода в верстке (оптимально – удалять все комментарии на этапе вывода html-кода).
- Не использовать теги визуального и логического выделения (strong, b, i, em) для оформления в блоках дизайна.
- Не использовать заголовки h1-h6 для сквозных блоков в футере, хедере, сайдбаре, модальных окнах.
- Используем только один заголовок h1 на странице и после h1 – уже h2 и далее согласно структуре текста.
- Для мета-тегов title, description и атрибута ALT для изображений – если встречаются двойные кавычки в описаниях этих тегов – переделывать их на «кавычки-елочки», чтобы код был валидным и правильно читался ПС.
- Все CSS стили должны быть вынесены из тела страницы в отдельные файлы.
5. Формирование ЧПУ для страниц сайта
Основные моменты при формировании чпу:
- Адрес страниц не должен быть длинным;
- ЧПУ должен состоять из латинских букв, символов и цифр;
- Слова в адресе разделять дефисом. Пробелы и нижние подчеркивания (_) не использовать, так как поисковые системы могут плохо читать такие урлы (в частности, Google может игнорировать написание через нижнее подчеркивание);
- Не использовать символы ! % ( ) " ';
- Использовать ключевые запросы в ЧПУ;
- Однотипные ЧПУ с параметрами нужно писать по маске, например параметры типа «290х95х82» можно представлять как: 290х95х82 или 290-95-82.
Общие требования к адресам страниц (URL):
- Единый формат для всех адресов сайта;
- Транслитерация кириллического текста;
6. Настраиваем https протокол
Для повышения безопасности и доверия пользователей рекомендуется настроить протокол HTTPS на сайте.
7. Склейка сайта (редиректы)
Склеиваем домен
Сайт должен открываться либо с www, либо без www.
Прописываем 301 редирект на основное зеркало сайта.
Так же добавляем 301 редирект с index.php / index.html / index.htm на корень сайта
Склеиваем внутренние страницы
- Внутренние страницы должны открываться только по одному адресу, либо со / на конце, либо без /. Предпочтительный вариант со / на конце. Проставляем 301 редирект на один из вариантов.
- Если страницы кроме слеша на конце, могут открываться с разными расширениями на конце типа php, html, htm — также ставим редиректы на однозначный URL со / на конце.
Склеиваем https и http
Со всех вариантов http и с одного варианта с https (c www или без www) нужно прописать редирект на главное зеркало сайта с https.
8. Настройка страницы с 404 ошибкой
Создаем страницу с 404 ошибкой, не в дизайне сайта https://yandex.ru/support/metrica/stand-out/informative-page-404.html
Не существующие страницы должны отдавать код ошибки 404.
9. Правильные ссылки на внутренние страницы в коде
Если у нас ссылки на внутренние страницы со / на конце, то в коде они и должны быть прописаны именно так, чтобы не генерировались лишние 301 редиректы.
10. Внешние ссылки на сторонние ресурсы
Закрываем в noindex и nofollow, добавляем открытие в новом окне.
<!-- noindex --><a target=_blank href="http://site.ru" rel="nofollow"> Анкор</a><!--/ noindex -->
11. Настройка пагинации
- настраиваем свои мета теги на страницах пагинации (добавляем к title, description – страница 2,3…);
- не передаем текст с основной страницы каталога (текст не должен дублироваться на страницах пагинации);
- не делаем страницу №1, так как она будет полным дублем основной страницы раздела: то есть настраиваем 301 редирект со страницы с параметром page=1 на основной раздел;
- настраиваем Canonical на страницах пагинации на основной раздел (опционально) или же для страниц пагинации прописывает мета тег robots с параметрами noindex, follow;
12. Скорость загрузки страниц
https://developers.google.com/speed/pagespeed/insights/
https://gtmetrix.com/
Используем кеширование
Оптимизируем изображения (файлы не должны быть большого размера и разрешение изображений должно соответствовать отображаемому, чтобы, например для изображения, которое отображается с разрешением 300х200 - не загружался файл с разрешением 1200х800).
Оптимизируем js, css файлы и код в них (объединяем, мимимизируем)
Добавляем gzip сжатие (проверка: https://www.giftofspeed.com/gzip-test/)
13. Хлебные крошки
Добавляем «Хлебные крошки» на все страницы сайта кроме главной (без последней крошки, дублирующей Н1/название страницы)
Названия крошек не должны совпадать с H1 и названием раздела полностью
14. Необходимые поля в админке сайта для SEO
Для удобства оптимизации контента в админ-панели сайта рекомендуется добавить отдельные поля для SEO:
- Название страницы
- Поле для title
- Для description
- Для H1
- Для текстов (если интернет-магазин — до и после листинга товаров должны быть текстовые блоки)
- Поле для ЧПУ
- Поле для 301 редиректа
- Поле для названия хлебной крошки
- Поле для пункта меню
- Возможность задавать мета-теги по шаблону.
- H1 не должен совпадать с title
- Должна быть возможность сделать h1, хлебную крошку, название пункта меню – разными.
15. Favicon
Добавляем favicon в формате SVG или 120 × 120 пикселей https://yandex.ru/support/webmaster/search-results/create-favicon.html
16. Микроразметка Schema.org
Для структурирования данных на сайте рекомендуется использовать микроразметку по спецификации Schema.org.
Организация, хлебные крошки, статьи, отзывы, карточки товаров и др. в зависимости от типа страниц.
https://yandex.ru/support/webmaster/schema-org/what-is-schema-org.html
17. Разметка Opengraph
Для улучшения представления сайта в социальных сетях следует добавить микроразметку Open Graph
https://yandex.ru/support/webmaster/open-graph/
18. Проверяем сайт на наличие критических ошибок
Перед публикацией сайта рекомендуется проверить код на валидность и отсутствие критических ошибок.
https://validator.w3.org/
Ошибок не должно быть слишком много.
19. Анализ сайта на ошибки в консоли браузеров
Необходимо проверить сайт на наличие ошибок и предупреждений, которые отображаются в консоли различных браузеров. В случае наличия таких ошибок - необходимо принять меры по их устранению.
20. В теге <HTML> прописываем атрибут lang
В HTML коде сайта рекомендуется указывать язык страницы с помощью атрибута lang.
21. Кроссбраузерность, адаптивность, оптимизация под мобильные устройства
Сайт должен корректно отображаться на различных устройствах, быть кроссбраузерным и адаптивным, оптимизированным для мобильных.
Проверить оптимизацию под мобильные устройства
https://search.google.com/test/mobile-friendly
22. Политика конфиденциальности
Наличие в формах со сбором персональных данных – галочки на согласие обработки данных по ФЗ №152 с ссылкой на страницу политики конф.
23. Атрибут ALT у изображений
Все изображения на сайте должны содержать атрибут ALT с подходящим описанием + автоматическое заполнение в тех местах, где это можно добавить (например, подстановка названия товара/раздела)
