Если вы посмотрите на последние несколько лет трафика аналитики на веб-сайты, вы, скорее всего, обнаружите, что все они имеют одну общую общую черту - увеличение числа посетителей, которые они получают от пользователей на мобильных устройствах.
В глобальном масштабе теперь больше мобильного трафика поступает с мобильных устройств, чем из того, что мы будем рассматривать как «традиционные устройства», что в основном означает настольные или портативные компьютеры. Нет никаких сомнений в том, что мобильные компьютеры изменили то, как люди потребляют онлайн-контент, а это означает, что он изменил способ создания веб-сайтов для тех, кто все чаще ориентируется на мобильную аудиторию.
Создание мобильной аудитории
Создание «мобильных дружественных сайтов» было приоритетом для веб-профессионалов на протяжении многих лет. Практика, такая как отзывчивый веб-дизайн, призвана помочь создавать сайты, которые хорошо работают для всех устройств, а также уделять особое внимание производительности веб-сайта и быстрому скачиванию, приносит пользу всем пользователям, мобильным или иным. Другой подход к мобильным дружественным сайтам известен как веб-разработка AMP, что означает Accelerated Mobile Pages.
Этот проект, подкрепленный Google, был создан как открытый стандарт, позволяющий издателям веб-сайтов создавать сайты, которые быстрее загружаются на мобильных устройствах. Если вы думаете, что это очень похоже на отзывчивый веб-дизайн, вы не ошибаетесь. Обе концепции разделяют много общего, а именно, что они оба сосредоточены на доставке контента пользователям на мобильных устройствах. Однако существует ряд различий между этими двумя подходами.
Ключевые различия между AMP и адаптивным веб-дизайном
Одной из сильных сторон гибкого веб-дизайна всегда была гибкость, которую он добавляет к сайту. Вы можете создать одну страницу, которая автоматически реагирует на размер экрана посетителя. Это дает доступ к вашей странице и возможность эффективно обслуживать широкий спектр устройств и размеров экрана: от мобильных телефонов до планшетов до ноутбуков, настольных компьютеров и других устройств. Отзывчивый веб-дизайн ориентирован на все устройств и пользователей, а не только мобильных устройств. В обоих случаях это хорошо, а в других - плохо.
Гибкость на сайте отличная, но если вы действительно хотите сосредоточиться на мобильных устройствах, создание сайта, ориентированного на все экраны, а не только на мобильных устройствах, может быть гибкой в торговле для исключительно оптимизированной производительности мобильных устройств. Это теория AMP.
AMP ориентирована исключительно на скорость, а именно на мобильную скорость. Согласно Malte Ubl, Google Tech Lead для этого проекта, AMP нацелен на то, чтобы «мгновенный рендеринг веб-контента». Некоторые из способов, которыми это делается, включают:
- Ленивая загрузка
- Использование preconnect
- Предварительная выборка ресурсов
- Async Javascript
- Встроенные таблицы стилей
- Нет загружаемых шрифтов
- Приоритезация ресурсов
Это лишь некоторые из принципов, которые делают загрузку AMP так быстро. Тем не менее, есть некоторые элементы в этом списке, которые могут заставить долговременных веб-профессионалов съеживаться. Например, строковые таблицы стилей. Многие из нас уже много лет говорят, что все стили должны содержаться во внешних таблицах стилей. Возможность стилизации большого количества страниц сайта из одного внешнего листа является одной из сильных сторон CSS - силы, которая отрицается, если страницы используют встроенные стили. Да, вы предотвращаете необходимость загрузки внешнего файла, но за счет возможности управлять всем этим сайтом с помощью отдельной таблицы стилей. Итак, какой подход лучше? Реальность такова, что у них есть свои преимущества и недостатки. Сеть постоянно меняется, и разные люди, которые посещают ваш сайт, имеют разные потребности. Очень сложно установить правила, которые будут применяться во всех случаях, потому что разные подходы имеют смысл в разных ситуациях. Ключ должен взвесить преимущества или недостатки каждого подхода, чтобы определить, что лучше всего в вашем конкретном случае.
Другое ключевое различие между AMP и RWD заключается в том, что адаптивный дизайн редко «добавляется» к существующему сайту. Поскольку RWD - это действительно переосмысление архитектуры и опыта сайта, обычно требуется, чтобы сайт был перепроектирован и перепроектирован, чтобы соответствовать гибким стилям. Однако AMP можно добавить на существующий сайт. Фактически, его можно даже добавить на существующий отзывчивый сайт.
Рассмотрение Javascript
В отличие от сайтов с RWD, сайты AMP плохо работают с Javascript. Это включает 3й сторонних скриптов и библиотек, которые сегодня очень популярны на сайтах. Эти библиотеки могут добавлять на сайт невероятные функциональные возможности, но они также влияют на производительность. Таким образом, разумно предположить, что подход, ориентированный на скорость страницы, будет избегать файлов Javascript. Именно по этой причине AMP часто лучше всего используется на статических веб-страницах, а не на высокодинамичных, или на тех, которые требуют определенных эффектов Javascript по той или иной причине. Например, галерея веб-сайтов, использующая опыт «лайтбокса», не станет отличным кандидатом для AMP. С другой стороны, стандартная статья веб-сайта или пресс-релиз, который не требует каких-либо фантазийных функций, будет отличной страницей для доставки с AMP. Эта страница, вероятно, будет прочитана людьми, использующими мобильные устройства, которые могли видеть ссылку на социальные сети или через мобильный поиск Google. Возможность мгновенно доставлять этот контент, когда он запрашивает его, вместо того, чтобы замедлять скорость загрузки, когда загружаются ненужный Javascript и другие ресурсы, обеспечивает отличную работу с клиентами.
Выбор правильного решения
Итак, какой вариант подходит вам - AMP или RWD? Конечно, это зависит от ваших конкретных потребностей, но вам не нужно выбирать тот или иной. Если мы хотим иметь более умные (и более успешные) онлайн-стратегии, это означает, что нам нужно рассмотреть все имеющиеся в нашем распоряжении инструменты и узнать, как они будут работать вместе. Возможно, это означает, что ваш сайт будет реагировать быстро, но с использованием AMP на избранных разделах или страницах, которые могут быть наиболее подходящими для этого стиля разработки. Это также может означать использование различных подходов и объединение их для создания гибридных решений, которые отвечают самым конкретным потребностям и которые обеспечивают лучшее из обоих миров посетителям этого сайта.
