UX и конверсия веб-сайта на мобильных устройствах - 10 советов

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

В своем тексте о передовых методах работы с веб-сайтами я перечислил ряд советов, которые помогут сделать ваш сайт лучше.

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

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

Так что давайте перейдем к делу. Узнайте, почему UX и конверсия сайта на мобильных устройствах так тесно связаны.

UX и конверсия сайта на мобильных устройствах - 10 советов

1. Прежде всего, простота

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

Казалось бы, отзывчивость решает эту проблему - она "сдвигает" все элементы так, чтобы они правильно масштабировались на небольших устройствах. Такое универсальное решение не всегда подходит.

На мобильном телефоне (или планшете) имеет смысл показывать то, что имеет отношение к сайту. Контекст использования и используемое устройство также имеют значение. Мы по-разному читаем, просматриваем и ориентируемся на небольших экранах. Так что не все методы, использующие полную страницу, являются желательными.

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

2. Помните о скорости

Никому не нравится слишком долго ждать выполнения определенных задач.

То же самое относится и к загрузке веб-страниц. Когда мы просматриваем веб-страницы на мобильных устройствах, мы ожидаем высокой скорости. Проще говоря.

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

Возможно, вам будет полезен текст Бартломея Кильяна об инструментах тестирования скорости веб-сайта. Там вы найдете несколько действительно полезных услуг.

3. Помните об интуитивной навигации

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

Если пользователь хочет достичь цели (например, купить товар, скачать электронную книгу, подписаться на рассылку), то он должен сделать это максимально эффективно. Роль навигации заключается в том, чтобы помочь пользователю как можно легче добраться до места назначения.

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

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

4. Дайте отдельным элементам "дышать"

Соответствующее расстояние между элементами - одна из особенностей стиля плоского дизайна. Они особенно важны на мобильных устройствах.

Это просто связано с нашим физическим состоянием. Некоторые люди лучше владеют пальцами при разговоре по телефону, а у других возникают проблемы. Такое разнообразие совершенно нормально и понятно. Вот почему так важно, чтобы отдельные компоненты могли "дышать".

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

Управление вниманием аудитории также играет важную роль. Если все "сжато", то возникает слишком много хаоса, поэтому труднее найти элементы, которые должны быть наиболее релевантными для страницы.

5. Ограничить использование всплывающих окон

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

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

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

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

6. Упростить формы

Говоря о формах, отсюда я рекомендую текст Бартломея Кильяна об оптимизации форм на сайте. Среди прочего, вы узнаете, как:

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

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

7. Правильно определять размер текста и интервалы

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

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

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

Выбирайте проверенные решения - Open Sans, Roboto, Lato (кстати, разработанный поляком Лукашем Дзедзичем) или подобные им, которые чрезвычайно разборчивы. Используйте достаточно крупный размер шрифта, чтобы не напрягать глаза.

8. Избегайте использования "тяжеловесных" изображений

Этот пункт является уточнением информации, содержащейся в разделе № 2 данной записи.

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

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

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

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

9. Сделайте нижний колонтитул полезным

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

Это ошибка. Действительно, футер не так заметен, как более высокие разделы сайта, но его роль нельзя игнорировать.

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

Тест!

Все увенчано испытаниями.

Конечно, иногда вы можете положиться на свою интуицию или опыт профессионалов, но ничто не мешает вам периодически проводить, например, A/B-тесты.

Правильно реализованные, они могут показать вам через некоторое время, какие решения лучше других.

Все это делается для того, чтобы UX и конверсия веб-сайтов на мобильных устройствах были на максимально возможном уровне.

UX и веб-конверсия на мобильных устройствах - зачем ее улучшать?

Все просто - ведь у вас есть сайт не просто так. Скорее всего, вы продаете услуги или товары.

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

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