Будущее за адаптивными сайтами?

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

К 2014 году большая доля веб-трафика будет приходиться на мобильные устройства. Готовы ли веб-сайты к этому?

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

Дело в том, что большинство сайтов ориентированы на стандартное разрешение экрана 1024х768. Такие сайты на мониторах планшетов, смартфонов, мобильных телефонов и smart телевизоров становятся крайне неудобными для просмотра и использования.

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

Примеры сайтов с адаптивным дизайном можно посмотреть здесь 

Адаптивный дизайн VS мобильные приложения и мобильные версии сайта

Мобильные приложения для пользователей таких популярных гаджетов как iPad, iPhone, гаджеты на ОС Андройд также решают проблему просмотра интернет-ресурса на мобильном устройстве.

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

Кроме того, пользователи экономят память телефона и трафик, необходимый на загрузку приложения, поэтому обычно загружают приложения, только если собираются им периодически пользоваться, и не будут грузить приложение ради единичного просмотра ресурса. Это значит, что для сайтов компаний (корпоративных, визиток) или не раскрученных интернет-магазинов и сервисов вариант с созданием приложения – не вариант.

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

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

Адаптивный сайт – это один URL сайта, один дизайн, один контент и один код сайта!

Есть ли минусы у адаптивного дизайна сайтов?

Безусловно, есть. Основной минус состоит в том, что это новая технология и еще сыроватая. Крайне мало специалистов, знающих как делать адаптивный дизайн и имеющих опыт. По этой причине адаптивный дизайн сейчас практикуют в основном крупные студии, имеющие ресурсы на освоение новых технологий.

В нешей компании, "Интернет-клиент" мы тоже только изучаем эту технологию и запускаем первые проекты. Отсутствие богатого опыта не позволяет нам тарифицировать эту работу, поэтому первые 5 адаптивных сайтов мы делаем без взимания платы за работы связанные с адаптацией, а это порядка 50% от стоимости дизайн-макетов и верстки. Спешите, осталось 3 места!

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

Технология создания адаптивного дизайна

Mobile first

Для оптимизации отображения страниц сайта на мониторах мобильных устройств, дизайнеры отрисовывают мобильные версии сайтов с адаптивным дизайном на базе принципа «mobile first».

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

Дизайн и верстка

Дизайнерами разрабатывается от 5 до 10 макетов сайта для отображения на устройствах разного формата и разрешения: мобильных телефонах, планшетах, коммуникаторах, мониторах ноутбуков и нетбуков. При этом главной задачей ставится сохранение качества изображений и контента. Готовые макеты передается для верстки программистам.

Адаптация к девайсам

Готовый сайт с адаптивным дизайном автоматически распознает формат, тип и разрешение экрана устройства, с которого на него заходит посетитель. Подключение/отключение элементов страницы, изменение ширины блоков и размера шрифтов, включение или отключение анимации происходит автоматически. В итоге страница с responsive design адаптируется к устройству и отображается с учетом специфики гаджета.

Тестирование

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

***

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

Однако сегодня технология еще дороговата и сыровата из-за отсутствия у студий опыта и обкатанных технологий. Наверняка, это минус временный.


Ссылки на источники:

Мария Смирнова, директор web-студии "Интернет-клиент"


Комментарии (0) Распечатать Обсудить на форуме


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

Информация

Посетители, находящиеся в группе Гости, не могут оставлять комментарии к этой статье.