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

Поиск позволяет решать следующие задачи:

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

Итак, для чего нужна форма, мы определились, теперь перейдем к ее внешнему виду.

Как должна выглядеть форма поиска

Сразу ответим на популярный вопрос: разместить одну кнопку или показать форму полностью? Лучше отразить поле ввода и кнопку запуска, чтобы не заставлять пользователя совершать лишние действия. Порой такие кнопки не всегда заметны.

Не сразу удается найти кнопку поиска на сайте туристического бюро

Незаметная кнопка поиска

Удобно сразу ввести запрос на сайте интернет-магазина одежды

Заметная форма поиска

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

  1. Поле ввода. Сделайте его удобным по длине и высоте, чтобы можно было ввести поисковый запрос в 2-3 слова. Используйте крупный шрифт запроса, чтобы пользователи могли разглядеть и при необходимости поправить свой запрос.

    Слишком маленькое поле ввода на сайте по продаже сумок:

    Маленькое поле ввода

    Достаточно места для запроса на сайте спорттоваров:

    Удобное поле ввода

  2. Кнопка запуска. Многие владельцы сайтов про нее забывают, и пользователи не могут понять, как запустить поиск. Кнопка должна быть заметной и удобной для клика, поэтому лучше написать на ней текст «Найти» или «Искать», а не использовать мелкую и незаметную иконку лупы. В «лупу» сложно попасть курсором мышки.

    Кнопка на сайте типографии не сразу заметна и неудобна для клика:

    Незаметная кнопка запуска поиска

    На сайте книжного интернет-магазине располагается заметная кнопка, по которой легко кликнуть:

    Яркая кнопка запуска поиска

  3. Выбор раздела поиска. Если у вас много разделов, то лучше добавить возможность выбора, например, отделить поиск по каталогу и блогу.Пример удобной кнопки выбора категории товаров с сайта детских товаров:Выбор категорий в форме поиска

Где лучше разместить форму поиска

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

Но также обсудим другие варианты:

Главное меню. Подходит, если в меню немного ссылок и есть достаточно места для формы.

Места явно недостаточно для формы
(сайт компьютерного сервисного центра):

Маленькая форма поиска

Форма легко поместилась в меню
(интернет-магазин чая):

Подходящий размер формы поиска

Над боковым меню. Вариант неудобен тем, что боковое меню есть не на всех страницах сайта и здесь недостаточно места для ввода запроса.

На примере сайта по продаже бытовой химии видно, что поле ввода слишком короткое:

Подходящий размер формы поиска

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

Пример размещения формы в подвале сайта:

Форма поиска в подвале сайта

Другие варианты. Здесь пользователи не ожидают увидеть форму поиска и могут ее пропустить. Также будет сложно расположить форму в одном и том же месте на всех страницах сайта.

Пример размещения формы поиска в основной части страницы на сайте по продаже электронных компонентов:

Форма поиска в основной части страницы

Еще раз повторимся, что лучше всего разместить форму поиска в шапке сайта, так как именно туда пользователь смотрит в первую очередь. Теперь, когда мы определились с расположением, обсудим страницу результатов поиска.

Как правильно выводить результаты поиска

Лучше всего показать результаты на отдельной странице, при этом:

  1. Сохраните введенный запрос. Пользователь должен видеть, что он ввел ранее.

    На сайте по продаже одежды и обуви исчезнувший запрос только дезориентирует:

    Форма поиска без сохранения запроса

    Дублирование запроса помогает не потеряться в интернет-магазине верхней одежды:

    Пример сохранения введенного запроса

  2. Продублируйте форму поиска на странице с результатами для повторных запросов. Возможно, пользователь передумал, а ему придется снова искать форму на сайте.

    Над запросом на сайте туристического снаряжения явно не хватает формы поиска:

    Отсутствие формы поиска в начале страницы

    На странице сайта по продаже сумок удобно вводить следующий запрос:

    Удобное дублирование формы поиска

  3. Указывайте количество найденных результатов. Пользователь должен сразу видеть, сколько вариантов у него есть.

    Не ясно, сколько найдено подходящих вариантов. Пример взят с сайта интернет-магазина мебели:

    Отсутствие информации о количестве найденных результатов

    Сразу видно количество найденных статей на сайте юридических услуг:

    Правильный вывод количества результатов

  4. Визуально отделяйте результаты друг от друга. Информация не должна быть в куче, поэтому добавляйте разделительные линии, отступы, выделяйте заголовки и т.д.

    Несмотря на разделительные линии, однотонный текст сливается (пример взят с сайта по продаже систем безопасности):

    Неудачный пример разделения результатов поиска

    Результаты хорошо отделены друг от друга на сайте строительного центра:

    Результаты поиска хорошо разделены

  5. Не оставляйте страницу результатов пустой. Предложите популярные товары или список статей, возможно, они заинтересуют пользователя.

    Такая страница только теряет клиентов. Пример с сайта продажи одежды:

    Пустая страница результатов поиска

    На сайте товаров для дома грамотно выводятся похожие товары:

    Список похожих товаров на странице результатов поиска

  6. Используйте подсказки. Помогите потенциальному клиенту быстрее ввести запрос.Удобно, когда пользователю подсказывают категорию и выводят подходящий товар.Пример от интернет-магазина товаров для дома и отдыха: Пример вывода подсказок при вводе запроса
  7. На странице результатов сохраняйте основные элементы навигации. Не должно происходить смены адреса или внешнего вида страницы.Такие страницы результатов только дезориентируют пользователей. Пример с сайта по продаже установок альтернативной энергии: Пример смены адреса сайта на странице результатов поиска

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

Выделим основные способы и разберем их плюсы и минусы:

  1. Самописный поиск+ Основное преимущество – создание поиска на основе всех ваших желаний и идей, который полностью интегрируется в вашу систему сайта. Ограничения: особенности выбранной cms, дороговизна работы специалистов и трата времени на разработку. У многих cms есть встроенные средства, что немного ускоряет процесс настройки поиска.
  2. Поиск по сайту с помощью сервисов Яндекс.Поиск и Google Custom Search+ Уже готовые бесплатные продукты с кучей плюшек (морфологический анализ, готовые подсказки, исправление ошибок, учет поисковой статистики и др.). Большое количество инструкций и туториалов, поэтому у вас или ваших специалистов будет меньше вопросов, как настроить поиск по сайту. Ограничения: особенности выбранной cms, дороговизна работы специалистов и трата времени на разработку. У многих cms есть встроенные средства, что немного ускоряет процесс настройки поиска.
  3. Использование других поисковых систем (Sphinx, Apache Solr, Xapian и др.).+ Большой набор функций, которые помогут сделать поиск более удобным. Не каждый хостинг позволит запустить выбранную систему, а цена может быть слишком высокой. Нужны специалисты, разбирающиеся в их настройке.

Какой вариант лучше, решать только вам =) Мы же для начала рекомендуем настроить сервисы от Яндекса или Google, так как они бесплатны и наиболее распространены. Позже, если возникнет необходимость, можно перейти на другие продукты или разработать свой, уже точно зная, какие функции вам нужны.

Заключение

Придерживайтесь данных рекомендаций и поиск на сайте станет надежным инструментом в работе с клиентами. Если же вы еще не определились, нужен ли вашему сайту поиск, то пишите в комментариях, подскажем =).

Если возникли вопросы с настройкой поиска по сайту – обращайтесь в нашу компанию 1ps.ru, поможем с реализацией.

 

Статья была полезной?