Личный блог Дмитрия Подлужного: о работе и около нее

Когда нужно использовать адаптивную верстку

Проектирование, Размышления по ходу дела, 10 февраля 2014

За последнюю неделю побывал на нескольких сайтах, которым явно не хватало адаптивной верстки. Причем самое очевидное использование адаптивной верстки – это мобильные версии сайтов. Именно они наиболее нуждаются в адаптивном подходе.

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

Про Wargaming

Первая пример очень простой: Недавно телеканал канал РБК был завален рекламой от Варгейминг их новой игры World of Warplanes. Реклама в итоге скорее дорогая, но и продукт довольно давно разрабатывался. Вот только непонятно, почему при этом не сделать адаптивную версию сайта, что я смог его нормально на мобильном телефоне просмотреть.

Сайт worldofwarplanes.ru скорее можно рассматривать, как вторичный инструмент информирования. Трудно представить, что у UX и дизайна стояла задача привлечь кого-то таким сайтом. Прямо вижу лозунг: «Пусть качают, а там уже у нас все хорошо!»


Сайт worldofwarplanes.ru скорее можно рассматривать, как вторичный инструмент информирования. Трудно представить, что у UX и дизайна стояла задача привлечь кого-то таким сайтом. Прямо вижу лозунг: «Пусть качают, а там уже у нас все хорошо!»

 

Наверное, есть много причин, почему так не сделали. Может быть, даже специально так сделали, чтобы человек пользовался компьютером, но не смартфоном. Но что-то мне подсказывает, что на адаптивную версию просто подзабили. Не знаю, как это может сказаться на доходах компании. Быть может они просто не дозаработали 0,1% в следующем году от новых пользователей. Правда, с учетом их аудитории и оборота в $372 млн. , такой минимальный процент может вылиться в хороший причину все-таки сделать адаптивную версию.

 Про сайт Олимпиады в Сочи

Сразу оговорюсь – это не камень в огород олимпиады. Просто пример оказался довольно типичным.

Сайт, который в априори, будет одним из самых посещаемых на протяжении нескольких олимпийских недель. Его бюджет… предположим, что достаточный, но, вероятно, сверх достаточный, как и все в российской олимпиаде. В результате разработчики сделали мобильную версию сайта, что вполне разумно для такого проекта. Только лучше было бы ее сделать адаптивной.

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


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

 

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

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

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

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

В принципе, если сразу бы разработка строилась на адаптивном принципе, с использованием нормальной адаптивной верстки на Foundation или Bootstrap, то подобной ситуации можно было бы избежать, даже в ситуации, когда контентная проблема обнаруживается слишком поздно.

Ну и подытожим…

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

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

  • Дима Бухал

    Привет, сайт олимпиады разрабатывался не в России, его французы делали — партнеры МОК, у них сайты однотипные были и для прошлых олимпиад. Вероятно, тогда они еще не предусмотрели, что будет нужна адаптивная верстка.

    • Вот-вот, кто-то не задумался о таком требовании, я об этом и пишу.

  • Адаптив сайтов делают исходя из целевой аудитории( я так думаю)) зачем варгеймингу респонсива сайта если с мобилы нельзя играть? У них целевое действие юзера зашедшего с рекламы это скачать игру и жахаться в нее)) зачем тратить силы на то, что не принесет прибыли? С Олимпиадой другая тема, адаптив нужен информационному ресурсу (мы в dalee.ru делали для самсунга олимпикхаб и адаптивных макетов было около сотни) Кстати, а Вы как бы предложили проблему таблиц? Если в таблице много столбцов и ячеек то это жесткачь и так же мы в реализации адаптивов для сбербанка не нашли работающего решения для таблиц, мы их только оптимизировали по формату и сделали прокрутку ))))

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

      Что касается адаптивной версии для Wargaming, то тут, мне кажется, вы ошибаетесь. А ошибаетесь потому, что забываете о жизненном цикле аудитории и об условиях потреблении контента. Легко представить реальный кейс, когда Wargaming запускал по телеканалу РБК (может и другим, но я другие не смотрю) плотный поток рекламы своих игр. Телевизионная реклама в таком объеме, наверное, дорого стоит. И, наверное, они хотели привлечь внимание новых потенциальных пользователей. Но для какого-то процента из аудитории (я в том числе) самый простой способ переключится с телевизионной рекламы на продукт – это взять телефон и посмотреть сайт, который рекламируется. А новая аудитория она еще не мотивирована, крайне беспокойна и т.д., и, например, невозможность нормально почитать информацию об игре на телефоне, может ее отвлечь от продукта с последующим забыванием о нем. В итоге, при огромных затратах на привлечение внимания, можно получить низкую эффективность (в одном из сочетаний канал/клиент) из-за банальной лени.

      А еще остается мобильная реклама в соцсетях, Мосметро с мобильной аудиторией, да и еще миллион вариантов, когда адаптивный сайт становится крайне важным.

      Понятно, что для компании уровня Wargaming проседание по «не совсем целевой» аудитории по какому-то не совсем целевому каналу будет незаметно. Может, недополучат они 0,01% от возможных новых пользователей от своего проката рекламы на ТВ из за лени с адаптивным сайтом. Но тут чуть-чуть, там чуть-чуть, и вот глядишь пару миллионов выброшено на ветер.

Подлужный Дмитрий Арнольдович

Об авторе

Дмитрий Подлужный – UX Leader в ADV/web-engineering co. (ранее UX Leader, Art director, PM в студии Spacebox) и консультант по UX в свободное время.