30 вещей в мобильных сайтах, к которым стоит присмотреться

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

Lowe’s

Крупные и заметные заголовки:

Текстовые блоки разных цветов, что серьезно облегчает чтение и сравнение с небольшого экрана смартфона.

Подсвеченное подтверждение того, что товар добавлен в корзину. Как часто нам недостает этого функционала в полной версии веб-сайта.

Cleartrip

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

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

Argos

Для выбора категории используются крупные кнопки с поясняющими иллюстрациями.

Привлекательные четкие фотографии продукта, организованные в слайдшоу (например, для этого продукта предлагается 6 фотографий).

WarbyParker

Иконки меню (в продуктовых категориях отличаются в зависимости от пола покупателя!).

Красиво оформленная рекомендация «Вам также может понравиться» (“You might like these too”) на странице продукта.

Гифки способны заменить долгие в загрузке видео:

Красивая палитра, приятный шрифт.

BuzzFeed

Более простые и аккуратные сообщения с предложениями о загрузке приложений.

Кнопки «Поделиться», размещенные в конце каждой страницы, напомнят читателю поделиться интересной информацией с друзьями.

TED

Системное поле ввода.

Набранный крупным шрифтом раздел “About” внизу главной страницы.

Kayak

Простой дизайн главной страницы без избытка опций.

Автозаполнение полей (текущая дата, продолжительность заезда — 1 ночь, 1 человек, 1 номер) и подсказывающие символы.

GPS-определение текущего местоположения.

JohnLewis

Крупные поля для тех, у кого большие пальцы.

Specsavers

Большие поля для выбора продуктов (этот скриншот из раздела товаров для мужчин). Помогает избежать ошибочных кликов.

Легко читающиеся характеристики продукта в верхней строке.

ChefsFeed

Полезные предложения на домашней странице.

Заголовок закреплен в верхней части страницы.

Фильтры в меню позволяют сузить поиск.

Плагин “Click to call” (кликни, чтобы позвонить). Экономит время пользователя.

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