NetLabCS
В этом разделе материалы размещаются пользователями сайта и публикуются после одобрения модератором. Редакция не несет ответственности за орфографические и другие ошибки, хотя и старается исправлять их по мере возможности.
Добавить свою заметку вы можете на этой странице.
29 января 2013, 14:23
7324
1

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

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

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

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

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

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

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

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

cossa-icons-6.png

Весь интернет-маркетинг за 19 недель!

Cossa рекомендует: онлайн-курс по интернет-маркетингу от Ingate — digital-агентства с 17-летним опытом.

  • 17 учебных блоков по ключевым вопросам интернет-маркетинга
  • Поддержка менторов
  • Диплом
  • Cтажировка в топовых агентствах России
  • Помощь в трудоустройстве
Узнать больше >>

Реклама

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

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

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

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

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

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

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

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

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

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

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

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

Mobile first

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

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

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

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

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

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

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

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

***

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

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


Автор: Смирнова Мария

Не пропустите!

Комментарии:

- 0 +
Интересная статья, Раз такое дело то и мне хотелось бы привести пример адаптивного дизайна на русском языке, Вот сайт - http://www.autoscar.ru/ - ни в коем случае не реклама, просто реально удобно заходить  с разных устройств,  планшет или сматрфон, так же разные форматы экрана,  к стати там даже рекламные блоки адаптивные.
Ответить
Ответить?
Реклама

Чем живёт digital.
Главное — в рассылке:




Вход на cossa.ru

Уже есть аккаунт?
Выбирай любой вариант входа:
Facebook Twitter Vkontakte

Используйте свой аккаунт в социальной сети Facebook или Twitter, чтобы пользоваться сайтом

Не забудьте написать email на странице своего профиля для управления рассылкой