28.07.2016

Основы мобильного интерфейса

Основы мобильного интерфейса

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

Зона большого пальца

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

Мобильный интерфейс

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

Закон Фиттса

Закон Фиттса – от увеличения кнопки не зависит повышение ее эффективности. Данный закон относится не только к мобильной версии сайта, оттого, что вы увеличиваете форму захвата или кнопку с призывом, конверсия не увеличивается.

Маленький радиус нажатия

Минимальная сенсорная область 7мм x 7мм. Средняя ширина пальца взрослого – 25 мм. Уберегите пользователя от случайного нажатия на другой элемент в вашем интерфейсе. Между элементами ставьте зазор в 2 мм.

Слайд-бар

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

Выдача ошибок по ходу заполнения поля

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

Отсутствие иерархии в контенте

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