В этой дайджест публикации я попытаюсь объединить информацию по использованию турбо страниц на основе собственного опыта.
Те, кто следит за новинками сферы IT, знают про “быстрые страницы” от Google и Яндекс: AMP и Турбо-страницы. Они были выпущены больше 2 лет назад.
Волна восторгов от них стихла, и теперь можно трезво оценить плюсы и минусы. Турбо и AMP все еще в тренде, Яндекс и Google работают над их функциональностью, но они по-прежнему подходят далеко не всем и вряд ли скоро полностью заменят оптимизированные адаптивные сайты и мобильные версии.
Несколько лет назад поисковые системы стали отмечать в выдаче не пригодные страницы специальными маркерами. Выделенные страницы загружались быстрее обычных и не вызывали раздражение у пользователей. Позже появились алгоритм "Владивосток" у Яндекс и mobile-first indexing у Google.
Не все смогли сделать мобильные версии или адаптивные сайты, чтобы подстроиться под требования поисковых систем, и одним из решений проблемы стали Турбо и AMP.
Это разные технологии, но у них есть общие принципы работы:
- владелец сайта создает облегченные версии страниц;
- контент кэшируется на серверах Google и Яндекс и загружается оттуда, а не с сервера, где размещен сайт;
- исходный код проще, чем у обычных страниц, страницы содержат только текст, картинки и некоторые виджеты;
- корректность отображения Турбо- или AMP-страниц не зависит от устройства.
В 2016 году владельцы сайтов бросились делать ускоренные страницы, не разобравшись, нужно ли им это на самом деле. У AMP и Турбо-страниц есть преимущества перед обычными:
- первое время маркеры ускоренных страниц привлекали много внимания, хотя сейчас значки с молнией и ракетой выглядят привычно;
- за время загрузки этих страниц, меньше секунды, пользователь не успевает передумать и уйти на другой сайт;
И Яндекс, и Google регулярно выкатывают обновления, чтобы стимулировать как можно больше веб-мастеров внедрить новые технологии и сделать поиск более удобным для пользователей.
AMP и Турбо-страницы — это технология ускоренных мобильных страниц, которая разрабатывается независимыми разработчиками и активно продвигается обеими поисковыми системами. Такие страницы загружается даже быстрее чем страница мобильной версии сайта.
AMP страницы google.ru
Суть в том, что на сайте используются специальные теги (с префиксом amp), количество и функционал которых строго ограничены. Задача разработчика состоит в том, чтобы собрать солянку из доступных схем, которые решат проблему заказчика.
Поисковые системы находит эти специальные тэги и кэширует информацию в них. После этого, когда пользователь ищет что-то, браузер на фоне подгружает информацию из CDN, в специальный iframe и при переходе по ссылке открывает уже загруженную страницу в специальном окне.
При использовании на сайте какой-либо CMS, для AMP страниц необходимо сделать свой отдельный шаблон для отображения данных согласно требованиям к разметке AMP страниц.
Турбо-страницы Яндекса
Основное отличие от AMP — контент Турбо-страниц берется не со страниц сайта, а из специального RSS-канала.
Их содержимое хранится на серверах Яндекса. Но для того, чтобы Яндекс забрал с нашего сайта контент, мы должны написать скрипт, который будет передавать все необходимые данные (текст, изображения, стили и т.д.) в специальном формате XML-документ. Процесс похож на подготовку данных для Яндекс.Товары или Яндекс.Маркета.
Честно говоря, настройка максимально простая. Если количество страниц небольшое (10-20), то сделать RSS-канал для Яндекса можно самим, без привлечения программиста. Правда, в этом случае обновляться он будет тоже вручную.
Скорость загрузки Турбо — страницы превышает обычную примерно в 15 раз. И, дополнительный (но не последний), бонус — если сайт упадёт, например, из-за заражения или DDoS-атаки, его Турбо-страницы продолжат открываться и контент будет по-прежнему доступен пользователям.
Страницы с AMP и Турбо, ранжируются выше других запросов в поиске за счет того, что соответствуют требованиям к быстрой загрузке.
Особенности AMP и Турбо-страниц
Первое и самое главное отличие от стандартных сайтов — это невозможность вставки «обычных» скриптов. То есть большая часть функционала, завязанная на динамическом изменении (действия по клику, анимация, фильтрация, модальные окна), становится недоступной.
Решение — использование доступных компонентов и iframe. Доступные компоненты позволяют добиться, пусть и не полной, реализации привычного инструментария на сайте, но представляют ему достойную замену и оптимизированы для быстрой загрузки.
С помощью AMP и Турбо-тегов, можно реализовать боковое меню, карусель, отправку формы, подгружаемый контент, рекламу и прочее. Каждый компонент связан со своей js-библиотекой, которую нужно подключить для его использования на сайте.
Особенности Турбо-страниц
Они помогают увеличивать охват мобильной аудитории — пользователям не приходится долго ждать загрузки сайта, и они почти сразу переходят к вашему контенту. Прирост трафика может быть существенным.
Преимущества Турбо-страниц в том, что после их внедрения на вашем сайте:
- Падает показатель отказов. Когда пользователь заходит на ваш сайт и из-за своего плохого интернета долго не может открыть вашу страницу, он может просто не дождаться ее загрузки, закрыть и снова вернуться в поисковую выдачу, чтобы найти какой-то другой, более быстрый сайт. Таким образом у вас повышается показатель отказов, а чем больше показатель отказов, тем хуже ваши позиции в поисковой выдаче.
- Растет мобильный трафик. На сегодняшний день многие пользователи уже знают, что сайты, отмеченные в выдаче значком ракеты, грузятся очень быстро и поэтому по ним активно кликают. Это дает вам преимущество перед конкурентами и позволяет увеличить посещаемость вашего сайта с мобильных устройств.
- Снижается нагрузка на хостинг. Если на сайте довольно высокая посещаемость, то этот пункт будет тоже актуален. За счет того, что загрузка контента идет не с вашего хостинга, а с серверов Яндекса, нагрузка снижается. При этом для создания и хранения Турбо-страниц Яндекс использует собственную сеть доставки контента (CDN), что еще сильнее ускоряет загрузку контента.
Недостатки Турбо – в ограниченном функционале:
- Не поддерживаются формы обратной связи, нет возможности заказа товара или услуги. Это можно назвать самым главным минусом, т.к. для посадочной страницы или интернет-магазина использование турбо-страниц будет нецелесообразным, ведь вы все равно не сможете получить с них заявки.
- Сайт оформляется по предопределенному малогибкому шаблону. Когда вы кликаете по ссылке, помеченной значком «Турбо», то ваш контент отобразиться в упрощенной странице, созданной поисковиком, и ваше уникальное оформление сайта никто не увидит. Поэтому здесь придется выбирать между высокой скоростью загрузки сайта и уникальным оформлением вашей мобильной или адаптивной версии.
Особенности AMP
- Создание «легких» страниц;
- Поисковик сохраняет облегченные версии страниц у себя на серверах;
- «Яндекс» предлагает владельцам смартфонов турбо-страницы в поиске или новостной ленте;
- Благодаря высокой скорости загрузки улучшается пользовательский опыт и поведенческие показатели.
После создания AMP страниц, Google пошел дальше. Он перевел все сайты на новую систему ранжирования — Google Mobile Friendly. Теперь ранжирование сайтов зависит в первую очередь от мобильной версии сайта. Если раньше можно было создать и «вылизать» десктопную версию сайта, не делая адаптивную или на крайний случай мобильную версию сайта. То теперь при разработке сайта, особое внимание нужно обращать на адаптивную версию.
Подготовка данных
Для AMP-страниц
Все изображения на странице должны быть описаны в особом теге <amp-img>, что затрудняет вставку изображений пользователем через текстовый редактор.
Так же, если используются карусель или lightbox, нужно вставить аналоги из компонентов amp. Для реализации этого функционала был реализован обработчик, который с помощью регулярных выражений заменяет стандартные HTML-теги, на теги используемые в amp спецификации.
Еще одна особенность, которая должна коснуться в первую очередь текстового редактора, так как редактирование стилей там проходит inline. Элементы с атрибутами типа style=“color:…”, не являются валидными, а изменение цвета или размера шрифта запишет это свойство в код.
Чтобы поисковик понял, что есть AMP-версия страницы, она должна содержать ссылку:
<linк rel=«amphtml» href=«www.site.com/url/to/amp/document.html»>
А на AMP-странице — присутствовать обратная ссылка:
<linк rel=«canonical» href=«www.site.com/url/to/full/document.html»>Css стили пишутся inline, и их размер не должен превышать 50кб.
Для Турбо-страниц
Чтобы подключить Турбо-страницы, достаточно внести небольшие изменения в текущий экспортный файл согласно техническим требованиям:
- Корневым элементом RSS-файла является rss, атрибут version которого должен иметь значение 2.0.
- Внутри элемента rss содержится элемент channel, который включает информацию об источнике и его содержание.
Далее указываются:
- Информация о сайте-источнике — сведения передаются в элементе channel.
- Информации о сообщении — данные передаются в элементе item.
- контент для турбо-страницы
В турбо страницы можно встроить дополнительные элементы типа: шапка страницы, ссылки, картинки, логотип, меню, видео, кнопка «Поделиться», цитаты, таблицы и т.д. Также можно подключить некоторые системы веб-аналитики (ограничено и это минус).
Подробнее, смотрите здесь: https://yandex.ru/adv/turbo
Имеются бесплатные и платные плагины (модули) для многих CMS https://tech.yandex.ru/turbo/, поэтому подключить сейчас вообще не проблема. Проблема, потом отключить, но об этом ниже.
Минусы ускоренных страниц
1. Ваш сайт не будет оригинальным
Посетители Турбо- или АМР-страницы не увидят дизайн, на который вы потратили так много денег и времени. Все ускоренные страницы выглядят похоже, и это очень обидно. Придется выбирать между красотой и скоростью.
2. Сложно поддерживать столько всего
Веб-мастеру придется следить за основным сайтом, Турбо, АМР и мобильной версией. Возможно, еще за чем-то. У "коробочных" движков есть специальные плагины, а для самописного сайта сделать ускоренные страницы будет затратно по времени. К тому же, владелец ресурса перестает контролировать свой проект, потому что на ускоренной странице управление контентом переходит к поисковой системе.
3. Падение доходов от рекламы
Если вы зарабатываете не только на рекламных сетях поисковых систем, но и на прямых размещениях, доходы от рекламы снизятся. Например, на Турбо-страницах Яндекса можно разместить 2-3 объявления, а на своем сайте — сколько угодно.
4. Отсутствие многих функций
Поисковик загружает контент из своего кэша, и часть функциональности может не работать — онлайн-калькулятор, игровые элементы и прочие интерактивы. На Турбо-страницы можно добавить блок Яндекс.Музыки или Яндекс.Карту, видео с YouTube и цитаты, но все равно они по функциональности сильно уступают обычным страницам.
5. Потеря ссылок и трафика
Если у вашего сайта много ускоренных страниц, и на них будут ссылаться другие ресурсы, эти внешние ссылки будут не ваши. Яндекс.Метрика и Google Analytics дают информацию о трафике на Турбо и АМР, но если вам важна ссылочная масса, а для Google она еще имеет значение, лучше сделать адаптивный сайт и не терять ссылки.
Если пользователи попадают на сайт по ситуативным запросам, полезный контент и запоминающийся дизайн могут заставить человека вернуться в аналогичной ситуации. Ускоренные страницы запоминаются меньше, и у пользователя не будет визуальной зацепки, чтобы искать именно ваш ресурс.
5. Неудобство для пользователей
Во-первых, пользователи не могут выбрать, какую страницу просматривать. Поисковая система может показать адаптивную страницу или ускоренную, а вы не можете на это повлиять.
Во-вторых, если вам критично важна ссылка на какую-то другую страницу сайта, для нее тоже придется сделать "ускоренный" вариант, иначе пользователь все равно столкнется с медленной загрузкой и уйдет.
Наши выводы
Если у вас хорошая мобильная адаптация (респонсив), сайт быстро загружается и удовлетворяет все потребности пользователей, то нужды в Турбо-страницах просто нет. Они только создают лишние проблемы для вас.
Я заметил на 2 сайтах снижение посещаемости после ввода турбо страниц - на 40% примерно! При том, что посещаемость с мобильных гаджетов на обоих составляла примерно 60%. Были проблемы с трафиком, рекламой, счетчиками других поисковых систем и т.д. Например, у меня, в отдельных статьях, как вы может быть заметили, используется тег <code>. С его помощью я отмечаю код в статьях. Это удобно и для пользователей, которые потом смогут легко скопировать этот программный код. Но, к сожалению, Турбо-страницы не понимают этого тега, и уже на протяжении года классифицирует этот тег в ленте RSS как ошибку.
Как удалить Турбо-страницы
Способ отключения Турбо-страниц зависит от способа, с помощью которого они были сформированы:
RSS-канал как источник данных -
Для того, чтобы удалить Турбо-страницы, мы должны добавить значение false в тег <item turbo>. Это можно сделать вручную, просто открыв xml-файл с фидом или реализовать самим плагином Яндекс.Турбо.
Если для формирования RSS-канала вы используете плагин, обратитесь к разработчикам плагина или в службу поддержки CMS, чтобы уточнить способ отключения Турбо-страниц.
В использованном мною бесплатном плагине для Joomla FL Yandex Turbo нужно перейти в пункт расширенных настроек, найти там пункт «Отключить турбо-страницы», отметить его галочкой и сохранить изменения.
Теперь в наш фид добавилась строчка <item turbo="false">, она сообщит Яндексу, что мы не хотим, чтобы Турбо-страницы нашего сайта участвовали в поиске.
Созданную ленту мы должны добавить в Яндекс Вебмастер. Переходим в сервис, в раздел «Источники».
В течение нескольких дней после добавления источника в тегом <item> турбо-страницы будут удалены. Больше они не будут участвовать в поиске и съедать ваш трафик. Вместо нее будет отображаться обычная или мобильная версия сайта.
Вы в любой момент сможете вернуть их, если просто уберете запрещающий элемент из фида. В случае с плагином Яндекс Турбо достаточно просто убрать галочку с соответствующего пункта и заново добавить ссылку в Яндекс Вебмастер.
Примечание - При простом удалении RSS-канала из Яндекс.Вебмастера Турбо-страницы продолжат участвовать в результатах поиска. Надо именно вначале Отключить, а потом только удалить его, после переиндексации. К сожалению, в последнее время - таких неоднозначных решений множество во всех сервисах.
Если источник данных - YML файл или автопарсинг - чтобы отключить показ Турбо-страниц, выполните следующее:
В интерфейсе Яндекс.Вебмастера перейдите в раздел Турбо-страницы → Источники. Установите переключатель в положение Откл напротив нужного источника. Турбо-страницы интернет-магазина отключатся в течение часа.
Также про удаление турбо-страниц можно почитать в официальной документации Яндекса.
При этом, я не призываю вас обязательно делать это. В турбо-страницах есть свои плюсы. Решать вам!
