Веб-сайты UX Design 10 вещей могут научить вас
Тебе когда-нибудь приходило в голову, что ты все еще можешь расти профессионально, планируя свой отпуск? Популярные туристические сайты, формы бронирования и оформления заказа, планировщики путешествий и расписания отелей - все это отличные источники расширить свои знания в области дизайна пользовательского опыта.
Выбирая лучшие места, отели и планируя поездку, стоит обратить внимание на то, что работает, а что нет, что вдохновляет вас и что заставляет вас сразу перейти на другой сайт.. Ваши реакции, восхищения и отвращение - все это отличительные признаки эффективности дизайна пользовательского интерфейса сайта..
В этой статье вы можете узнать 10 уроков о впечатлениях пользователей, которые вы можете получить на популярных туристических сайтах.
Разница между UI и UX
UX не UI, это как неписаный закон. Когда вы читаете о юзабилити веб-сайта, вам нужно подумать о его пользовательском интерфейсе. Пользовательский интерфейс является множество различных визуальных элементов такие как меню, кнопки и значки, которые ваши посетители используют (нажимают, держат, нажимают), когда они взаимодействуют с вашим сайтом.
Юзабилити - это качество, которое описывает пользовательский интерфейс (UI). Удобство использования показывает эффективность пользовательского интерфейса, такого как как легко пользоваться сайтом (Обучаемость), как быстро пользователи могут достичь поставленных целей (КПД), как легко они могут вспомнить свои воспоминания о том, как работает сайт (запоминаемость), и как приятно пользоваться (удовлетворенность пользователей).
Удобство использования - один из аспектов более сложного понятия, называемого пользовательским интерфейсом (UX). Пользовательский опыт включает в себя все, что влияет на опыт пользователя - либо отрицательно, либо положительно. Хороший UX отвечает всем потребностям потенциальных клиентов - хорошее удобство использования и многое другое.
По данным исследовательской фирмы Nielsen-Norman Group:
1. Дайте пользователям место для начала
Прежде всего, вам нужно дать вашим посетителям место, откуда они могут начать. Обычно домашняя страница получает наибольшее количество кликов не только потому, что это основной вход на сайт, но и когда пользователи приходят из поисковой системы, следующим кликом, скорее всего, будет домашняя страница..
Поэтому вам нужно предложить привлекательный контент и макет на главной странице если вы хотите, чтобы ваши посетители оставались на вашем сайте.
Домашняя страница Booking.com доказывает, что они хорошо понимают потребности своих клиентов. Просто подумай об этом. Что вы хотите сделать на туристическом сайте? Вы либо знаете, куда хотите отправиться, и хотите найти возможности как можно быстрее, либо не уверены в месте своего путешествия и нуждаетесь в вдохновении.
Booking.com разместил Общая форма поиска на левой стороне своей домашней страницы для тех, кто уверен в своей будущей поездке. Посетителям не нужно тратить свое время на просмотр ненужного контента. Это оставляет им большую решимость и повышенную уверенность в себе.
Оставшееся место на экране над сгибом дает много вдохновения для менее решительных: три больших изображения популярных мест (Абу-Даби, Нью-Йорк и Дубай) дают предложения, поток AJAX о “Только что забронировали” Поездки показывают, чем в данный момент занимаются другие пользователи, и даже есть небольшой раздел, который гарантирует потенциальным клиентам политику бесплатной отмены.
На главной странице Booking.com каждый получает необходимый стимул и позитивные чувства, чтобы перейти на сайт, прежде чем даже коснуться полосы прокрутки..
2. Сделайте вашу навигацию очевидной
Если вы хотите, чтобы пользователи оставались на вашем сайте, вы должны предоставить им очевидную и простую в использовании навигацию.
Навигация TimeOut.com похожа на умную хозяйку: она дает посетителям ценную помощь, когда им это нужно, но не раздражает их. Если вы посмотрите на картинку ниже, вы можете увидеть, что навигационная система имеет четыре разных элемента: огромная, легко узнаваемая панель поиска, главное меню с четко определенными пунктами (Путеводители по городам; Фильм; Музыка, Искусство и культура; Еда и напитки; О нас; Time Out Shop), хорошо продуманная панель с сухарями и боковая панель список самых популярных городов.
TimeOut разработал свою навигационную систему таким интуитивно понятным способом, который дает посетителям дополнительные стимулы для изучения сайта. Маленькая миниатюра прямо рядом с каждым элементом боковой панели дает визуальный ключ, краткое описание под заголовком «Еда и напитки» гарантирует посетителям, что они находятся на правильном месте, хлебные крошки упрощают переход, а верхняя панель поиска помогает пользователям перейти к следующему местоположению, если им скучно с текущим.
Каждый элемент поддерживает другие - явный признак отличного дизайна UX.
3. Используйте ударные изображения
На приведенном ниже снимке экрана показана страница профиля ресторана TripAdvisor. Я уверен, что вы уже читали, что стоковые фотографии не приносят пользы: они обычно приносят посетителей и не мотивируют их двигаться вперед в воронке конверсии..
Альтернативой стоковым фотографиям является эффектное изображение, которое вызывает у пользователей сильные эмоции. И мы все это знаем усиление эмоций ведет к повышению лояльности клиентов.
Туристические сайты обычно используют изображения высокого качества, но TripAdvisor поднимает их на следующий уровень, поощрение пользователей добавлять свои собственные фотографии в каждый ресторан. Таким образом, TripAdvisor расширяет свое содержание пользовательские изображения, которые обычно более интересны для среднего посетителя туристического сайта, чем фотографии, сделанные профессионалами.
В конце концов, давление со стороны сверстников - одна из самых сильных мотиваций. TripAdvisor также сохраняет свой визуальный контент свежим добавив впечатляющие фотографии, снятые пользователями.
4. Сохраняйте это простым
Меньше, как правило, больше, поэтому всегда полезно держать вещи простыми и сосредоточиться только на соответствующей информации. Мир настолько полон отвлекающих факторов, что ваши посетители наверняка будут благодарны, если вы спасете их от ненужного пуха.
“Будь проще” это принцип UX, которому Lonely Planet, по-видимому, следовал на своей домашней странице. самые важные темы что интригуют их пользователи расположены в аккуратной сетке привлекательных миниатюр поддерживается заголовки с одним или двумя словами.
Домашняя страница LonelyPlanet особенно умна с точки зрения пользовательского опыта, так как миниатюры также служат в качестве навигации, когда они дать пользователям легко понятный визуальный ключ.
Сетка отзывчива, поэтому она работает на каждом окне просмотра. На мобильных устройствах и планшетах миниатюры выглядят как значки мобильных приложений. это знакомый макет для всех мобильных пользователей, и знакомство также является чем-то, что дает комфорт посетителям, повышая тем самым их взаимодействие с сайтом.
5. Используйте глаголы действия
Скорее всего, вы знакомы с глаголами действия с сайтов о карьере. Активные глаголы привлекают не только рекрутеров, просматривающих резюме, но и посетителей сайтов, просматривающих веб.
AirBnB - популярная социальная сеть с совместным проживанием. принадлежать в любом месте, Арендная плата, Список ваше пространство, Обнаружить мест, Проводить исследования мир, Увидеть где люди путешествуют, Поделиться ваш опыт и т. д..
Глаголы действия невероятно эффективны, потому что они перевести пользователей из пассивного состояния в активное. Положительный опыт всегда требует активности от имени пользователя; Вот почему парки приключений так популярны.
Ведь что ты еще помнишь? Что-то, что вы сделали сами, или что-то, что вы только что прочитали в книге? Увидеть? Взаимодействие привлекает вас тоже. Поэтому, если вы хотите повысить удобство работы своего сайта, не стесняйтесь использовать глаголы действия там, где они уместны..
6. Оптимизируйте свои формы
Как слишком сложные формы часто приводят к немедленному отказу самое разумное, что вы можете сделать для удобства пользователей, - это максимально упростить формы на своем сайте. Что я имею в виду под оптимизацией?
Вы можете увидеть отличный пример, если взгляните на универсальную форму поиска Priceline.com на их домашней странице. Прайслайн формы поиска скрыт внутри удобного горизонтального раздела с вкладками.
Вкладки содержат пять различных форм поиска, связанных с пятью областями (отели, рейсы, автомобили, путевки, круизы), с которыми связана компания..
Здесь действительно круто то, что пользователям не нужно беспокоиться о том, что им не интересно, они могут перейти прямо к нужной форме поиска. Поэтому они не обременен дополнительными полями данных, поля формы сведены к абсолютному минимуму, что означает повышенная эффективность, уменьшенное раздражение и быстрое понимание - лучший пользовательский опыт.
7. Влияние с личными историями
Вы можете повысить заинтересованность пользователей с помощью умного использования личных историй, как вы на самом деле испытываете это, на главной странице GoBackpacking.com.
Приключения реальных людей всегда более интересны, чем чрезмерно изысканная маркетинговая болтовня. Ваши посетители не хотят читать те же самые утомительные клише, которые они могут прочитать на сайте вашего конкурента, - они могут даже сами генерировать такой же слабый эффект.
Отзывы, рейтинги, прямые и модерируемые комментарии, статусы, сообщения в блогах, личные истории, рекомендации - все это добавляет индивидуальность вашему сайту представляя качественную информацию, к которой ваши посетители могут эмоционально подключиться.
GoBackpacking заполняет свою домашнюю страницу личными историями своих пользователей, что позволяет посетителям немедленно погрузиться в контент сайта, даже не подозревая об этом.
8. Включить сопутствующие товары
Связанные, рекомендуемые и популярные виджеты продуктов используются всеми крупными игроками электронной коммерции, поэтому неудивительно, что туристические сайты также используют их..
HotelTravel.Com решает задачу очень хитрым и эффективным способом. Рекомендательный двигатель занимает место, которое ищет посетитель - в нашем случае это Гонконг - и показывает еще варианты отелей, рекомендованные другими пользователями. Соответствующие отели также рекомендуются, решение 2-в-1, которое всегда является хорошей идеей.
Дизайнеры HotelTravel.Com сделали еще один шаг вперед и разместили сопутствующие товары в удобный аккордеон что позволяет пользователю рекомендации группы в соответствии с четырьмя различными критериями (Лучшая цена, Лучшее обслуживание, Лучший номер Стандарт, Лучшее расположение).
Чтобы сделать виджет визуально интересным, в него также включены рейтинг, цена, небольшая миниатюра и короткая цитата из последнего обзора. оказать максимальную помощь посетителям решить, какое жилье лучше всего соответствует их потребностям.
9. Поговорим о преимуществах
Показывать посетителям преимущества, которые они могут получить на вашем сайте, всегда удобнее, чем приставать к ним с сухими фактами, которые заставляют их заснуть.
На домашней странице Booking.com мы видим умное использование этого принципа UX-дизайна. В правой части экрана вы можете увидеть “Зачем использовать Booking.com?” раздел, который включает в себя шесть преимуществ все они соответствуют ценностям среднего путешественника (низкая цена, выбор платы, простота использования интерфейса, заполненная система просмотра, качественное обслуживание клиентов и круглосуточная доступность).
Конечно, эти значения составлены в более привлекательный путь и приходят со ссылками где потенциальные клиенты могут двигаться дальше. “Зачем использовать Booking.com” виджет на самом деле расширенная версия регулярного “Характеристики” раздел среднего сайта малого бизнеса, но он включает в себя множество вспомогательных элементов.
красочные иконки, выделенные ссылки и конкретные данные (такие как “701 118 объектов по всему миру”) все заставляют пользователей верить, что они находятся на профессиональном веб-сайте, которому они могут доверять. витрина популярных мест от Сиднея до Дублина на левой стороне и небольшой виджет стороннего ReviewCentre - все поддерживают опыт и завоевывают доверие.
10. Обеспечить социальное доказательство
Когда люди говорят о социальном доказательстве, они обычно имеют в виду виджеты социальных сетей, такие как Facebook .., который также является отличным элементом хорошо разработанного UX, но домашняя страница TripAdvisor представляет собой отличный пример. как работают другие формы социального доказательства.
Концепция социального доказательства основана на психологическом принципе, который говорит, что люди с большей вероятностью что-то делают если они видят окружающих сделать то же самое. Внешняя проверка - отличная мотивация для большинства из нас, поэтому мудрые дизайнеры встраивают социальные доказательства в свои сайты таким образом, чтобы побудить посетителей повторить поведение своих коллег..
На TripAdvisor привлекательный социальный контент встроен в удобную навигацию по вкладкам с тремя разделами: обзоры отелей, фотографии, сделанные пользователями и форумы. Название виджета “О чем говорят путешественники” который менее настойчивый, чем средний субтитр на коммерческих сайтах; поэтому он сразу бросается в глаза.
Раздел «Отзывы об отеле» разработан таким образом, чтобы делает контент легким для усвоения: небольшая фотография в профиле и рейтинг пользователя, оставившего отзыв, название отеля, в котором проверен отзыв, краткая цитата из самого обзора и значок рейтинга, который хорошо соответствует общему дизайну сайта..