21.07.2021 •
Reading time 6 min
Ошибки, которых следует избегать при использовании JavaScript
Используете JavaScript на своем сайте? Google уже довольно хорошо отображает элементы после события загрузки и, наконец, может прочитать и проиндексировать снимок, как традиционный сайт HTML.
Большинство проблем с JavaScript и SEO возникает из-за неправильной реализации. Поэтому многие эффективные методы SEO-оптимизации можно использовать и для сайтов с JavaScript. Главное — учесть ряд моментов:
- Индексируемые URL-адреса: каждому веб-сайту нужны уникальные URL-адреса, чтобы их вообще можно было проиндексировать. Однако pushState, созданный с помощью JavaScript, URL не генерирует URL. Следовательно, вашему сайту с JavaScript нужен отдельный веб-документ, который будет выдавать код состояния 200 OK в ответ серверу на запрос клиента или бота. Поэтому каждый продукт, представленный с помощью JS (или каждая реализованная с JS категория веб-сайта), должен иметь URL-адрес на стороне сервера, чтобы сайт можно было проиндексировать.
- Ошибки pushState: методом pushState можно изменять URL-адреса JavaScript. А значит нужна гарантия, что исходный URL-адрес ретранслируется с поддержкой на стороне сервера. В противном случае вы рискуете дублировать контент.
- Отсутствие метаданных. При использовании JavaScript многие веб-мастера или SEO-специалисты забывают основы, и не передают метаданные боту. Однако и для JavaScript, и для HTML сайтов действуют одинаковые SEO стандарты . Помните о заголовке и мета-описании тегов ALT для изображений!
- a href и img src: роботу Google нужны ссылки, по которым он может переходить, чтобы находить другие сайты. Следите за наличием ссылок с атрибутами href- или src-в ваших JS-документах.
- Создание унифицированных версий: из-за рендеринга JavaScript возникают preDOM и postDOM версии. Чтобы избежать маскировки, убедитесь, что нет никаких противоречий и, например, что канонические теги или разбивки на страницы интерпретируются правильно
- Сделайте доступ для всех ботов. Не все боты могут работать с JavaScript, как Googlebot. Поэтому стоит разместить заголовок, метаинформацию и социальные теги в HTML-коде .
- Не отключайте JS поверх robots.txt: убедитесь, что ваш JavaScript также может сканироваться роботом Googlebot. Для этого не исключайте каталоги из robots.txt.
- Используйте текущую карту сайта: чтобы показать Google все возможные изменения в содержимом JS, нужно постоянно поддерживать актуальность атрибута lastmod в карте сайта XML.
Проверка веб-сайтов на JavaScript: что делать при аудите
1. Проведите визуальный чекап. Чтобы понять, как увидит веб-сайт посетитель, нужно разделить контент сайта на:
- видимое содержимое;
- содержимое, требующее взаимодействия;
- скрытое содержимое;
- содержимое от третьих лиц, например рейтинги;
- содержимое с товарными рекомендациями.
2. Проверьте HTML-код. Отключите CSS, JavaScript и файлы cookie в режиме веб-разработчика, чтобы увидеть, чего не хватает на сайте. Эти те элементы, которые контролирует JavaScript.
Управляйте такими мета-элементами, как заголовок и описание веб-сайта. Они должны быть доступны через событие загрузки, чтобы боты могли индексировать эти элементы Заголовок и метатеги прописать стоит в коде HTML, даже при работе с сайтами JS.
3. Еще раз проверьте HTML-код. Заново загрузите сайт с уже отключенными JavaScript и CSS. Затем вызовите меню Chrome, кликнув правой кнопкой мыши на сайте, и выберите «Проверить элемент». Справа откроется еще одно окно. Щелкните по тегу HTML правой кнопкой мыши — выберите «Копировать внешний HTML». И наконец, вставьте код в редактор. Теперь такие поисковые системы, как Google, смогут проиндексировать этот код.
Какие инструменты использовать для проверки JavaScript?
- prerender.io — программное обеспечение с открытым исходным кодом для оптимизации рендеринга JS-сайта;
- brombone — загрузит отобразит ваш сайт в браузере, чтобы вам было легче проверить корректность работы AJAX-запросов и JAVASCRIPT. Таким же образом можно протестировать и DOM. изменения — если рендеринг работает, то сайты сохраняются в формате html. Можете разрешить обработанным JS-сайтам выдавать прокси-сервер от brombone при обращении к сайту поискового робота. Для правильной реализации инструмента вам понадобится карта сайта в формате xml.
- angular js. с его помощью можно предварительно визуализировать снимки html для более быстрого поиска и индексации JS-сайта google ботом.
- seo.js. В этой программе код js также обрабатывается как html и доступен google для сканирования. Программный код передается на ваш сервер. Собственная панель управления помогает управлять нужными js-элементами и сайтами. Более того — программа создаст и xml карту сайта.
- изоморфный javascript. с этим инструментом приложения можно запустить как на стороне сервера, так и на стороне клиента. Это значит, что и, серверная, и интерфейсная часть используют один и тот же код. JavaScript становится более SEO-friendly благодаря реализации отсутствующего рендеринга.
Комментарии
Send Comment