OpenCart является очень гибкой системой для эффективной SEO оптимизации. Существует также множество SEO модулей для OpenCart для облегчения ручной работы. Но некоторые особенности системы, которые не мешают нормальному функционированию веб-сайта и невидимые для обычного глаза, могут быть критической проблемой для SEO. Одной из таких проблем является неправильное отображение страниц сайта, построенного на CMS OpenCart, в кэше Google, а точнее то, как ваши страницы "видят" боты Google.
Использование кэша Google позволяет понять, какой контент Google видит, анализирует и сканирует при посещении страницы. Это помогает определить, доступны ли определенные элементы сайта для Google и рендерится ли страница для бота так же, как и для обычного пользователя.
Суть проблемы
Когда Google индексирует сайт, он сохраняет кэшированную копию страницы, которая используется для быстрого доступа к ее содержанию. Эта кэшированная версия может использоваться поисковыми системами для определения релевантности страницы к определенным запросам пользователей. Проблема возникает, из-за того, что в кэше Google в тег <base> прописывается URL текущей страницы, а не главной. Напомним, что тег <base> задает базовый URL-адрес для всех относительных URL-адресов на странице. Это приводит к тому, что все относительные URL-адреса, по которым подключаются скрипты, стили, шрифты и изображения, становятся неверными, их ответ - 404. В результате страница рендерится без стилей и скриптов, шрифтов и картинок, имеющих относительные URL. Это негативно влияет на вид страницы и ее функциональность для поисковых ботов.
Как это влияет на SEO
1. Неправильный рендеринг страницы
Когда Googlebot индексирует страницу и не может найти необходимые скрипты, стили или изображения, он видит страницу, которая сильно отличается от той, которую видит обычный пользователь. Это может привести к неправильному индексированию страницы, поскольку бот не понимает ее содержимого должным образом.
2. Снижение рейтинга страницы
Поисковые системы, такие как Google, оценивают пользовательский опыт (UX) при определении рейтинга страниц. Если бот видит страницу, которая выглядит неправильно или не функционирует как следует, он может считать ее менее релевантной и снизить ее рейтинг в поисковых результатах.
3. Потеря трафика
Неправильное индексирование и снижение рейтинга приводят к уменьшению видимости страницы в поисковых системах, что, в свою очередь, уменьшает органический трафик на сайт. Это может негативно повлиять на бизнес, особенно если большая доля посетителей приходит через поисковые системы.
Как проверить проблему
Для того, чтобы проверить как выглядит определенная страница в кэше Google - добавьте в адресной строке браузера Google Chrome перед URL-адресом префикс "cache:", например так "cache:https://shop.com/product". Откроется страница в кэше, где будет указана дата кэширования. Проверить все проблемные ресурсы, которые не подключились на странице, можно в консоли браузера (на примере Google Chrome), нажав кнопку F12 на странице кэша и перейдя во вкладку Console.
Пример проблемы
Рассмотрим конкретный пример страницы товара в OpenCart: https://demo.opencartbot.net/ua/macbook
А вот как выглядит эта страница в кэше Google: http://webcache.googleusercontent.com/search?q=cache%3Ahttps%3A%2F%2Fdemo.opencartbot.net%2Fua%2Fmacbook
При переходе по этой ссылке можно увидеть, что страница загружается без стилей, скриптов и некоторых изображений. Это является следствием неправильного базового URL-адреса в теге <base> на странице кэша, что делает все относительные URL-адреса неверными. Таким образом, бот Google видит страницу как непонятную и нефункциональную, что приводит ко всем вышеупомянутым проблемам. К сожалению, повлиять на то, какой URL Google добавляет в тег <base> на страницах кэша мы не можем, но есть другие способы решения, о которых расскажем ниже. А проверить все проблемные ресурсы, которые не подключились на странице, можно в консоли браузера (на примере Google Chrome), нажав кнопку F12 на странице кэша и перейдя во вкладку Console.
Как решить проблему
1. Добавить слэш перед относительными адресами
Этот метод будет работать, только если главная страница сайта является адресом домена, то есть если сайт не размещен в отдельной папке на домене. В первую очередь, необходимо проверить все относительные адреса, которые есть в шаблонах header и footer, ведь именно там обычно подключаются стили и скрипты. Добавляем перед этими относительными адресами слеш.
Вот реальный пример: открываем файл catalog/view/theme/default/template/common/header.twig
Ищем там:
<script src="catalog/...
и добавляем слэш перед адресом скрипта:
<script src="/catalog/...
Аналогично для подключенных стилей:
<link href="catalog/...
должна выглядеть так:
<link href="/catalog/
Сохраняем, обновляем кэш модификаторов, кэш темы и другие кэши, которые есть.
2. Использование абсолютных URL
Еще одним решением может быть переход на использование абсолютных URL-адресов для всех ресурсов (скриптов, стилей, изображений и т.д.). Это обеспечит их правильное подключение независимо от того, как отображается страница (в кэше или в реальном времени). То есть, перед всеми относительными адресами добавляем адрес домена и, при необходимости, папки в которой находится сайт.
3. Проверка через инструменты Google
Регулярно проверяйте, как ваш сайт индексируется с помощью инструментов для веб-мастеров Google Search Console (GSC). Это позволит быстро выявлять и исправлять любые проблемы, связанные с рендерингом страниц. Вставив URL в поле поиска GSC, вы можете проверить как загружаются все ресурсы страницы. Имейте в виду, что при загрузке страницы Google игнорирует некоторые картинки, шрифты и внешние скрипты, это нормально.
4. Отправка на переиндексацию исправленных URL-адресов
Это можно сделать через ту же панель Google Search Console, но значительно быстрее и удобнее получится с помощью специального модуля для OpenCart, который работает через Google Indexing API.
Вывод
Проблемы с загрузкой некоторых ресурсов на страницах в кэше Google могут оказать серьезное влияние на SEO сайта. Правильная настройка тега относительных URL или использование абсолютных URL-адресов помогут избежать неправильного рендеринга страниц для поисковых ботов, что обеспечит правильное индексирование и более высокий рейтинг в поисковых результатах.
Бонус
Иногда, в консоли браузера в кэше Google вы также можете увидеть проблему с подключением шрифтов из-за кросс-сайтовой политики сервера. Именно на сайтах построенных на OpenCart частой является проблема с подключением шрифта иконок - FontAwesome. Эта проблема решается добавление правила передачи соответствующего HTTP заголовка в файл .htaccess, который находится в корневом каталоге сайта. Добавьте следующее правило в конец файла .htaccess:
<IfModule mod_headers.c>
<FilesMatch "\.(ttf|ttc|otf|eot|woff|woff2|font.css|css)$">
Заголовок установить Access-Control-Allow-Origin "*"
</FilesMatch>
</IfModule>