На прошлой неделе вышел очередной выпуск электронного журнала Inspire Magazine от корпорации Adobe. Среди прочих материалов – статья “Ten best practices for designing mobile websites” от Эндрю Хендерсона (Andrew Henderson), версию которой в переводе на русский язык AIN.UA представляет вам сегодня.
Эндрю Хэндерсон – консультант, технолог и разработчик с
12-тилетним опытом, руководитель и стратег в целом ряде первых
европейских проектов, ориентированных на мобильные устройства.
Время радикальных перемен для дизайнеров и разработчиков мобильных
приложений наступило. Понятие мобильного браузера существовало еще с
90-х гг. ХХ века. Но с запуском корпорацией Apple своего iPhone в 2007
г. стало понятно, что мобильный веб и мобильные приложения имеют куда
больший потенциал, чем принято было считать. И с того момента, с
появлением и развитием все более мощных смартфонов с сенсорными экранами
и интернет-планшетов начался постоянный рост мобильного серфинга;
компании больше не могли игнорировать тот факт, что оптимальный опыт
использования мобильных сайтов неизбежно ассоциируется с брендом
компании.
Постепенно фокус в разработке для мобильных устройств смещается от
разработки нативных приложений к разработке под конкретные устройства и
платформы, со своими спецификациями в зависимости от экранов и других
характеристик устройства. Миграция приоритетов в мобильной разработке
происходит по тем же причинам, по которым настольное По сейчас активно
мигрирует в “облака”. Для всех лучше, если приложение или сайт работают с
одинаковой производительностью и удобством для пользователя независимо
от места, платформы, ОС и параметров устройства. Обновление “облачного
приложения” сразу обновляет его для всей линейки устройств. То же
происходит и с мобильными сайтами. Приоритет в сторону мобильных сайтов
объясняется тем, что в этом случае нет необходимости каждый раз
обновлять каждое отдельное приложение для каждого типа устройств,
проходить процесс утверждения приложения в магазине для конкретной
мобильной платформы и разрабатывать отдельно под каждую ОС.
Если аккумулировать весь мой практический опыт и рекомендации, то
есть 10 основных положений, которые надо сегодня учитывать в разработке
мобильной версии бизнес-сайта или любого онлайн-проекта.
Первоклассные мобильные сайты ставят функциональность выше внешней формы
Мобильные прльзователи привыкли к тому, что такая версия сайта
адресована удовлетворению конкретной потребности: развлечения,
продуктивности, быстрой коммуникации. Поэтому императивом при разработке
мобильной версии сайта является его функциональность, способность
решить базовую задачу, которая стоит перед пользователем. Интерфейс,
который сбивает с толку пользователя или делает мобильный сайт жутко
медленным, навсегда отобьет желание такого пользователя доверять вам,
даже если вы сделали самый красивый и необычный дизайн.
Производительность – это sexy
У пользователей обильных устройств – миллион возможностей для
вовлечения в интерактив. Каждый новый мобильный сайт будет конкурировать
с 500 тыс+ приложений для iOS, 260 тыс Android-приложений и еще почти с
4 млн мобильных сайтов. Самый простой способ выделиться среди этой
“толпы” – это производительность и быстрота работы. Потребитель не
терпит “тормозящих” сайтов, но очень быстро привыкает и высоко ценит те
проекты, которые просто хорошо справляются со своей задачей.
Простота – залог успеха
В основе мобильного сайта должен лежать максимально простой и
понятный концепт. Выберите идею, которая обладает настоящей ценностью
для потенциальных пользователей, а затем превратите эту идею в мобильный
сайт, простой для понимания и ежедневного использования. Версии сайтов
для мобильных устройств, которые сделаны просто и понятно, пользуются
куда большим успехом у потребителя.
Не создавайте приложение, если планируете мобильную версию сайта
Огромный “плюс” мобильных приложений – в том, что они способны решать
задачи, с которыми мобильный сайт не справится. Но нет смысла создавать
мобильное приложение, которое будет решать задачи мобильного сайта.
Мобильное приложение “загоняет в рамки” процесс разработки и
совершенствования задач для конкретных экосистем и платформ. Для
кросс-платформенной разработки необходимы дополнительные существенные
затраты, и довольно сложная система менеджмента, и вовлечение сторонних
участников в процесс (операторы, производители мобильных гаджетов,
администрация магазинов приложений и т.д.). Мобильный сайт позволяет
всего этого избежать и пройти весь путь контакта с мобильным
пользователем за меньшее число “шагов”.
Подключайте дизайнеров на ранней стадии и постоянно вовлекайте их в процесс
Несмотря на определенные ограничения, в создании мобильного сайта
всегда надо и начинать, и заканчивать процесс его разработки вместе с
дизайнером. Во многих мобильных сайтах инженерная составляющая
поставлена над дизайнерской, и потому неудачи преследуют такие проекты.
Технология и разработка – безусловных залог успеха. Но не забывайте о
юзабилити и дизайне.
Сбалансируйте дизайн и производительность
И разработчики – точно также, как дизайнеры, – должны с самого начала
активно участвовать в проекте. Производительность мобильных устройств
на порядок ниже по сравнению с настольными ПК, поэтому важно
сбалансировать быстродействие и внешний вид в осуществлении конкретных
операций.
Задайте бренд в самом пользовательском интерфейсе
Пользовательский интерфейс мобильного сайта должен отражать
идентификацию конкретного бренда. Большая часть мобильного веб-трафика –
это целевой трафик, и лишь некоторая – это переходы из результатов
случайного поиска. Визуальная идентификация бренда через мобильный сайт
позволит не только повысить лояльность, но и сделать понятнее тот факт,
что пользователь нашел именно то, что искал. Шрифты, фирменные цвета,
другие компоненты брендбука – всё должно быть учтено.
Определите ключевых пользователей и адресуйте проект им
Мобильный сайт – более избирательный проект, чем традиционный
веб-сайт. Посетители мобильного сайта в основном не имеют под руками
клавиатуры и пользуются таким сайтом “на ходу”. Определите ключевые
функции, которые важны ЦА такого мобильного проекта – и сделайте сайт,
адресованный непосредственно им.
Oптимизируйте дизайн в пользу производительности
Печальная правда состоит в том, что неважно, насколько хорошо вам
удалось разработать и внедрить мобильный сайт, надежность самой
мобильной экосистемы – штука довольно “шаткая”. Работа операторов,
местоположение пользователя в текущий момент, параметры конкретного
мобильника могут повлиять на надежность и стабильность работы сайта.
Поэтому крайне важно выяснить факторы и зоны резкого снижения
производительности мобильного сайта и разработать такие варианты дизайна
и структуры мобильного сайта, чтобы интересы пользователя минимально
страдали от сбоев сети, старой версии мобильного ПО или перебоев в
покрытии мобильного интернет-соединения.
Приоритеты внешнего вида и требования рабочего состояния сайта
Задачи мобильного сайта: работать быстро, выглядеть хорошо,
поставлять всю требуемую информацию для пользователя / клиента несмотря
на малую мощность смартфона / мобильного телефона, ограничения в размере
экрана, пропускной способности мобильного соединения и т.д. Соединить
всё это “в одном флаконе” непросто, поэтому синхронизация быстродействия
и внешнего вида в итерациях разработки – это самое главное. Зачастую
успех или провал мобильного корпоративного сайта определяется именно
умением “балансировать на краю пропасти”.