- PVSM.RU - https://www.pvsm.ru -
Каждый месяц на сайт Econslutancy.com [1] заходят больше 100 000 пользователей мобильных устройств, но мы пока не запустили адаптивную версию сайта. И это не потому, что мы не хотим улучшить пользовательский опыт наших читателей, все дело в недостатке ресурсов, который заставляет жестко расставлять приоритеты.
[2]
Оценить плюсы наличия адаптивного дизайна с точки зрения бизнеса очень легко, особенно если у вас транзакционный сайт без адаптивной верстки: просто взгляните на показатели конверсии с разбивкой по устройствам. Для планшетов цифры будут ужасны, а для мобильных устройств еще хуже. Немного математики, и финансовые потери, вызванные отсутствием адаптивной версии сайта для планшетов и мобильных устройств, станут очевидны.
Впервые я об этом задумался года три назад, когда примерно 5% наших пользователей заходили на сайт со смартфонов. Конечно, этого было недостаточно для того, чтобы повысить приоритет разработки адаптивной версии. Но годы идут, ситуация меняется, и сегодня уже около 20% посетителей приходят к нам с мобильных устройств. А это уже кардинальным образом меняет дело, и при этом ничто не указывает на спад роста мобильного трафика.
По моим подсчетам, сейчас мы теряем примерно шестую часть годовой выручки, поэтому нам приходится работать над целым рядом вещей, включая полностью адаптивный сайт. Еще ни разу я не слышал о том, что с релизом адаптивного сайта конверсия ухудшилась, напротив, я слышу только потрясающе положительные отзывы. Так что, если вы хотите убедиться в плюсах наличия адаптивной версии сайта и нуждаетесь в примерах его эффективности, вот небольшой список компаний, которые получили значительный профит от использования адаптивного дизайна:
Lovehoney [увеличение конверсии для мобильных устройств от 60% до 100% за 2 дня]
Bench [конверсия в мобильном секторе +100%]
State Farm [конверсия +56%]
Baines & Ernst [конверсия в мобильном секторе +51%]
Horze [конверсия в мобильном секторе +19%]
FreshSparks [конверсия +13%, рост выручки в целом +42%, рост выручки от пользователей iPhone +377%]
CareerBuilder [увеличение email CTR на 20%]
Herviestoun [мобильный трафик +28% за 6 месяцев]
Нужны еще примеры? Да пожалуйста, вот куча статей, авторы которых восхваляют адаптивный дизайн. Начнем с Бреда Фроста (Brad Frost [3]):
Прежде всего, у меня есть кое-какие цифры с сайтов, занимающихся розничной торговлей, и цифры эти чертовски хороши. Рост конверсии на 42.4%. Четырехкратное (!) увеличение показателей конверсии для Android.
Теперь послушаем историю бьюти-бренда Nars [4] [конверсия в мобильном секторе +54%]:
В результате запуска адаптивно сайта, вдобавок к росту показателей конверсии для смартфонов на 54%, показатели перехода к оплате товара с планшетов выросли на 24%. Компания решила создать адаптивный сайт из-за ограниченных ресурсов, которые не позволяли поддерживать три различные версии сайта.
Ну и, напоследок, рассмотрим еще пять брендов, которым удалось добиться значительного увеличения основных показателей после перехода к использованию адаптивного дизайна.
Отличный кейс от Electric Pulp [5], который позволил компании O’Neill Clothing [6] добиться отличных результатов благодаря переходу к адаптивности. Бренд O’Neill замерял показатели конверсии, транзакций и выручку на протяжении трех недель до запуска нового сайта, и еще три недели – после релиза адаптивной версии. Представители компании Electric Pulp, которая занималась разработкой сайта, говорят, что в процессе редизайна применяли «обычные мобильные паттерны», которые позволили сделать сайт более живым и дружественным пользователю.
Изменения привели к отличным результатам на iPhone/iPod:
Еще более внушительных результатов удалось добиться и для устройств на базе Android:
Наверное, мой самый любимый пример использования адаптивного дизайна в электронной коммерции. Компания Skinny Ties [7] решила использовать эту технологию [8], чтобы «пересмотреть характерные составляющие бренда и создать прогрессивную платформу, позволяющую бизнесу двигаться вперед». Сайт претерпел редизайн, в ходе которого проектировщики ориентировались в равной степени и на touch-интерфейс, и на привычную схему работы с сайтом при помощи мышки. Это позволило сделать сайт компактным и консистентным.
Кроме того, с помощью платформы Magento [9] проектировщики серьезно поработали над улучшением производительности и навигации, а также создали четкие гайдлайны по стилю изображений продуктов. Новый сайт был без лишнего шума запущен в октябре 2012, и в течение первых недель показал значительное улучшение основных показателей, по сравнению с предыдущим трехмесячным периодом:
После того, как к началу 2012 года количество посетителей Time.com [10] с мобильных устройств выросло до примерно 10% от их общего числа, руководство решило, что адаптивный дизайн – это наилучший выход для того, чтобы удовлетворить эту растущую аудиторию [11]. У Time.com уже была отдельная WAP-версия, и одной из главных целей редизайна стала кроссплатформенность внешнего вида сайта. На ранних стадиях, чтобы выработать общую эстетику в шрифтах, графике и использовании фотоматериалов, дизайнеры печатной версии журнала работали бок о бок с командой по цифровому дизайну.
Одной из главных сложностей, с которой пришлось столкнуться команде проектировщиков, была необходимость тестирования сайта на разнообразных устройствах, чтобы убедиться в должном качестве пользовательского опыта – весь процесс редизайна занял 9 месяцев, от начала до конца. Однако результаты того стоили:
Поставщик фото-товаров Think Tank Photo (TTP) [12], пришел к выводу о необходимости создания новой версии сайта, вследствие увеличения количества мобильных посетителей в три раза до 13% от общего их числа за год. TPP работала над созданием нового сайта совместно с Blast Advanced Media [13], и вот чего им удалось добиться:
И, на десерт, короткий кейс [16] от Maxatec [17], компании, поставляющей оборудование для мобильных сетей и точек продаж. Результаты:
Автор: dmitrykabanov
Источник [2]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/perevod/41001
Ссылки в тексте:
[1] Econslutancy.com: http://econsultancy.com/ru
[2] Image: http://habrahabr.ru/post/190164/
[3] Brad Frost: http://bradfrostweb.com/blog/post/it-doesnt-matter/
[4] Nars: http://www.narscosmetics.com/?d=true
[5] Electric Pulp: http://electricpulp.com/notes/you-like-apples/
[6] O’Neill Clothing: http://www.oneillclothing.com/
[7] Skinny Ties: http://skinnyties.com/
[8] решила использовать эту технологию: http://gravitydept.com/blog/skinny-ties-and-responsive-ecommerce/
[9] Magento: http://www.magentocommerce.com/
[10] Time.com: http://www.time.com/time/
[11] удовлетворить эту растущую аудиторию: http://www.magazine.org/timecom-gm-craig-ettinger-bringing-responsive-web-design-iconic-brand
[12] Think Tank Photo (TTP): http://www.thinktankphoto.com/
[13] Blast Advanced Media: http://www.blastam.com/assets/pdf/blast-thinktankphoto-responsive-casestudy.pdf
[14] Черной Пятницы: http://ru.wikipedia.org/wiki/%D0%A7%D1%91%D1%80%D0%BD%D0%B0%D1%8F_%D0%BF%D1%8F%D1%82%D0%BD%D0%B8%D1%86%D0%B0_(%D1%80%D0%B0%D1%81%D0%BF%D1%80%D0%BE%D0%B4%D0%B0%D0%B6%D0%B8)
[15] Киберпонедельник: http://ru.wikipedia.org/wiki/%D0%9A%D0%B8%D0%B1%D0%B5%D1%80%D0%BF%D0%BE%D0%BD%D0%B5%D0%B4%D0%B5%D0%BB%D1%8C%D0%BD%D0%B8%D0%BA
[16] короткий кейс: http://www.zeta.net/maxatec-responsive-website-for-all-devices/
[17] Maxatec: http://www.maxatec-europe.com/
Нажмите здесь для печати.