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

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

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

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

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

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

---

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

---

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

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

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

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

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

---

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

---

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

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

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

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

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

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

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

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

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