Amp

В конце мая с. г. в Google сообщили, что теперь они намерены в алгоритм ранжирования сайтов ввести понятие "качества страницы" (page experience). А в это понятие они включили: скорость загрузки страницы, интерактивность (т.е. например, чтобы кнопка быстро приобретала способность нажиматься), и стабильность контента во время загрузки (т.е. вы не должны случайно нажимать кнопки или ссылки из-за того что всё на экране прыгает пока страница грузится). Кроме того страница должна быть оптимизирована для мобильных устройств (mobile friendly), безопасна для просмотра, передаваться по протоколу https (не http), и не иметь навязчивой всплывающей рекламы (intrusive interstitials).

Но в Google также заявили, и о том что они понимают, что COVID-19 замедлил все работы, и поэтому дают владельцам сайтов, ещё как минимум 6 месяцев, чтобы привести их в соответствие новым требованиям. Вот ссылка на официальный пост в их блоге для вебмастеров: Evaluating page experience for a better web.

Что же делать? Судя по всему, сначала надо проверить свой сайт на их же инструменте Measure: https://web.dev/measure/ .

В качестве первого примера давайте измерим этот сайт, т.е. Хабр:

Как видим, не всё с точки зрения новых метрик Google здесь хорошо. Будем считать, что оранжевый цвет нас устраивает (хотя Google уже упоминал где-то, что считает неплохим результатом 75% и выше), а Accessibility (т.е. доступность людям с ограниченными возможностями) нас не очень беспокоит, так как это пока Google не будет требовать в обязательном порядке. Очевидно, что явная проблема здесь - performance, т.е. скорость загрузки страницы.

Теперь давайте проверим этот же сайт (Хабр) на оптимизацию к мобильным устройствам: https://search.google.com/test/mobile-friendly

Как видим, с этим всё в порядке. Учитывая, что сайт использует протокол https, не имеет навязчивой рекламы и безопасен для просмотра - делаем вывод, что всё же имеется одна, но существенная (я бы сказал ключевая) проблема - скорость загрузки страниц. Тем не менее, возможно, что именно для этого конкретного сайта указанная проблема всё же не сыграет большой роли, учитывая его большую популярность. Но справедливо ли это утверждение для вашего сайта?

Итак, надо прежде всего понять, что традиционными методами SEO (метатеги, вхождения ключевых слов, внешние ссылки, и прочие полезные процедуры) ключевую проблему скорости загрузки страниц или оптимизации сайта к мобильным устройствам не разрешить. Возможно потребуется поиск новой современной платформы, и перенос на неё всего сайта. Да это так, увы.

Рассмотрим сначала AMP как платформу спонсируемую Google, и задуманную специально для решения описываемых выше задач. Поскольку я не раз уже писал здесь на Хабре о голосовом помощнике Алиса (например: здесь, здесь, и тут), позволю себе в качестве пример привести, сделанный на AMP не большой статичный сайт Квиз 101, предлагающий викторины (квизы) для игры с Алисой:

Сделаем замеры и для него:

И сразу же проверим этот же сайт (Квиз 101) на оптимизацию к мобильным устройствам:

Как видите, все показатели можно считать или хорошими или очень хорошими. Просто этот маленький сайтик не может позволить себе роскошь игнорировать рекомендации Google!

Что касается владельцев сайтов на WordPress - имеется официальный плагин: AMP for WordPress. Поэтому начинайте его использовать, если ещё не делали это!

Универсальной панацеи на все случаи жизни конечно же нет. Но для многих других случаев советую просмотреть в первую очередь в сторону Gatsby (там ребята поставили себе цель добиться в этом направлении совершенства, и у них начинает получаться), или NEXT.js (первый фреймворк, официально поддерживающий AMP). В любом случае, время ещё есть, чтобы перевести свой сайт в современный Web, хотя его (времени) не так уж и много, если, конечно, вас интересует продвижение вашего сайта в поиске Google. Кстати, не думаю, что и Яндекс позволит себе в этом вопросе сильно отстать - ведь конкуренция между поисковиками за качество поисковой выдачи очень остра.

На сегодня всё. Другие материалы следуют. Кому подобное читать интересно - подписывайтесь на уведомления о новых публикациях. Подписаться можно на этом сайте (кнопка Подписаться внизу), или на Telegram-канал IT Туториал Захар, или Twitter @mikezaharov, или ВКонтакте. А кто захочет сделать донат - это пожалуйста сюда: https://sobe.ru/na/microbot

Яндекс и Google не жалея сил развивают собственные экосистемы, поглощая старый добрый web турбо-страницами и AMP-сайтами. От этого не выигрывают:

1. информационные ресурсы, которые зарабатывать на рекламе;

2. коммерческие сайты, т.к. поисковая выдача сведена к поисковым сервисам и агрегаторам;

3. социальные сети (тот же Дзен с вчера анонсированными прямыми эфирами).

Новая реальность вжиться в экосистему поисковика или забыть про онлайн. Неминуемо поисковики перетянут все возможности привлечения и удержания посетителей на сайте в свое русло, оставив сайт с однострочным офером и контактами. Но на пути к капитуляции можно и выиграть. Поэтому опустим (ну, почти) критику AMP-страниц, а рассмотрим кейсы внедрения и преимущества для своего проекта и бизнеса. Позитив, в самом деле, есть, и кто раньше изучит тему, тот и выиграет.

Введение формата AMP страниц пятилетней давности стало самым громким изменением в алгоритмах работы Google. И небезосновательно: меняется вид выдачи, формат взаимодействия пользователя с контентом и, самое важное, новые технические требования открывают большие возможности для продвижения сайтов и достижения лучшего результата.

Что такое AMP-страницы

Уже в 2015 году Google активно улучшал поисковую выдачу на мобильных устройствах. С помощью алгоритма Mobile-friendly пользователи попадали из поисковой выдачи на сайты, адаптированные к мобильным устройствам. Нововведение не осталось незамеченным для мобильных пользователей и отразилось на улучшении поведенческих факторов, прямо влияющих на позиции сайта в поисковике.

В октябре того же года Google анонсировал проект ускоренных мобильных страниц AMP (Accelerated Mobile Pages). AMP мгновенно загружаемые на мобильных устройствах страницы, позволяющие не тратить время на ожидание долгой загрузки сайта, что особенно актуально при медленном интернете.

Мгновенная загрузка страниц стала возможной благодаря новой технологии, включающей 3 компонента:

1. Формат разметки AMP HTML . Это привычная HTML разметка, но с некоторыми ограничениями, позволяющими улучшить представление сайта.

2. Библиотека скриптов AMP JS . Новая библиотека помогает ускорить отрисовку amp-страниц.

3. Кэш AMP . Гугл поддерживает загрузку AMP-страниц из собственного кэша, что ускоряет отображение страницы на экране пользователя.

Библиотека ресурсов AMP бесплатна и поддерживается всеми браузерами. На сегодня экосистема AMP включает более 25 миллионов сайтов и становятся более востребованной среди самых различных форматов: реклама, электронная торговля, услуги, малый бизнес и т.д.

Чем сайт AMP отличается от остальных

Говоря об отличиях сайтов, созданных по технологии AMP и традиционных сайтов, использующий полный набор HTML-разметки, мы выделяем:

1. Скорость загрузки первых.

2. Более мощный функционал вторых.

3. Приоритет AMP-вебсайтов в мобильной выдаче Гугла перед обычными страницами.

4. Способность AMP страниц быстро решать задачу пользователей.

Стандартный сайт, разработанный по стандартам AMP, демонстрирует отличные показатели по времени загрузки:

А время загрузки первой части контента составляет 1,6 сек на недорогом смартфоне в сети 4G с медленным подключением к интернету. Сам по себе результат просто фантастический.

Однако, в силу того, что библиотека скриптов и стандарты верстки ограничены и оптимизированы, в первую очередь, для мобайла, функционал AMP страниц уступает традиционным сайтам, сверстанным на HTML5.

Примеры AMP сайтов

Полностью корректный вид AMP сайт принимает только при открытии с мобильного устройства. Для просмотра на десктопе, рекомендуем уменьшить размер окна браузера:

• https://www.citilink.ru/amp/catalog/audio_and_digits/tv/

• https://spb.price.ru/mobilnye-telefony/nedorogie-smartfony-s-4g/amp/

• https://www.souvenirdvor.ru/amp/category/matreshki/

Зачем Google создал AMP

Согласно исследованию Kissmetrics, 47% пользователей не готовы ждать загрузки сайта более 2 секунд, 40% посетителей покидают сайт, если загрузка длится более 3 секунд.

Согласно тому же исследованию, первые 10 секунд являются самыми важными в посещении пользователя. Из графика ниже следует, что если вам удается убедить посетителя остаться на сайте полминуты, то существенно вырастают шансы удержать пользователя на 2 минуты и даже больше что само по себе сопоставимо с вечностью в онлайне.

Но прежде, чем мы рассмотрим, насколько реально важна скорость загрузки страниц, вот несколько фактов, которые прольют свет на то, как меняются ожидания пользователя в зависимости от времени загрузки ресурса.

Люди предпочитают контролировать свою жизнь сами, а не отдавать ее на произвол компьютерам. В своей книге Проектирование юзабилити Якоб Нильсен рассказывает о 3 важнейших ограничениях во времени, которые происходят в интервале между действием пользователя и ответом на него машины.

• 0,1 сек . Если компьютер отвечает на запрос пользователя незамедлительно, то возникает иллюзия прямой манипуляции. Это заставляет пользователя думать, что результат получен самим пользователем, а не сгенерирован машиной. Феномен прямой манипуляции отличный ключ к росту вовлечения пользователя.

• 1 сек . Если время ответа занимает одну секунду, пользователь заметит этот промежуток и будет чувствовать, как машина генерирует результат вместо человека. Однако пользователь по-прежнему сконцентрирован на собственном ходу мыслей, и спустя секунду пользователь по-прежнему сохраняет чувство контроля. Страница должна загружаться не более одной секунды, чтобы у пользователя не пропадало чувство свободного перемещения в онлайне.

• 10 сек . Спустя десять секунд пользователь заметил задержку и больше не ощущает свободы в своих действиях. Пользователь уже заблудился и покинет сайт с куда большей вероятностью. Если приложение загружается более 10 секунд, важно обозначить время ожидание визуально: индикатором загрузки или линейкой прогресса. Так пользователи смогут понять, сколько им остается ждать.

Аналитический сервис Tagman провел исследование, в котором изучил влияние скорости загрузки на конверсию, результаты на графике:

Примечательно, что каждая последующая задержка загрузки на одну секунду является причиной падения конверсии на 7%.

Похожие исследования проводил Amazon: каждая задержка в 100 миллисекунд снижает конверсию на 1%.

Возвращаясь к Гуглу, отметим, что скорость загрузки стала фактором ранжирования сайтов в поисковой выдаче. Иными словами, медленные сайты не будут показаны в топе поисковика. Google хочет показывать выше те сайты, которые имеют лучшие пользовательские характеристики.

Очевидно, что сайт с хорошей скоростью загрузки влияет на положительное впечатление от пользования поиском самого Гугла и служит фактором лояльности к Гуглу. Учитывая экспансию американского поисковика в Азии и в бывшем СССР, не кажется удивительным устремления Гугла увеличить аудиторию и повысить вовлеченность западной аудитории.

Как выглядит AMP в поисковой выдаче

AMP-страницы имеют приоритетный значок (молния) в поисковой выдаче для мобильных устройств:

В 2017-ом году, портал 9to5Google проводил опрос, результаты которого показали, что больше половины пользователей предпочтут кликнуть по ссылке с иконкой молнии, нежели на обычный сайт.

Какие результаты дает внедрение AMP

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

Компания Stone Temple Consulting провела исследование

, изучив выборку из 10 сайтов различного формата, в которых были внедрены AMP-страницы.

На примере медийного сайта компании Thrillist (в формат AMP переведены 90% страниц) зафиксирован рост трафика из поисковиков на 70% половина этого роста приходится на AMP.

Другой пример, на этот раз анонимная компания, крупный медиа-проект, у которого в AMP переведены 95% страниц, заметили рост трафика из органики на 67% по одному сайту и 30% по другому. В обоих случаях рассматривался период 4 недели. В отношении медийного сайта AMP явно сказались в лучшую сторону.

Что касается коммерческих сайтов, то на примере интернет-магазина Myntra (аналог Ламоды в Индии) получен результат в виде падения отказов на 40% и увеличения общих показателей эффективности (автор исследования не указывает конкретные данные). Надо сказать, что от внедрения до получения первых результатов прошло всего 11 дней.

Другой успешный кейс, проведенный той же компанией, сервис по типу российского Билетера Event Ticket Center . Они перевели 99,9% всех страниц в формат AMP и получили сногсшибательные результаты. 100% увеличение конверсии в электронной торговле! Показатели вовлеченности скромнее, но тоже демонстрируют рост:

1. падение отказов на 10%;

2. увеличение просмотров страниц на 6%;

3. увеличение продолжительности посещения на 13%.

Больше информации по этому кейсу в исследовании на английском языке. Мы же можем сделать вывод, повторив уже сказанное командой Event Ticket Center Big win (Большая победа).

Будущее AMP какое оно?

По заявлению представителя Гугла Ричарда Жангра, AMP это не про новости или статьи, мы видим внедрение формата по всему спектру веб-приложений, от интернет-магазинов до посадочных страниц для рекламы.

По крайней мере, AMP станут будущим для SEO, как выразился Дэниел Бордман, руководитель отдела SEO в компании Hoppa. Дальше можно ожидать, что Google будет активнее продвигать свой формат мобильных страниц. И если есть, чему поучиться из всей истории Гугла, то это тому, что нужно следовать за предложениями поискового гиганта, нежели оставаться за линией кильватера без позиций и трафика.

Критика AMP

Из проблем AMP-страниц, выделяемых вебмастерами, чаще всего приводят:

1. пропадающие ссылки (и доход от рекламы);

2. меньше возможностей для аналитики и больше работы;

3. меньше контроля над своим контентом и дизайном.

Как справедливо отмечает Дэн Бюбен, Google продвигает формат AMP под лозунгом Сайты на AMP будут ранжироваться выше, и в это же время заключает сделку с Wordpress, что создает основу для появления миллионов вебмастеров, на чьих сайтах автоматически появляется AMP-версия.

Вывод

1. Мобильный трафик сегодня как никогда важен , и не требует доказательств идея о том, чтобы быть ближе к мобильным пользователям.

2. AMP это способ привлечь и удержать мобильных пользователей , в том числе с медленным интернетом. Скорость загрузки сайта в приоритете.

3. AMP действительно дает преимущества в продвижении сайтов . Как минимум, пока есть возможность подвинуть из топа сайты с AMP-версией.

4. AMP не идеальная штука, хотя бы потому что, что сайт станет зависимым от гугловских серверов, а вам потребуется периодически дорабатывать сайт к меняющимся требованиям AMP.

5. AMP становится все популярнее , охватывая не только медийные порталы, но и интернет-магазины и нишевые сайты.

6. AMP новый способ сделать жизнь пользователей проще и понятнее.

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