Станислав Хрусталёв написал о лучших практиках в работе поисковой строки в интернет-магазинах. Вот некоторые из них:
— На всех страницах, где есть поисковая строка, располагайте её в одном и том же месте и оформляйте одинаково;
— Поисковая строка и кнопка перехода в каталог — ключевые методы работы с интернет-магазином, размещайте их рядом;
— При прокрутке страницы закрепляйте шапку сайта с поиском. На мобильных сайтах размещайте кнопку поиска на нижней панели;
— Поле поиска должно быть одно, даже если способов поиска несколько;
— И достаточно широким — не менее трети от ширины шапки. Узкое поле можно расширить при фокусе;
— Если поиск вторичен, поле можно отображать по нажатию на иконку;
— В поле поиска размещайте лупу и плейсхолдер;
— Плейсхолдер может быть призывом к действию («Найти в каталоге»), вопросом пользователю («Что вы ищете?»), примером запроса (часто покупаемые товары или товары к событию), рассказывать о способах поиска («Введите название товара, заболевания или симптома»), отражать широту ассортимента («Поиск по 110 000 дизайнов»);
— Подсказки отображайте сразу после фокуса на поле. Пока пользователь ничего не ввёл, там могут быть популярные товары и бренды, тренды, новые товары, а также история поиска;
— Возможность одним кликом очистить историю поиска;
— Список подсказок должен полностью умещаться на экране без прокрутки;
— В поле поиска дополняйте текст, введённый пользователем, текстом самой подходящей подсказки, чтобы не надо было вводить запрос целиком. Текст дополнения должен отличаться от введённого текста визуально;
— Распознавайте текст, введённый с неправильной раскладкой клавиатуры, опечатки, сленг, аббревиатуры и синонимы;
— Возможность перейти из поиска в категорию;
— Учитывайте, что человек может искать не продукт, а что-то иное: условия доставки, возврата, адреса магазинов;
— Для товара в списке подсказок отображайте фото, цену (валюту лучше показать символом), за что эта цена (упаковка, килограмм), скидку, баллы программы лояльности, рейтинг;
— Возможность добавить знакомый товар в корзину прямо из списка подсказок.
Post #966
6.32K