В недавней статье мы рассказали о том, как создать удобную форму поиска. Визуализация результатов поиска — не менее важная часть, о которой мы поговорим в этой статье. Страница с результатами поиска влияет на пользовательский опыт при посещении сайта. Ее цель — предоставить наиболее подходящие результаты поиска в удобной для восприятия форме.
Результаты поиска на сайте lampano.ru
После нажатия кнопки «Поиск» не стирайте запрос пользователя
Возможно, пользователь захочет переформулировать свой запрос, если посчитает результаты не совсем подходящими. Это проще будет сделать, если текст уже введен и его нужно просто изменить, а не вводить повторно.
На сайте ikea.com/ru запрос не удалился с выдачей результатов, можно его редактировать
При долгой загрузке используйте анимацию
Если загрузка страницы занимает большое количество времени, используйте анимацию или индикатор прогресса, так пользователь поймет, что страница загружается и ничего не зависло.
На сайте avia.yandex.ru есть индикатор прогресса, который в случае промедления дает понять, что все в порядке, поиск идет
Покажите количество результатов
Видя количество доступных элементов, пользователь принимает решение, сколько времени он готов потратить на то, чтобы просмотреть результаты. Первая страница с результатами самая ценная, на ней должны находиться результаты, наиболее соответствующие запросу.
Информация о количестве товаров по запросу на сайте shop.rivegauche.ru поможет покупателю оценить свои временные затраты
Не забывайте про сортировку и фильтрацию
Если результатов много, сортировка и фильтр помогут подобрать товар, максимально соответствующий требованиям пользователя.
- Дайте возможность выбирать несколько параметров одновременно
- Не перегружайте пользователя большим количеством опций. Если фильтров много, сверните их
- Не включайте сортировку в фильтрацию, это две разные функции
- Когда пользователь выбрал параметры, отображайте их в верхней части страницы
- Добавьте в фильтр кнопку «очистить»
Сортировка и фильтр на сайте sephora.ru помогут быстро найти нужный товар
Выберите подходящий вид для отображения результатов
Результаты можно выводить в форме списка, сетки или с возможностью выбора вида. Подходящий вид нужно подбирать основываясь на информационной составляющей. Детальная информация легче воспринимается в списках, картинки—в сетках. При этом важно учитывать специфику контента. Важный фактор при выборе вида—объем необходимой пользователю информации. Если пользователь выбирает пылесос, для него важны такие детали как марка, модель, мощность, рейтинг и другие характеристики. В этом случае подходящим будет вид списка. При выборе одежды в приоритете внешний вид, сетка будет лучшим вариантом отображения. Если на сайте большой ассортимент товаров разных направлений, дайте пользователю возможность самостоятельно выбрать вид.
На сайте s24.shop пользователь сам выбирает вид отображения товаров
Исправляйте ошибки и предлагайте альтернативы
При вводе пользователь может допустить ошибку. Если при этом сайт покажет ему, что он опечатался и предложит результаты с учетом исправленной ошибки, это будет хороший пользовательский опыт. При этом важно учесть характер ошибки. Если это явная опечатка, где пользователь пишет «рпмень», запрос можно заменить автоматически. Если же пользователь пишет в строке поиска «ослёнок», а система автоматически меняет запрос на «орлёнок»— это неправильно. В подобном случае нужно предложить альтернативный вариант, но не заменять его автоматически. Если по запросу не найдено результатов, предлагайте похожее или ценные альтернативные варианты, которые могли бы быть интересно пользователю. Это увеличит шанс того, что пользователь все-таки найдет нужный товар.
Интернет-магазин wildberries.ru при опечатке предлагает похожие товары
Выводы
- После нажатия кнопки «Поиск» не стирайте запрос пользователя
- При долгой загрузке используйте анимацию
- Покажите количество результатов
- Выберите подходящий вид для отображения результатов
- Исправляйте ошибки и предлагайте альтернативы
Поиск—важный элемент пользовательского опыта. Придерживаясь этих простых правил, вы сможете создать красивую и функциональную страницу результатов поиска.