Больше половины пользователей Интернета заходят на сайты с мобильных устройств, и это если не учитывать такие ресурсы, как как Instagram, YouTube, Facebook и т.п. Если ваш сайт адаптирован под мобильные платформы, конверсия будет значительно выше. Но на пути к этому многие допускают ошибки, которые могут привести к обратному эффекту.
Некликабельные контактные номера
Пользователь смартфона должен иметь возможность связаться с вами вот прямо здесь и сейчас. Многие лишают этой возможности, размещая контактные номера в виде картинок, которые невозможно быстро скопировать и затем позвонить. Это неприемлемо даже в полных версиях сайтов.
Плохой шрифт
Вся важная информация, конечно, передается с помощью текста, и в мобильных версиях сайтов тоже есть свои параметры:
- читабельный текст не менее 16px;
- отступы от краев, сверху и снизу не менее 15px;
- интервал между строк не менее 1px;
- строгие обычные шрифты (Arial, sans и т.п.).
Долгая загрузка страницы
Если страница загружается дольше 3-х секунд, это снижает конверсию.
Для справки:
- задержка на 1 секунду будет стоить вам 3-7% конверсии;
- 10 секунд будут стоить вам 20-40%.
Многие хотят сделать свою адаптивную страницу красивее, размещая «тяжелые» картинки, что значительно снижает скорость загрузки. Проверить этот показатель помогут такие сервисы: WebPageTest, PinDom, Neustar, Google PageSpeed Insights.
Отсутствие перехода к полной версии сайта, неправильный редирект
В редиректе тоже бывают ошибки. Пользователь, нужный ему товар в поисковой системе, должен в один клик переходить на сайт к выбранному товару.
Но бывает так, что система перенаправляет пользователя на главную страницу мобильной версии сайта, а не к товару, которым он заинтересовался. И пользователю приходиться вновь искать товар, но уже на мобильной версии сайта.
Неудобные кнопки и ссылки для touch-screen
Если человек пользуется компьютерной мышью, ему будет несложно нажать даже на мелкую кнопку перехода или покупки. Но в смартфоне все усложняется. Иногда бывает, что человек, выбрав товар, кликает по кнопке «купить», но ничего не происходит. Приходиться очень хорошо прицеливаться, чтобы сделать покупку. И это очень неприятно для покупателя, что повышает риски его потери.
Существуют некоторые стандарты размеров для кликабельных элементов, которые вывели компании Microsoft и Apple:
- минимальный — 26px;
- оптимальный — 34px;
- идеальный — 44px.
Слишком длинные формы заполнения
Всем знакомо заполнение разных форм и анкет в мобильных версиях сайтов. Особенно неудобно заполнять множество полей и прокручивать их. Поэтому желательно заменить прокрутку на пошаговое заполнение.
Невоспроизводимый контент, использование flash-контента
Такой контент может просто не работать, так как пользователю неудобно его воспринимать. В разных случаях, разные устройства могут не воспроизвести видео или важную анимацию. Чтобы не гадать, каким мобильным устройством пользуется потребитель, упростите подачу контента. Flash-анимацию меняйте на GIF. Добавляйте PNG, JPEG файлы и обычную текстовую информацию.
Отсутствие автозаполнения полей
Чтобы повысить конверсию, нужно максимально упростить процесс заказа для покупателя. Наверняка люди, которые пользуются мобильными устройствами, уже заполняли нужную вам информацию. Стандартные данные: ФИО, номер телефона, адрес проживания или E-mail.
Автозаполнение значительно упрощает процесс заказа, автоматически подставляя нужную информацию в поля заполнения на сайте на основе информации, которую пользователь вводил раньше на похожих сайтах.
Для того, чтобы настроить автозаполнение, пропишите в HTML-код:
Поле Дата — input type=«date»
Поле Индекс, номер карты — input type=«text» pattern=«\d*»
Поле E-mail — input type=«email»
Поле Адрес — input type=«text»
Поле Телефон — input type=«tel»
Поле Кнопка «Отправить» — input type=«submit»
Отсутствие аналитики мобильной версии
Понятно, что отслеживать статистику просто нужно. Обычно при расчете конверсии мобильные и десктопные пользователи смешиваются, и вы не знаете, кто из них выполняет больше целевых действий. Это неправильно и неудобно.Если до вас не будет доходить такая информация, вы не сможете выявлять и изменять проблемные элементы.
Для получения такой информации отлично подходят сервисы Яндекс.Метрика и Google Analytics.
Отсутствие мобильной версии
Мобильная и адаптивная версия — это не одно и тоже. Если адаптивная версия просто хорошо подогнана под дисплей смартфона с измененным соотношением сторон, то мобильная версия — это полностью другой по виду и самодостаточный сайт, но с той же ссылкой.
У мобильной версии есть главное преимущество: она подстраивает элементы сайта под себя для удобного функционала и отображения на устройствах с разной диагональю. Вам не надо настраивать картинки или шрифт для планшетов или смартфонов. Ресурс перестроится сам.
Резюме
Рынок мобильных устройств растет и развивается 17-мильными шагами, все больше пользователей предпочитают мобильные версии сайтов, так как часто находятся в обстановке, которая не позволяет воспользоваться компьютером или ноутбуком. Число таких пользователей, естественно, будет расти. Мы желаем вам всегда быть в тренде и не допускать ошибок при создании мобильных версий ваших сайтов.