Обсудить проект

Увеличиваем скорость загрузки сайта на мобильных устройствах с помощью турбо-страниц «Яндекса»

  • ROI
  • 05 октября 2018
  • 1661
  • 5 минут

Есть много способов улучшить конверсию на сайте: доработать функционал, нарисовать красивый дизайн, продумать последовательность блоков и так далее. Все это увеличивает размер страниц и время их загрузки. Что, если пользователи не дождутся загрузки «вишенки на торте» сайта и покинут его раньше времени?

По статистике Google, 53% россиян покидают сайт, если он загружается более 3 секунд. По исследованиям Kissmetrics, всего одна (!) дополнительная секунда загрузки сайта снижает уровень конверсии на целых 7%. Например, если заработок с вашего сайта составляет 100 000 рублей в день, то увеличение времени загрузки сайта всего на секунду обернется потерей 2 500 000 рублей в год.

В этой статье я расскажу о том, как увеличить скорость загрузки сайта с мобильных устройств с помощью турбо-страниц «Яндекса», чтобы капризные посетители не убегали с него вместе с вашими денежками.

Для чего нужны и как работают турбо-страницы?

«Яндекс» представил технологию турбо-страниц осенью 2017 года. Основная задача технологии – быстрая загрузка страниц сайта с мобильных устройств даже при слабой скорости интернета.

Для этого контент сайта загружается по RSS-каналу – специальному формату из семейства XML, с помощью которого можно получать контент, не заходя на сам сайт, и подогнать его под определенный шаблон. К тому же загрузка происходит не с самого сайта, а с серверов «Яндекса».

Таким образом не только уменьшается вес страниц, но и загружаются они с CDN (Content Delivery Network) – то есть через географически распределенную сеть серверов по всей России с ближайших серверов к пользователю. По словам «Яндекса», это увеличивает скорость загрузки в 15 раз.

Выделю основные преимущества турбо страниц:

  • быстрая скорость загрузки снижает показатель отказов;
  • турбо-страницы в поиске выделяются характерным значком ;
  • ниже нагрузка на сайт.

Турбо-страницы также косвенно влияют на позицию в поисковой выдаче. Они будут особенно эффективны, если дополнительно применить советы моего коллеги Андрея, которые позволяют увеличить поисковый трафик в 5 раз.

Также турбо-станицы позволяют отображать контент на мобильных устройствах для сайтов, у которых нет мобильной версии. Впрочем, стоит заметить, что эта технология работает только в поиске Яндекса, пользователям Google она недоступна.

Значок «Турбо», может выделять страницу в поиске перед страницами конкурентов.

Значек Турбо

Это своеобразная гарантия от Яндекса, что страница загрузится очень быстро и будет удобной для восприятия.

С июня 2018 года «Яндекс» добавил новые возможности для турбо-страниц: формы обратной связи, ссылки на свои социальные сети, мессенджеры и чаты, больше интеграций с социальными сетями и внешними сайтами, возможность добавлять любые эмбеды и GIF-анимации.

Это означает, что технология теперь подойдет не только для блогов и новостей, но и для интернет-магазинов и сайтов, предоставляющих услуги. Посмотреть пример турбо-страницы с недавними нововведениями можно здесь.

Как настроить турбо-страницы?

Подключение технологии можно условно разделить на два этапа:

  • настройка RSS-канала
  • подключение страниц в кабинете вебмастера

Настроить RSS можно с помощью специального синтаксиса, но это далеко не самый простой способ (любители острых ощущений могут почитать инструкцию в сервисе Яндекс.Помощь). Я покажу настройку на более простом примере: с помощью плагина для WordPress. Подобные плагины еще есть и для 1С-Битрикс, Drupal, Joomla и OpenCart.

Заходим через админку WP в раздел «Плагины» и вводим «Яндекс.Турбо»

Плагин Яндекс.ТурбоУстанавливаем и активируем плагин с одноименным названием.

Далее понадобится зайти в настройки плагина. Все настройки разбиты на несколько блоков. В первом блоке – основные настройки:

Настройки плагина Яндекс.ТурбоПо умолчанию URL RSS-ленты будет выглядеть как https://site.ru/feed/turbo.

Имя RSS-лентыПоля можно оставить по умолчанию. Внимание обратить нужно на поле «количество записей».

Количество записей RSS-лентыСуществует ограничения для RSS, с которыми обязательно нужно ознакомиться при настройке. В первую очередь это ограничения по весу ленты, количеству картинок и количеству символов в тегах H1 и title.

Если страницы вашего сайта содержат много текста и картинок, можно разбивать RSS по частям.

Делить RSS-лентуВ блоке «оформление» можно включить или отключить автора записей и автора изображений.

Выбор Автора записи и Автора изображенийВ разделе «Блоки Яндекс.Турбо» указываем меню сайта из выпадающего списка, а также включаем или отключаем блоки «поделиться» и «блок обратной связи».

Блок Яндекс.ТурбоЧтобы получать информацию о посещениях и действиях пользователей, укажите счётчики систем аналитики: например «Яндекс.Метрики» и Google Analytics.

Счетчики Метрики и АналитикиЕсли необходимо монетизировать сайт с помощью рекламы в РСЯ или ADFOX, указываем блоки рекламы в настройках.

Блоки рекламы РСЯ и ADFOXИ в разделе «Таксономии и типы записей» выбираем нужные типы записей и исключаем категории контента для выбранных типов, если это необходимо.

Выбрать и исключить Типы ЗаписейНе забываем сохранять настройки в каждом блоке!

На этом заканчиваем настройку в WordPress. Теперь переходим в «Яндекс.Вебмастер», выбираем раздел «Турбо-страницы». Сервис предложит ввести адрес фида RSS.

Добавление RSS фидаВставляем ссылку с нашего плагина и жмём «Добавить».

Затем заполняем общую информацию.

Добавляем Турбо-страницыЗаполняем название сайта, выбираем логотип, добавляем id счётчиков и отправляем на проверку.

Если в процессе проверки возникают ошибки, правим их и отправляем данные повторно. В моем случае проблема заключалась в запрете в файле robots.txt.

Ошибки валидации

В итоге увидим заветный статус «Без ошибок»

Исправили ошибкиПоздравляю, с этого момента вы счастливый обладатель турбо-страниц в соответствии с вашими настройками.

Турбо-страницы в «Яндекс.Директ»

С недавнего времени, для объявлений «Яндекса» стало доступным настраивать свои турбо-страницы в удобном встроенном редакторе без геморроя с RSS-лентами. Вы можете создать уменьшенные копии страниц для мобильной версии и не снижать трафик с мобильных устройств, когда ведете платный трафик на сайт с «Директа».

Чтобы создать турбо-страницу в «Директе», для начала создаем или редактируем объявление. В разделе редактирования появился новый блок «Турбо-страница».

Турбо-страницы ДиректИ аналогичные пункты для «Быстрых ссылок».

Турбо-страницы для быстрых ссылок ДиректаЖмём кнопку «Выбрать» и создаем турбо-страницу.

Создать Турбо-страницу в ДиректВ удобном редакторе создаем страницу и публикуем её.

Редактируем поля Турбо-страницы в ДиректТеперь наша страница появляется в библиотеке турбо-страниц, где её можно выбрать и добавить к объявлениям.

Библиотека Турбо-страниц в ДиректВыбор Турбо-страницыВот и всё! Теперь ваши посетители будут попадать на страницы почти мгновенно и не упустят ваше предложение из виду.

Итог:

Количество пользователей мобильных устройств постоянно растет. Турбо-страницы позволяют значительно ускорить загрузку сайта с мобильных устройств, снижать процент отказов и быть впереди конкурентов в глазах клиентов.

Уже используете турбо-страницы на сайте? Поделитесь опытом в комментариях, а я с удовольствием отвечу на все вопросы.

[EPSB]Настроим турбо-страницы в ROI-маркетинге[/EPSB]


Обсуди с другими
Обсудить проект
Выберите услугу,
впишите имя и телефон, нажмите кнопку
Нужна консультанция Экспресс-аудит Реклама Аналитика Анализ конкурентов Стратегия ROI-маркетинг SMM Блог Сайт Другое
Нажимая кнопку, вы соглашаетесь с  Условиями обработки персональных данных