Поиск не срабатывает по нажатию на клавишу Enter

Критичность проблемы: Средняя | Сложность внедрения: Средняя | Встречаемость: Средняя

Захожу в интернет-магазин. В шапке — крупное поле. Пишу «кроссовки». Жму Enter. Тишина. Курсор мигает. Результатов нет. Кнопка «Найти» рядом есть, но рука сама тянется к клавише. Привычка сильнее.

Пробую ещё раз. Вбиваю «Nike Air». Выпадают подсказки. Стрелками выбираю первую. Жму Enter. Подсказка закрывается, но поиска всё равно нет. Сайт как будто делает вид, что ничего не произошло.

Перехожу в каталог, пытаюсь в фильтрах. Там та же история: поле живёт отдельно от клавиатуры. Enter будто не существует. Зато клик по иконке лупы — пожалуйста, работает. Но это лишнее действие, и я его не хочу делать. Я уже ввёл запрос.

На мобильном ещё интереснее. На клавиатуре «Поиск», жму — и снова пусто. Фокус слетает, экран подпрыгивает, но результатов нет. Если тапнуть по «Найти», всё ок. Я чувствую себя обманутым: интерфейс даёт сигнал «жми тут», я жму — и ничего.

Меняю браузеры. В Chrome чаще не работает, в Safari на десктопе иногда срабатывает, но не всегда. В одном и том же поле то выходит, то нет. В модальном окне — мимо, на странице результатов — тоже мимо. Ловлю странность: если поле пустое, Enter перезагружает страницу. Если вбить текст — не делает ничего.

Ещё деталь. Когда вводишь быстро, подсказки мигают. Нажимаешь Enter в момент, когда список меняется, — сайт зависает на долю секунды и проигнорирует нажатие. Второй Enter иногда помогает, но уже поздно: мысль прервалась.

Поведение сбивает ритм. В голове — прозрачная модель: написал, Enter, получил. На сайте — другая. Я не знаю, чего ожидать. Инструмент, который должен ускорять, тормозит. И в какой-то момент я просто перестаю пытаться.

Где проблема критична, а где нет

Критично:

• Интернет-магазины, маркетплейсы, каталоги B2B, доски объявлений, travel и билеты, карьеры и вакансии, базы знаний и документация — когда поиск главный сценарий входа к товару/карте/статье.
• Сайты, где посетители приходят с точным намерением и длинными хвостами запросов (SKU, артикулы, сочетания характеристик).
• Мобильный трафик и повторные пользователи, которые привыкли жать Enter/Go.
• Любые проекты, где значимая доля сессий начинается с поиска или зависит от него в первой минуте.

Малокритично или некритично:

• Лендинги с одной целевой кнопкой, микросайты и промо без каталога.
• Корпоративные визитки с 5–10 страницами, где меню решает всё.
• Медиа с акцентом на ленту и рекомендации, где поиск вторичен.
• Внутренние админки, где действие по кнопке «Найти» очевидно и привычно, и пользователи обучены клику.

Что об этом говорят другие пользователи

Опишите шаг за шагом, что вы делали в поиске (страница, запрос, подсказки, нажатие клавиш), что ожидали увидеть после Enter и что увидели на самом деле, на каком устройстве и в каком браузере это произошло.

Бесполезные ответы

• Нажал Enter, ничего не понял, закрываю.
• Браузер новый, телефон старый, может, из-за этого.
• Сайт в целом красивый, лупа классная.

Полезные ответы

• Ввёл «планшет самсунг», нажал Go на клавиатуре. Поле потеряло фокус, результатов нет. Если жму на иконку лупы — результаты появляются.
• Поле в шапке. При открытых подсказках Enter выбирает подсказку, но поиск не стартует. Нужно жать Enter второй раз или кликать кнопку.
• Запрос «платье синее xs». Нажимаю Enter — страница слегка прокручивается вверх, поиск не запускается. Кнопка «Найти» срабатывает.
• В модальном окне поиска Enter закрывает модалку, результатов нет. Через кнопку — работает.
• Если быстро набрать и сразу Enter, ничего не происходит. Если подождать секунду и нажать — работает.

Решение проблемы

• Сделайте поиск формой. Оберните поле и кнопку в form с GET на страницу результатов. У поля name=q и type=search. Кнопке задайте type=submit. Так Enter начнёт работать нативно.
• Уберите лишние запреты. Проверьте обработчики keydown/keypress/keyup и onsubmit. Удалите preventDefault и stopPropagation там, где они не нужны. Ошибки в консоли исправьте.
• SPA — отправляйте форму правильно. На onsubmit заберите значение, предотвратите перезагрузку и вызовите переход маршрутизатором. Для программной отправки используйте form.requestSubmit(), а не клик по кнопке.
• Учтите подсказки. Если список подсказок открыт и есть выделенный пункт — Enter выбирает его. Если нет — отправляет форму. Не требуйте двойного Enter.
• Не мешайте вводу. Игнорируйте Enter во время ввода с IME (compositionstart/compositionend). Не вешайте обработчики на document, если можно на поле.
• Дайте явную кнопку. Кнопка «Найти» видима и доступна. Это поддержка для тех, кто не жмёт Enter.
• Позаботьтесь о мобильных. Укажите inputmode=search и enterkeyhint=search. Проверьте Safari iOS и Chrome Android. Уберите автоскролл и потерю фокуса при отправке.
• Валидация без сюрпризов. Не отправляйте пустые запросы. Триммируйте пробелы. Сообщайте, если запрос слишком короткий.
• Сохраняйте контекст. После отправки оставляйте запрос в поле и показывайте результаты по нему. Фокус переводите на список результатов для клавиатуры и скринридеров.
• Защитите от дублей. Блокируйте повторный сабмит до ответа. Показывайте индикатор загрузки.
• Пройдите чек-лист. Шапка, модалка, результаты, мобильный. Chrome, Safari, Firefox, Edge. Enter, Go, нажатие кнопки, подсказки открыты/закрыты. Быстрый ввод и мгновенный Enter.
• Замерьте. Запишите события: отправка по Enter, по кнопке, ошибка, отмена. Смотрите, где ломается чаще.

Гипотезы для роста конверсии

• Если включить нативный сабмит формы по Enter и Go на мобильной клавиатуре, то конверсия в просмотр результатов поиска может увеличиться за счёт уменьшения лишних действий.
• Если при открытых подсказках Enter будет выбирать подсказку, а при закрытых — запускать поиск, то конверсия из поиска в карточки товаров может увеличиться за счёт ускорения выбора.
• Если сделать кнопку «Найти» всегда видимой и кликабельной рядом с полем, то конверсия в запуск поиска может увеличиться за счёт очевидного альтернативного действия.
• Если сохранять запрос в поле и URL после отправки, то конверсия в дальнейшие фильтры и уточнения может увеличиться за счёт того, что пользователю не нужно вводить заново.
• Если на мобильных указать enterkeyhint=search и увеличить зону нажатия кнопки «Найти», то конверсия в успешный сабмит поиска может увеличиться за счёт уменьшения промахов и ошибок ввода.