Адаптивный дизайн или мобильная версия: как принять правильное решение?

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

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

Давайте разбираться.

Адаптивный дизайн

Согласно «Википедии», адаптивный дизайн – это:

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

Другими словами, адаптивный сайт умеет видоизменяться, в зависимости от того устройства, на котором его просматривают. Посмотрите, как выглядит адаптив (прим. авт.: сокращенно от «адаптивный дизайн») на компьютере, планшете и смартфоне.

Преимущества адаптивного дизайна

  • Универсальность. Разработчики делают один сайт, который ориентирован на любые устройства.
  • Экономия. Чтобы отредактировать или удалить какую-то информацию, изменения необходимо вносить только на одном сайте, что существенно экономит и время, и деньги.
  • Один адрес. У адаптивного сайта всегда один и тот же URL и вы никогда не запутаетесь с настройкой редиректов.
  • Сбор статистики. Системы аналитики собирают необходимые данные по одному сайту. Просто выберите, кто вас интересует, пользователи ПК или смартфонов.
  • Экономия места на сервере. Не очень веский аргумент во времена обилия хостинг-провайдеров и тарифов, которые они предлагают, однако, адаптивный сайт – это один сайт. Никаких копий и беспрестанного увеличения дисковой квоты, что может оказаться весьма актуальным для владельцев стартовых тарифов с ограничением в десяток гигабайт.

Мобильная версия

«Википедия» считает, что это:

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

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

Казалось бы, зачем нужны мобильные версии, если уже придумали адаптив?

Преимущества мобильной версии

  • Уникальная возможность работы с целевой аудиторией. Зачастую у пользователей ПК и планшетов/смартфонов – совершенно разные потребности.
  • Наличие выбора. Пользователь может изучать мобильную версию, а может перейти на полноценный сайт.
  • Возможность игнорирования нужд пользователей ПК. Мобильный сайт – только для пользователей смартфонов и планшетов, нет необходимости думать о том, как будет выглядеть мобильная версия на дисплее персонального компьютера.

Отдельно хочется сказать по п. 1 преимуществ мобильной версии.

Что может искать пользователь ПК на сайте автосалона? Большие красивые фотографии? Конечно. 3D-панорамы интерьера автомобилей? Возможно. Все это чрезвычайно неудобно воспринимать через мобильное устройство небольших размеров. Я с трудом себе представляю «удовольствие» от просмотра HD-изображений на экране того же седьмого iPhone. А что может искать на том же сайте автосалона пользователь смартфона? С высокой долей вероятности – цены, комплектации, адреса дилерской сети. Вот что необходимо выводить на первый план мобильным пользователям!

Кстати, ребята из LiveJournal молодцы – отлично используют преимущество № 1. В мобильной версии они дают своим пользователям самое главное: доступ к журналу, друзьям и написанию заметки, ниже идут темы дня. На компьютере картина совсем другая.

Подводя итоги

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