Адаптивный дизайн: преимущества и недостатки.

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

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

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

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

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

Также дополнительные плюсы:

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

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

Медленная загрузка страниц. Единый код создает и некоторые сложности. На мобильной версии сайта пользователям можно показывать только минимально необходимое содержимое (через JS и CSS). Например, можно отключить лишние меню и медиа-материалы. А на сайтах с адаптивной версткой у пользователей с маленьким разрешением экрана загружается вся страница целиком, но видна только ее часть. При этом загрузка идет все равно всего кода, из-за чего такая страница может загружаться медленнее, чем если бы был отдельный код без всего лишнего. Частый пример, который мы видим при анализе сайтов, - в коде часто дублируются меню для десктопов и мобильных устройств. При этом в мобильных устройствах меню визуально не отображается.

Сложности с монетизацией для информационных сайтов. Наличие отдельной мобильной версии позволяет гибко управлять рекламными форматами. Например, блоками рекламы Яндекс.Директ или GoogleAdsens, которые специально заточены под пользователей с мобильных устройств.В адаптивной версии сайта управлять рекламными форматами менее удобно.