Узнайте, как Google AMP может ускорить работу, если мобильная версия вашего сайта работает медленно или перегружена ресурсами
Google AMP, или ускоренные мобильные страницы, – это проект с открытым исходным кодом, созданный компанией Google с целью обеспечения более плавного просмотра веб-страниц на мобильных устройствах
Проект обещает более высокую производительность, увеличение вовлеченности и меньшее использование данных, что выгодно как пользователям, так и издателям
Как работает AMP?
embed https://youtu.be/9Cfxm7cikMY /embed
Скорость страницы стала фактором ранжирования для мобильных страниц в июле этого года (2018), и AMP здесь, чтобы удовлетворить потребность вашего сайта в скорости. На самом деле, AMP обещает сделать просмотр мобильных страниц на 85% быстрее
Благодаря комбинации оптимизаций и ограничений для HTML, JavaScript и CSS, страницы AMP загружаются практически мгновенно. Вместо написанного автором JavaScript, специфические элементы AMP обеспечивают скорость и совместимость
Скорость страницы также повышается благодаря приоритету над разворотом, специальным кэшам AMP и предварительной визуализации. Кроме того, использование небольших файлов и мультимедиа, а также малое количество запросов к ресурсам сервера еще больше повышает скорость
Оптимизация в AMP также гарантирует, что макет ваших страниц всегда загружается правильно, даже до загрузки изображений и iframe (для рекламы)
Это достигается путем указания размеров изображений и iframe в HTML-документе (так называемая ‘статическая верстка’). По сути, это останавливает перемещение содержимого для размещения ресурсов по мере их загрузки
Что такое кэширование AMP?
Если вы публикуете действующий AMP-сайт, ваши страницы автоматически кэшируются как часть экосистемы AMP. В кэше будут храниться ваши AMP-документы, шрифты и изображения
Сегодня используются два AMP-кэша: AMP-кэш Google и AMP-кэш Cloudflare. Только серверы Cloudflare охватывают 102 места в 50 различных странах
Кэш обновляется каждый раз, когда кто-то обращается к содержимому, и обновленное содержимое автоматически передается следующему пользователю. Это обеспечивает быстрое предоставление последней версии как можно большему числу пользователей
В дополнение к кэшированию содержимого, сервер кэша также обеспечивает некоторые оптимизации и модификации, такие как:
- Проверка формата AMP.
- Ограничение размеров изображений для предотвращения проблем с памятью браузера и плохой отзывчивости.
- Удаление невидимых или трудноразличимых данных изображения, таких как определенные метаданные.
- Преобразование изображений в более компактные и удобные для мобильных устройств форматы, например преобразование изображений в форматах GIF, PNG и JPEG в WebP (что такое WebP?) в браузерах, поддерживающих WebP.
- Преобразование изображений в более низкое качество, если запрос включает заголовок Save-Data.
- Добавляет поддержку изображений с отзывчивым размером.
- Работает по защищенному каналу (HTTPS) и использует новейшие веб-протоколы (SPDY, HTTP/2).
- Санирует документы AMP для предотвращения XSS-атак, основанных на неправильно закрытых HTML-тегах, комментариях и многом другом.
В дополнение к этим оптимизациям, кэш также завершает многие процессы санитарии HTML для нормализации парсинга
Полный список оптимизаций кэша AMP доступен на страницах Google Developers
Каковы фактические преимущества AMP?
Скорость – главная привлекательная черта AMP. Именно поэтому многие издатели, такие как Google, Facebook, Baidu, Pinterest и Twitter, уже перешли на эту технологию. Улучшенная скорость повышает вовлеченность и снижает количество отказов почти по всем показателям
AMP особенно полезен в местах с низким покрытием мобильного интернета или в перегруженных и медленных общественных сетях, таких как аэропорты и кофейни. Именно поэтому контент загружается в их приложениях так быстро, когда обычный просмотр страниц происходит медленно
Исследование, проведенное в прошлом году компанией Forrester Consulting Total Economic Impact Study (по заказу Google), показало, что:
‘AMP приводит к увеличению посещаемости сайта на 10%, при этом время, проведенное на странице, увеличивается в 2 раза. Для сайтов электронной коммерции, использующих AMP, исследование также показало 20%-ное увеличение конверсии продаж по сравнению со страницами без AMP.’
Карусель лучших историй Google на мобильных устройствах будет использовать только AMP-кэш Google для отображения статей, поэтому для многих издателей использование AMP должно стать автоматическим выбором
New York Times, eBay и AliExpress – хорошие примеры для ознакомления, которые воспользовались преимуществами AMP. Если вы нажмете на контент этих сайтов (отмеченный значком ампера) в поиске Google на вашем мобильном телефоне, вы загрузите AMP-версию их страниц
Истории AMP
В начале этого года экосистема AMP пополнилась AMP Story. Похожие на истории Snapchat, они уже используются многими издателями. Хорошими примерами могут служить рассказ CNN о миссиях, все еще исследующих нашу Солнечную систему, и подробное руководство Mashable по фильму ‘Черная пантера’
AMP Story Ads, дополнение к функции историй, недавно стало доступно для всех веб-сайтов, использующих Google Ad Manager. Это полноэкранные объявления, которые появляются в историях AMP, и являются одним из многих улучшений, которые сделали AMP намного полезнее, чем даже год назад
Каковы недостатки AMP?
Image Credit: DepositPhotos.
Если вы пользуетесь Google, Twitter, Pinterest, Messenger и т.д., вы заметите, что внешние ссылки будут открываться в самом домене, а не в домене, на который они ссылаются
Хотя просмотр AMP улучшает качество просмотра для пользователей, он может быть негативным фактором для владельцев сайтов. Он лишает вас возможности контролировать навигацию посетителей по вашему сайту
Это может лишить ваш сайт просмотров страниц и нарушить доходы от рекламы. Есть даже некоторые проблемы с аналитикой и отслеживанием, которые может быть трудно решить, если вы не используете Google Analytics для AMP
Тем не менее, некоторые читатели могут предпочесть трудности с отслеживанием. Если да, то вот что вы можете сделать, чтобы узнать, кто следит за вами в Интернете
В ‘Карусели лучших историй’ Google на мобильных устройствах будет отображаться только контент в формате AMP. Это важный факт, поскольку большая часть трафика на весь AMP-контент поступает от людей, ищущих на Google.com
Благосклонность к AMP не ограничивается только каруселью новостей.Google также будет показывать сайты с поддержкой AMP выше, чем любые другие ссылки, включая стандартные сайты, дружественные к мобильным устройствам. При этом сам AMP технически не является фактором Page Rank (пока), но улучшение скорости – да
Даже если вы сделаете свои AMP-страницы доступными, они не всегда будут использоваться в зависимости от используемой ОС, приложений или устройства. Если вы используете Cloudflare, вы можете включить функцию Accelerated Mobile Links для определения и отображения AMP-контента с вашего сайта на мобильных устройствах, независимо от источника
Cloudflare также может помочь вам улучшить конфиденциальность и производительность при использовании мобильных устройств
Визуализация и дизайн в AMP
Мы любим причудливо выглядящие сайты. Однако ограничения AMP могут заставить вас потерять часть визуальной привлекательности ваших сайтов, которую вы можете сохранить, используя отзывчивые сайты и мобильный дизайн
Плагины в WordPress, например, будут служить AMP, предлагая упрощенную версию вашего сайта. Эти конвертеры WordPress в AMP обладают очень низкой визуальной привлекательностью и являются одной из основных причин, почему многие сайты AMP выглядят одинаково
Если вы разрабатываете AMP-страницы вручную, а не с помощью конвертеров, вы можете получить дизайн, похожий на традиционный мобильный дизайн, и более визуально привлекательный
AMP еще предстоит пройти путь, и многие разработчики категорически против его использования, поскольку он заставляет их еще больше входить в экосистему Google. Это заставляет многих искать альтернативы Google
Стоит ли вам создавать AMP-страницы?
AMP дает много преимуществ для владельцев сайтов, особенно если вы ежедневно предоставляете большие объемы контента. Однако многие проблемы, замедляющие работу сайта, такие как чрезмерное использование JavaScript, медленный отклик сервера и большие размеры файлов, можно решить и без внедрения AMP
Умный подход к мобильному дизайну может обеспечить быстрое обслуживание вашего сайта. Дженни Гоув из Google написала отличную статью ‘Что делает сайт хорошим для мобильных устройств’, которую стоит прочитать
Существуют плагины WordPress AMP и плагины Drupal AMP, которые могут помочь вам в создании AMP-контента. В противном случае, документы быстрого запуска AmpProject являются ценным ресурсом, который можно использовать для ручного кодирования AMP-страниц
Весь сайт AMPProject фактически создан и отображается в AMP, так что это хороший пример того, как эти страницы могут выглядеть во всех разрешениях, а не только на мобильных устройствах
Хотя люди испытывают сильную неприязнь к AMP по разным причинам, сайт Stonetemple.com изучил 10 тематических исследований, чтобы увидеть разницу в вовлеченности пользователей и конверсии. Они пришли к выводу, что при условии полного внедрения AMP большинство сайтов, независимо от их ниши, увидят преимущества
В итоге вам следует подумать, получат ли ваши клиенты какие-либо преимущества от AMP. В зависимости от услуг, которые вы предлагаете, и контента, который вы подаете, это может не добавить улучшений по сравнению с мобильными страницами. При правильной оптимизации мобильные страницы тоже могут загружаться довольно быстро!
Как отключить AMP
Кэширование является основной частью экосистемы AMP, и публикация действительного AMP-документа автоматически включает его в доставку кэша. Если вы хотите удалить свои страницы, Google написал руководство о том, как удалить AMP-контент из поиска Google
Если вы хотите прекратить загрузку AMP-страниц как пользователь, вы можете отключить AMP-ссылки и вместо них загружать оригинальные страницы на вашем мобильном устройстве
Комментировать