2. 1. Мобильная версия сайта или адаптивный дизайн: плюсы и минусы
2. Расчет окупаемости мобильной версии сайта: аргументируем необходимость
3. Кейс телекоммуникационной компании UIS:
- результаты проведения A/B тестирования страницы заказа услуг на
мобильном сайте.
4. Внедрение дополнительных способов коммуникации с посетителями:
мессенджеры и другие сервисы для мобильных версий сайта для увеличения
конверсии.
План презентации
8. перенаправление мобильных пользователей на
специальный поддомен (m.example.com,
mobile.example.com);
урезанная основная версия сайта с тем функционалом,
который будет полезен пользователям.
Отдельная мобильная версия
11. Используется серверное или браузерное определение устройства. После чего
посетителю выдается конкретный заранее преднастроенный шаблон
Адаптивный дизайн (AWD)
16. Адаптивные шаблоны могут
разрабатываться на базе
существующего сайта, без его
изменения!
Нужно проработать в дизайне
несколько версий шаблонов под
разные типы устройств –
дольше. Значит – дороже.
Разработка
17. Используется гибкая структура страницы – «резиновый макет».
Т.е. для всех устройств используется один шаблон, но он
подстраивается под размеры экрана посетителя моментально.
Используются медиа-запросы - (media queries) — блоки кода с
указанием параметров устройств вывода, формирующие
структуру страницы относительно размеров экрана устройств.
Медиа запросы позволяют применять определенные правила
(стили) для вывода различных контентных блоков в различном
порядке и пропорциях в зависимости от ширины экрана и
возможностей устройства, на котором происходит просмотр веб-
сайта.
Отзывчивый дизайн (RWD)
23. Удобство для пользователя
Быстрота загрузки, т.к. обычно быстрее загружается
Выбор (можно перейти на основную версию сайта из мобильной)
Легко вносить правки
Можно сделать, уже на готовом десктопном сайте
«+/-» отдельной мобильной версии
сайта
Несколько адресов
Неудобство для пользователя — для десктопной и
мобильной версии разные адреса.
Несоответствие контента на 2-ух версиях
сайтов
24. Удобство разработки
Единый URL (лучше для SEO, т.к. поисковикам «удобнее»
работать
«+/-» адаптивного дизайна
Медленная загрузка («Вес» сайтов)
Задачи пользователей с десктопа и мобильных
часто отличаются
Отсутствие выбора (нет возможности перейти к
обычному сайту)
25. Не нужно продумывать отдельные шаблоны дизайна под
разные устройства, а значит дешевле и быстрее
Легко вносить правки, только в основную версию
«+/-» отзывчивого дизайна
Нужно перерабатывать сайт с «нуля»
Скорость загрузки сайта ниже, чем на адаптивном
дизайне
Сложность в разработке
Механизм определения устройств не совершенен
28. Зелёные строки - зафиксированные значения по расчётам
с других вкладок, либо рассчитываются автоматически
Розовые строки - заполняются самостоятельно
Стоимость разработки и внедрения мобильной версии 500000
Средний чек 1 клиента (за последний квартал или год) 6000
Сколько нужно продаж, чтобы окупить мобильную версию 83
Текущая конверсия мобильного трафика в продажи 0,05%
ВО сколько раз я планирую её увеличить? 3
Какая конверсия у меня получится с новой версией 0,16%
29. Текущий мобильный трафик (среднее значение для месяца) 4 862
НА сколько я планирую его увеличить с новой версией? 2000
Какой мобильный трафик я получу? 6 862
Сколько продаж я получу с текущей конверсией и мобильным трафиком? 3
Сколько продаж я получу с новой конверсией и новым трафиком? 11
Сколько месяцев понадобится на окупаемость мобильной версии при текущих
показателях? 31
Сколько месяцев понадобится на окупаемость мобильной версии при новых
показателях? 7
39. Мобильная, адаптивная или RESS – решать вам. Но прислушайтесь к
Артемию Лебедеву, какая-то версия все же нужна точно.
Обязательно рассчитывайте эффективность запуска и планируйте
проект по запуску со сроками и подробными деталями.
Тестируйте разные варианты и замеряйте результаты по всем
конверсионным каналам.
Не слишком увлекайтесь мобильной рекламой, пока не проверите
свой сайт.
Адаптируйте каналы коммуникаций под Mobile. Обидно, если сайт
есть, а связаться через него совершенно невозможно!
Выводы