|
|
|
|
|
В последнее время очень много говорят о мобильном поиске и это не удивительно. Доля мобильных устройств возрасла настолько, что мы уже совершенно официально и бесповоротно вошли в мир, который аналитики и бизнесмены называют «мобильный». А совсем недавно мобильный поиск Google впервые опередил настольный.
Согласно данным comScore (международная исследовательская компания, занимающееся анализом рынка интернет-технологий), в марте этого года число тех, кто использует мобильные устройства для поиска информации в интернете превзошло тех, кто делает это с домашнего компьютера. Где бы мы ни были, что бы ни делали, мы теперь всегда можем найти нужную информацию.
Google и сам многое сделал для мобилизации своих пользователей. Например, в апреле он изменил алгоритм своего поискового движка таким образом, чтобы сайты с качественной мобильной версией выводились в поиске выше.
Все это не могло не оказаться на самих сайтах. Сайты, адаптированные под мобильные устройства, должны быть максимально удобными для пользователей, отлично смотреться не только на смартфонах, но и на ноутбуках, планшетах и настольных компьютерах.
Адаптивный дизайн — одна из главных тенденций, которую нужно учитывать веб-мастерам в ближайшем будущем. Люди все больше серфят и покупают с помощью мобильных устройств и любая оплошность с мобильной версией сайта может обернуться катастрофой для продающего сайта.
Минималистичный дизайн
Главное правило — чем меньше, тем лучше. Сайты должны быть футуристическими, интуитивно понятными. Практичность должна превалировать над вычурными формами. Помните, что вы разрабатываете дизайн для гораздо меньшего экрана, чем на десктопе. Поскольку размеры экрана весьма малы, то вполне логично, что вы не станете использовать громоздкие элементы. Минимализм лучший выход.
Что означает минимализм применительно к дизайну мобильных сайтов? Пользователи должны видеть только тот контент, который им необходим, чтобы правильно использовать сайт. Он должен побуждать идти дальше и исследовать сайт. Кроме того, кнопки и меню должны быть интуитивно понятным, с акцентом на простоту.
Обратите внимание на мобильную версию сайта Crate & Barrel. Он представляет собой прекрасный образец минимализма в дизайне. Иконка-гамбургер спрятана в верхнем левом углу экрана, но при этом достаточно заметна и вы знаете на каком сайте находитесь благодаря логотипу вверху. Кроме того, прекрасно подобранная цветовая гама и шрифты не перегружают сайт.
Ориентируйтесь на различные устройства
Мобильные устройства сейчас очень разнообразны, не говоря уже об используемых в них операционных системах. Но некоторые дизайнеры забывают, что существуют различные платформы. Необходимо чтобы вы знали, какие устройства используют ваши посетители и какие у них характерные особенности. Будет ошибкой полагать, что пользователи iPhone и Android станут взаимодействовать с вашим сайтом одинаково.
Исследования показывают, что владельцы iPhone намного чаще покупают в интернете, чем владельцы Android. А если учесть, что их еще и меньше, то их покупательная способность становится еще более значимой.
Поэтому если вы разрабатываете мобильные приложения и сайты с целью монетизации, то сосредоточьтесь на удобстве пользователей iOS. Прежде всего потому, что они приносят вам больше денег.
Используйте общепринятые стандарты
Несмотря на то, что мобильный пользователей сейчас очень много, все они начинали знакомство с интернетом на своих домашних компьютерах и привыкли к определенным шаблонам.
Поэтому, разрабатывая сайт для мобильных пользователей постарайтесь не обмануть их ожиданий касаемо внешнего вида сайта и способа навигации. Вот основные элементы навигации, которые должны присутствовать в мобильной версии:
Самые популярные категории или страницы сайта
Иконка меню в виде гамбургера
Высококачественные фотографии
Заметная форма для поиска
Контрастные кнопки призыва к действию
В качестве примера обратимся к сайту Lowe. Там присутствуют все элементы навигации, которые мы привыкли видеть на десктопе.
Максимально простое оформление заказа
Это самый важный пункт. Если он не будет реализован, все остальное уже не имеет значение. Вы ведь не хотите чтобы клиент «соскочил с крючка» в самый последний момент, когда ему осталось только нажать на кнопку «Оплатить»?
Однако исследования показывают, что именно так все и происходит. Плохое юзабилити это худшее что может случиться с мобильным пользователем, когда он пытается сделать заказ. Это их настолько расстраивает, что они никогда больше не возвращаются на ваш сайт, даже с обычного компьютера.
Самая распространенная ошибка — когда кнопки призыва к действию и оформлению заказа не оправдывают ожидания пользователей. Например, когда кнопки слишком меленькие или их нельзя найти, когда товар уже добавлен в корзину.
Почерпнуть свежие идеи вы можете на мобильном лендинге Cult Pens. Обратите внимание на большую кнопку "Добавить в корзину", которая протянулась через весь экран.
Мобильный дизайн: отличия
Некоторые дизайнеры не понимают, что разработка дизайна для мобильных устройств кардинальным образом отличается от дектопного. Конечно, есть общие черты, потому что пользователи хотят видеть знакомые элементы, но есть и различия.
Минимализм (искусство делать больше меньшим средствами) должен стать ведущим принципом. Дизайнеры также должны понимать, что поведение пользователей iOS и Android различаются. Конечно, вы также должны разработать различные мобильные приложения для разных платформ.
И самое главное, сделайте процесс оформления покупки максимально простым. Если вы проигнорируете этот пункт, то вы просто выбросите деньги на ветер.
Надеюсь, вы найдете время реализовать все это на своем сайте и тогда к вам потечет река довольных клиентов, неся вам свои деньги.
Оригинал статьи на английском языке: http://www.webdesignerdepot.com/2015/09/how-to-design-for-mobile-ux/ |
|
|
|
|
|
Про рунет
По данным TNS, сейчас в России хотя бы раз в месяц пользуются интернетом 82 миллиона человек, или 66% жителей старше 12 лет. В городах с населением более 100 тысяч человек регулярно пользуются интернетом 46,9 миллиона человек, или 74% жителей. С мобильных устройств в сеть хотя бы раз в месяц заходят 32,8 миллиона человек, или почти половина жителей таких городов. «Настольная» аудитория в этих городах за год уменьшилась на 3%, а мобильная выросла на 20%.
Facebook получает больше половины своей «настольной» аудитории в России и треть мобильной за счет пользователей, которые заходят на этот сервис 1–2 раза в месяц. А через день соцсетью пользуются лишь 11% ее «настольной» аудитории и четверть мобильной.
У российских конкурентов Google и Facebook разрыв между «настольной» и мобильной аудиторией по-прежнему велик. У той же «ВКонтакте» эти аудитории составляют 12 миллионов и 14,7 миллиона пользователей соответственно, у «Яндекса» – 12 миллионов и 17 миллионов, у Mail.ru – 9,3 миллиона и 15,9 миллиона. Гендиректор компании «ВКонтакте» Борис Добродеев утверждает, что мобильные пользователи составляют уже больше половины аудитории соцсети |
|
|
|
|
|
| Цитата: |
| совсем недавно мобильный поиск Google впервые опередил настольный.
|
Это не удивительно, учитывая то, что доступ в интернет имеют 43% населения планеты, а мобильной связью пользуются более 95%. |
|
|
|
|
|
| Где-то читал, что 67% покупателей делают свои онлайн-заказы именно со смартфонов. |
|
|
|
|
|
При верстке нужно еще учитывать разрешения мобильных устройств
|
|
|
|
|
|
| Doc писал(а): |
|
Где-то читал, что 67% покупателей делают свои онлайн-заказы именно со смартфонов.
|
это не более чем реклама |
|
|
|
|
|
|
|
| Цитата: |
| владельцы iPhone намного чаще покупают в интернете, чем владельцы Android.
|
А еще у пользователей Android и iOS есть различия в потреблении порно. Если в сегменте смартфонов Android опережает iOS, а в сегменте планшетов на Apple приходится 68%.
Так что, мойте руки после использования чужого iPad  |
|
|
|
|
|
Здравствуйте! Мобильные шаблоны на платформе Blogger позволяют показывать мой блог всем посетителям, которые пользуются смартфонами. Таких пользователей более 50%, причём география заходов на блог самая разбросанная.
Но всё равно возникают вопросы у пользователей Apple-продукции (смартфонов и планшетов) по ширине картинок блога.
Вопрос: можно ли приспособить мобильную версию блога на платформе Blogspot к потребностям всех пользователей смартфонов и планшетов либо нужно делать уникальный адаптивный шаблон?
Ответа в разделе помощи по настройкам блога на платформе я не нашел.
С уважением, Вадим Маслий (bratmos). |
|
|
|
|
|
|
|
Ализандр, большое спасибо!
С уважением, Вадим Маслий (bratmos). |
|
|
|
|
|
|
|
| Doc писал(а): |
|
Где-то читал, что 67% покупателей делают свои онлайн-заказы именно со смартфонов.
|
смотря какие заказы...бытовой техники или кредитов вряд ли конечно. а вот заказ пиццы, суши, всяких бытовых принадлежностей, косметики очень даже может быть |
|
|
|
|
|
| Google внес изменения в критерии оценки mobile-friendly сайтов. Теперь страницы, содержащие межстраничную рекламу установки приложений, которая скрывает большой объем контента на странице, не будут считаться приспособленными для мобильных устройств. |
|
|
|
|
|
|
|
|
