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



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

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

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

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

Минималистичный дизайн

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

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

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



Ориентируйтесь на различные устройства

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

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

Используйте общепринятые стандарты

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

Самые популярные категории или страницы сайта

Иконка меню в виде гамбургера
Высококачественные фотографии
Заметная форма для поиска
Контрастные кнопки призыва к действию

В качестве примера обратимся к сайту Lowe. Там присутствуют все элементы навигации, которые мы привыкли видеть на десктопе.



Максимально простое оформление заказа

Это самый важный пункт. Если он не будет реализован, все остальное уже не имеет значение. Вы ведь не хотите чтобы клиент «соскочил с крючка» в самый последний момент, когда ему осталось только нажать на кнопку «Оплатить»?

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

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

Почерпнуть свежие идеи вы можете на мобильном лендинге Cult Pens. Обратите внимание на большую кнопку "Добавить в корзину", которая протянулась через весь экран.



Мобильный дизайн: отличия

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

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

И самое главное, сделайте процесс оформления покупки максимально простым. Если вы проигнорируете этот пункт, то вы просто выбросите деньги на ветер.

Надеюсь, вы найдете время реализовать все это на своем сайте и тогда к вам потечет река довольных клиентов, неся вам свои деньги.

Оригинал статьи на английском языке: http://www.webdesignerdepot.com/2015/09/ho...-for-mobile-ux/

Замечание модератора: Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней. Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой или обратитесь к любому из модераторов.