Теперь, когда мы обсудили различия между индексированием и сканированием, а также влияние JavaScript на поисковую оптимизацию, мы теперь рассмотрим лучшие практики для JavaScript SEO.
5-секундный тайм-аут
Хотя Google официально не заявляет, известно, что Google не должен ждать более 5 секунд. Поэтому любой контент (около 5 секунд) в событии загрузки может быть проиндексирован.
Индексируемые URL-адреса
Для страниц требуются индексируемые URL-адреса с поддержкой на стороне сервера для каждой целевой страницы. Это включает в себя каждую категорию, подкатегорию и страницу продукта.
Использование функции «Обзор» вашего браузера
Как только отрендеренный HTML-код будет доступен и будет соответствовать уровню традиционной целевой страницы, который ожидает Google, многие влияющие факторы исчезнут сами собой.
Для просмотра отображаемого HTML и общих элементов JavaScript можно использовать функцию «Проверить элемент» в Google Chrome, чтобы получить дополнительную информацию о веб-странице, которая скрыта от просмотра пользователями. Чтобы обнаружить скрытые файлы JavaScript, такие как поведение пользователя при взаимодействии с веб-страницей, вы можете получить эту информацию на вкладке «Ресурсы» «Элемент проверки».
Если вы не видите весь свой контент в элементе обзора, скорее всего, вы используете JavaScript, известный как рендеринг на стороне клиента, для рендеринга в браузере.
Инструмент проверки URL в GSC

Инструмент проверки URL-адресов позволяет вам анализировать конкретный URL-адрес на вашем веб-сайте, чтобы понять точный статус того, как его просматривал Google. Инструмент проверки URL-адресов предоставляет больше информации, чем индекс Google, например, о сканировании, индексировании и ошибках структурированных данных, вызывающих проблемы.
Увеличить скорость загрузки страницы
Google заявил, что скорость страницы является одним из сигналов, используемых его сложными алгоритмами для ранжирования страниц, а более высокая скорость страницы позволяет ботам поисковых систем увеличивать количество страниц, которые сайт помогает в общей индексации. С точки зрения JavaScript, создание более интерактивной и динамичной веб-страницы для пользователей может привести к некоторым затратам, связанным со скоростью страницы. Чтобы смягчить это, может быть целесообразно использовать позднюю загрузку для определенных компонентов, которые не совсем необходимы, обычно в верхней части экрана.
Будьте настойчивы в своих усилиях по SEO на странице
Все правила SEO на странице, которые входят в оптимизацию вашей страницы, чтобы помочь им ранжироваться в поисковых системах, по-прежнему применяются. Оптимизируйте теги заголовков, метаописания, атрибуты alt на изображениях и метатеги роботов. Уникальные и описательные заголовки и метаописания помогают пользователям и поисковым системам легко идентифицировать контент. Обратите внимание на цель поиска и стратегическое размещение семантически релевантных ключевых слов.
Также хорошо иметь оптимизированную для SEO структуру URL. В некоторых случаях веб-сайты реализуют изменение URL-адреса pushState, что сбивает с толку Google, пытающегося найти стандартный. Обязательно проверьте URL-адреса на наличие таких проблем.
Убедитесь, что ваш JavaScript отображается в дереве DOM
Рендеринг JavaScript работает, когда DOM страницы достаточно загружен. DOM, или объектная модель документа, представляет структуру содержимого страницы и взаимосвязь каждого элемента с другим. Вы можете найти его в «Элементе обзора» в коде страницы браузера. DOM является основой динамически создаваемой страницы.
Если ваш контент виден в DOM, ваш контент, скорее всего, анализируется Google. Проверка DOM поможет вам определить, обращаются ли к вашим страницам роботы поисковых систем.
Избегайте блокировки доступа поисковых систем к содержимому JS
Чтобы избежать проблемы, связанной с тем, что Google не может найти контент JavaScript, некоторые веб-мастера используют процесс, называемый «обфускация», который представляет контент JS пользователям, но скрывает его от браузеров. Однако этот метод считается нарушением Руководства Google для веб-мастеров, и вы можете быть за него наказаны. Вместо этого попытайтесь определить ключевые проблемы и сделать контент JS доступным для поисковых систем.
Используйте соответствующие коды состояния HTTP
Поисковые роботы Google для выявления проблем при сканировании страницы Коды состояния HTTP использует. Поэтому вы должны использовать осмысленный код состояния, чтобы уведомить ботов о том, что страницу нельзя сканировать или индексировать. Например, вы можете использовать HTTP-статус 301, чтобы сообщить ботам, что страница переместилась на новый URL-адрес, и позволить Google соответствующим образом обновить свой индекс.
Исправить дублированный контент
Когда для веб-сайтов используется JavaScript, для одного и того же контента могут быть разные URL-адреса. Когда вы найдете такие страницы, убедитесь, что вы выбрали исходный / предпочтительный URL-адрес, который вы хотите проиндексировать, и не путайте поисковые системы. канонические теги Убедитесь, что вы установили его.
Исправьте поздно загруженный контент и изображения
Скорость сайта очень важна для SEO. Поздняя загрузка — одна из лучших практик взаимодействия с пользователем, которая откладывает загрузку некритического или невидимого контента, тем самым сокращая время загрузки первой страницы. Но помимо того, что страницы загружаются быстрее, вам необходимо убедиться, что ваш контент доступен для сканеров поисковых систем. Эти браузеры не будут запускать ваш JavaScript, что негативно повлияет на SEO.
Более того, поиск изображений также является дополнительным источником органического трафика. Поэтому, если у вас есть изображения, которые загружаются поздно, поисковые системы их не выберут.
Задержка JavaScript и асинхронность
JavaScript помещаются между кодами, а коды выполняются сверху вниз. Если ваш скрипт JavaScript содержит много кода, загрузка вашего веб-сайта займет больше времени. Но, отложив некоторые тривиальные шаги, вы можете предотвратить их разбор JS и увеличить скорость вашего сайта.

асинхронная/ожидающая команда: Команды async/await доступны во всех языках программирования. Команда async дает функции или методу возможность работать асинхронно, то есть независимо от потока домашнего каталога. Поскольку асинхронные функции не следуют последовательности кода, они могут выполняться параллельно потоку. На этом этапе вы можете дождаться метода с помощью команды await. Асинхронность и ожидание — это более новый современный способ написания асинхронного кода, чем многопоточность, также называемый асинхронным.

отложить команду: Тег Defer открывает файлы JavaScript последними на странице. Эта команда обеспечивает увеличение скорости работы страницы.

команда предварительной загрузки: С помощью команды предварительной загрузки вы можете гарантировать, что изображения, которые вы загружаете на свой сайт, будут отображаться позже, чем другой контент. Это также способ увеличить скорость сайта.
Ошибки, которых следует избегать при SEO для JavaScript

Если вы используете JavaScript на своем веб-сайте, Google теперь может довольно хорошо отображать элементы после события загрузки и, наконец, читать и индексировать снимок, как традиционный HTML-сайт.
Большинство проблем с JavaScript и SEO связаны с неправильной реализацией. Таким образом, многие распространенные передовые практики SEO также могут быть использованы для SEO JavaScript. Вот несколько наиболее распространенных ошибок, которые могут возникнуть:
1. Индексируемые URL: Каждому веб-сайту требуются уникальные и отличительные URL-адреса для полной индексации сайтов. Однако pushState не создает URL-адрес, поскольку он создается с помощью JavaScript. Поэтому для вашего сайта JavaScript также требуется собственный веб-документ, который может возвращать код состояния 200 OK в качестве ответа сервера на запрос клиента или бота. Поэтому каждый продукт, обслуживаемый с помощью JS (или каждая категория вашего веб-сайта, созданная с помощью JS), должен быть снабжен URL-адресом на стороне сервера, чтобы ваш сайт мог быть проиндексирован.
2. Ошибки PushState: URL-адреса JavaScript можно изменить с помощью метода PushState. Поэтому вы должны быть абсолютно уверены, что исходный URL-адрес передается с поддержкой на стороне сервера. В противном случае вы рискуете дублировать контент.
3. Отсутствующие метаданные: При использовании JavaScript многие веб-мастера или SEO-специалисты забывают об основах и не передают метаданные боту. Однако к содержимому JavaScript применяются те же стандарты SEO, что и к HTML-сайтам. Поэтому обязательно используйте заголовок и мета-описание тегов alt для изображений.
4. href и img: Роботу Googlebot нужны ссылки для перехода, чтобы он мог найти больше сайтов. Поэтому вы также должны предоставить ссылки с атрибутами href или src в своих JS-документах.
5. Создайте унифицированные версии: Версии preDOM и postDOM создаются путем создания JavaScript. Если возможно, убедитесь, что не введены конфликты и что, например, канонические теги или нумерация страниц могут быть правильно интерпретированы. Так вы избежите укрытия.
6. Создайте доступ для всех ботов: Не все боты могут обрабатывать JavaScript, как Googlebot. Вот почему рекомендуется вставлять в HTML-код заголовки, метаинформацию и социальные теги.
7. Не отключайте JS через robots.txt: Убедитесь, что ваш код JavaScript также может быть просканирован роботом Googlebot. Для этого в файле robots.txt не следует исключать каталоги.
8. Используйте действительный файл Sitemap: Вы всегда должны обновлять атрибут «lastmod» в своей XML-карте сайта, чтобы показывать Google возможные изменения в содержании JavaScript.