От автора: если вы создаете веб-сайт или веб-приложение с использованием JavaScript, вам следует предпринять несколько основных действий, чтобы обеспечить доступность вашего контента для поисковых систем. Давайте рассмотрим несколько методов SEO, которые помогут пользователям найти ваш контент.
1. Создайте описательный тайтл
Все ваши страницы должны иметь описательный и полезный тайтл, который кратко рассказывает, о чем эта страница. Этот заголовок должен быть размещен в теге title, также желательно иметь на странице тег h1.
Например, на страницах рецептов избегайте использования общих названий, таких как «Кулинарный блог Аманды». Вместо этого в тайтле каждой страницы должно содержаться название рецепта, чтобы было понятно, о чем эта страница.
Вам также нужно предоставить описание того, что конкретно будет содержать страница. Например, что делает этот рецепт особенным или каковы его основные характеристики. Это дает людям что-то, что может помочь им определить самую подходящую для их цели страницу, а Google дает понимание того, насколько страница релевантна поисковому запросу.
Заголовок и метатеги
И то, и другое можно сделать, добавив в разметку заголовок и метатеги. Вы можете проверить свои страницы на наличие этих тегов, щелкнув правой кнопкой мыши -> Проверить, найти //title и //meta.
Поиск по //title
Если вы не видите весь контент в разметке, вы, вероятно, используете JavaScript для отображения страницы в браузере. Это называется рендерингом на стороне клиента, и это не является проблемой само по себе.
Рендеринг
Рендеринг — это процесс заполнения шаблонов данными из API или баз данных. Это может происходить как на стороне сервера, так и на стороне клиента. Когда это происходит на сервере, сканеры и пользователи сразу получают весь контент в виде HTML-разметки.
В одностраничных приложениях сервер часто отправляет шаблоны и Javascript клиенту, а затем Javascript выбирает данные из серверной части, заполняя шаблоны по мере поступления данных.
2. Правильная перелинковка страниц
Еще одна важная деталь — позволить роботу Googlebot сканировать страницы сайта, правильно перелинковывая их. Не забудьте включить полезные ссылки и текст, и использовать HTML-тег анкора с целевым URL ссылки в атрибуте href.
Перелинковка страниц в HTML
НЕ применяйте другие элементы HTML, такие как div или span или обработчики событий Javascript. Мало того, что сканеры будут иметь сложности с поиском и отслеживанием этих псевдо-ссылок, это также вызывает проблемы для вспомогательных технологий (a11y).
Ссылки являются важной функцией Интернета и помогают поисковым системам и пользователям находить и понимать отношения между страницами. Если вы используете JavaScript для улучшения перехода между отдельными страницами, используйте history API с обычными URL-адресами вместо метода маршрутизации на основе #.
Метод маршрутизации на основе хеша
Использование хешей, также называемых идентификаторами фрагментов, для различения разных страниц — это хак, который сканеры должны игнорировать.
History API
С другой стороны, использование history API с обычными URL обеспечивает чистое решение для той же цели. Не забудьте проверить страницы и конфигурацию сервера при использовании JavaScript для выполнения маршрутизации на стороне клиента.
Робот Google будет посещать ваши страницы индивидуально. Таким образом, ни service worker, ни JavaScript не будут распознаны при первых посещениях.
Проверьте, что увидит пользователь, открыв ваши URL-адреса в новом анонимном окне. Страница должна загружаться с кодом состояния HTTP 200, и все ожидаемое содержимое должно быть видимым.
3. Использование правильной семантической разметки HTML
Использование правильной семантической разметки HTML помогает пользователям лучше понимать контент и быстрее перемещаться по нему. Вспомогательные технологии, такие как программы чтения с экрана и сканеры, также полагаются на семантику контента.
Используйте заголовки, разделы и абзацы, чтобы очертить структуру контента. Используйте HTML-теги изображения и видео с подписями и альтернативным текстом для добавления визуальных элементов. Сканеры и вспомогательные технологии должны найти этот контент и показать его своим пользователям.
Напротив, если вы используете JavaScript для динамической генерации разметки, убедитесь, что вы случайно не блокируете робота Googlebot в первоначальной разметке.
Первый раунд индексации не выполняет JavaScript. Наличие в начальной загрузке такой разметки, как метатег noindex, может помешать роботу Googlebot запустить второй этап с JavaScript.
Выполнение этих рекомендаций поможет роботу Google лучше понять ваш контент и сделать его более доступным для поиска Google.
Автор: Aiman Rahmat
Источник: //levelup.gitconnected.com
Редакция: Команда webformyself.