Вы можете выбрать любой из описанных выше подходов — главное, убедитесь, что при переходе от обычной версии сайта к мобильной вы не забыли ни об одной из функций выпадающего меню.
Вы надеялись, что мы уже покончили со всеми проблемами?
А как насчет сайтов для устройств с бесконтактным или гибридным интерфейсом? Мобильные устройства с механизмами непрямого воздействия — такими как трекпады, трекболы, колесики прокрутки или физическая клавиатура (цифровая или QWERTY) — позволяют при взаимодействии с Интернетом не водить пальцами по экрану.
Когда пользователи перемещаются по веб-страницам при помощи описанных выше средств промежуточного контроля, CSS-состояние: hover часто применяется для того, чтобы выделить выбранный элемент интерфейса, не прибегая к Java Script. И хотя правильнее в таких случаях было бы задействовать состояние: focus, таблицы стилей многих сайтов не содержат его явного описания. Поэтому такие мобильные браузеры, как OperaMini, используют: hover, чтобы выделить активный элемент интерфейса, выбранный пользователем в данный момент.
Добавив в таблицу стилей описание состояний: hover и: focus для всех ссылок, кнопок и меню вашего мобильного сайта, вы облегчите его использование на устройствах, оборудованных средствами непрямой манипуляции.
Когда речь идет об устройствах, не имеющих тач-интерфейса, можно вообще не беспокоиться о состоянии: focus. И хотя в настоящее время подавляющее большинство производителей смартфонов отдают предпочтение сенсорным экранам, не все устройства, выпущенные ими ранее (да и те, что продолжают выпускать), имеют тач-интерфейс. Экраны старых моделей обычно меньше, поэтому тач-зоны заняли бы слишком много места и использовать жесты было бы невозможно. А значит, возникает необходимость в некоторой адаптации.
Ниже я еще расскажу о методике прогрессивного улучшения, позволяющей уменьшать размер интерактивных зон так, чтобы это не создавало неудобств для пользователей.
Но поскольку я обещал, что не стану слишком углубляться в технические аспекты и постараюсь сделать эту книгу как можно более краткой, то предоставлю право подробно рассказать о прогрессивном улучшении тем, кто разбирается в этом вопросе лучше меня (http://bkaprt.com/mf/47).
Мобильных устройств с сенсорным экраном и тач-интерфейсом становится все больше, поэтому необходимо постоянно работать над тем, чтобы у пользователей не возникало проблем при взаимодействии с нашими сайтами.
Поэтому:
• при определении размера и расположения тач-зон применяйте принцип «чем больше, тем лучше»;
• постарайтесь как можно лучше изучить «язык жестов», использующихся при работе с активным экраном, и то, как пользователи применяют их для навигации и управления сайтом;
• смело используйте принципы естественного пользовательского интерфейса (NUI), благодаря которым внимание посетителей сайта сосредоточивается на контенте, а не на оболочке;
• выберите наиболее подходящий для мобильного сайта способ внедрения функций, реализованных на обычном сайте в виде выпадающего меню;
• при проектировании мобильного сайта не забывайте об устройствах без сенсорного экрана и с гибридным интерфейсом.
Теперь, после того как мы разобрались с основами, давайте обратим наше внимание на самое важное из действий — ввод.
ОДНО ИЗ ГЛАВНЫХ ПРЕИМУЩЕСТВ Интернета заключается в том, что он позволяет человеку не только изучать и использовать контент, но и участвовать в его создании. В мобильных технологиях правильная организация ввода данных — вопрос не менее важный, чем их отображение. Однако организация этого процесса также имеет свои особенности. Поэтому:
• думайте о мобильных приложениях как о предоставленной пользователю возможности создавать что-то новое, причем там и тогда, где и когда его посетит вдохновение или придет интересная мысль;
• используйте оптимизированные для мобильных устройств теги label[8] — это поможет предельно ясно формулировать вопросы;
• чтобы упростить ввод данных, применяйте различные типы ввода, атрибуты и маски;
• выбирайте правильный дизайн для последовательных, нелинейных и контекстных форм;
• используйте любые возможности для того, чтобы минимизировать количество полей для ввода данных.
Дизайнеры обычно не склонны соглашаться друг с другом. Именно поэтому кажется удивительным, что в появившихся за последние годы руководствах по дизайну мобильных приложений можно найти множество примеров единого мнения по вопросу ввода данных. Первоначально почти все разработчики были согласны с тем, что мобильные устройства — не самый удобный инструмент для ввода данных. В книге Mobile Web Design and Development («Дизайн и разработка мобильных сайтов») Брайан Флинг писал:
