Полето за търсене е симбиоза между поле за въвеждане и бутон за изпращане. Някой си мислят че търсачката не се нуждае от дизайн, в крайна сметка са просто едно поле и бутон, в крайна сметка са просто два прости елемента. Въпреки това, при сайтовете с много съдържание търсачката е най използваният елемент в сайта. Когато потребителите попаднат на относително сложен сайт, те веднага използват търсачката с мисълта че това е пряк път към дестинацията която искат да достигнат възможно най бързо. Тогава дизайнът на търсачката и нейното използване започва да има значение.

В тази статия ще ви обясня как този елемент може да бъде подобрен така че да спести времето на потребителите и да достигнат целта която искат.

Най добрите практики

1. Използвайте иконка с лупичка.

Често полето за търсене е съпроводено от иконка с лупичка. Иконката по подразбиране представя визуално обект, действие или идея. Има няколко иконки които са силно разпознаваеми от потребителите. Лупичката е една от тях.

Съвет: Използвайте схематизирана иконка, най-опростената версия на лупичка. Само няколко основни детайла означава по малко визуално объркване и по добро разпознаване.

2. Поставяне на полето за търсене на видно място.

Ако търсенето е важна функция за приложението ви, то тогава тя трябва да се постави на видно място, за да може потребителите бързо да я открият.

Важно е да се покаже цялото поле за писане, понеже скритата търсачка зад иконка я прави по трудно забележима и изисква по повече взаимодействие.

3. Използвайте бутон за търсене към полето

Бутонът помага на хората да разберат че се изисква допълнително действие за да се активира търсенето.

Съвети:

  • Размерът на бутона трябва да бъде подходящ, така че потребителите да не им се налага да се целят с мишката. По-голямата площ за кликане я прави по лесно забележима и по лесна за натискане.
  • Позволете на потребителите да използват бутона Ентер за търсене както и бутона. Много потребители имат навика да натискат бутона от клавиатурата за да активират търсенето.

4. Поставете търсачката на всяка страница.

Трябва да предоставите достъп до търсачката на всяка страница понеже понеже ако потребителите не могат да намерят съдържанието което търсят, те ще се опитат да използват търсачката независимо в коя част на сайта са, особено на 404 страницата.

5. Направете търсачката елементарна

Ако правите дизайн на търсачка, уверете се че тя изглежда и работи възможно най лесно и просто. Внимавайте с разширеното търсене. Разширеното търсене може да обърка хората които се опитват да го използват.

6. Поставете търсачката там където потребителите очакват да я намерят.

Не е хубаво когато потребителите се налага да се оглеждат за търсачката понеже не се вижда хубаво и не е лесно да я видят.

Таблицата която виждате по долу е взета от проучване на Даун Шайк и Кейси Ленз: показва очакваната позиция за търсачката на сайта сред 142 участника. Проучва че най удобното място за да я видят потребителите би било горе в ляво или горе в дясно на всяка страница от сайта, където лесно би могла да се открие като се използва често срещания F образен модел на сканиране.

По този начин, поставянето на търсачката горе в дясната или горе в централната зона на вашата структура вие ще сте сигурно че потребителите ще я открият точно там където очакват да бъде.

Съвети:

  • В най-добрият случай полето за търсене трябва да съвпада с цялостната визия на сайта като се откроява леко за да могат потребителите да я открият когато имат нужда от нея.
  • Колкото повече съдържание имаш на твоя сайт, на толкова по видно място трябва да поставите търсачката. Ако търсенето е от съществено значение за сайта ви, направете я да се откроява визуално повече търсачката – повече контраст така ме полето и иконката да изпъкнат от фона.

7. Подходящ размер на формата.

Да направите полето за въвеждане прекалено късо е най-често срещаната грешка при много дизайнери. Разбира се потребителите могат да въвеждат дълги заявки, но само част от текста ще бъде видима на един път което е знак за лоша използваемост, докато накрая стане трудно за потребителите да проверят или редактират техните търсения. Факт е, че когато потребителите имат ограничение във видимите символи те използват по кратки заявки ( и обикновено по малко ефективни ) защото дългите ще бъдат трудни за четене. Ако размерът на полето е съобразен с очакваното въведено съдържание, тогава ще е по лесно да го прочетат и интерпретират.

Основното правило е да имате 27 символа поле за въвеждане което ще побере 90% от заявките.

Съвет: Обмислете възможността за използване на уголемяващо се поле за търсене, което поле ще се увеличава при фокус за писане. Това спестява пространство и все пак ще даде добър визуален сигнал за бързо намиране и изпълнение на търсенето.

.8 Използване на механизъм за автоматично въвеждане

Типично за потребителите е да са много слаби във формулирането на заявки: ако не получат желания резултат от първия път биха могли да се откажат. Механизъм за автоматично въвеждане би могъл да им помогне в образуването на по-добри заявки.

Автоматичното въвеждане помага на потребителите да въведат правилната заявка като прави предположения на въведените символи. Това не се прави с цел ускоряване процеса на търсене, а вместо това да насочва потребителите и да им помага да конструират техните заявки за търсене. Понеже потребителите имат навика да търсят едно и също нещо повече от веднъж, не е лошо да се помисли и за история на търсенето.

  • Използвайте механизъм за автоматично подсказване ако е възможно, след като са въведени 3 символа. Чрез това вие спестявате усилията на потребителите да въвеждат допълнителна информация.
  • Не заливайте потребителите с прекалено много предложения. Показването на лист с не повече от 10 резултата без скролер е напълно достатъчно.
  • Позволете използването на клавиатурата за навигиране между резултатите. След като потребителите за прегледали веднъж листа до край трябва автоматично да се върнат в началото. Чрез натискането на бутона ESC трябва да може листа да се затвори.
  • Трябва да има ясна разлика между въведената информация и предложената. Примерно гугъл използва различен стил на шрифта – въведената информация от потребителя е с нормален шрифт а предложената е болдната.

9. Нека да е ясно какво търсят потребителите

Добра идея е да включите примерно съдържание за търсене в полето като плейсхолдър за да посткаже какво потребителите могат да търсят. Ако потребителите могат да търсят по няколко критерии, може да ги предоставите както в примера на IMDB по долу. HTML5 прави лесно добавянето на плейсходлър текст в текстовото поле.

Съвет: Опитайте се да синтезирате подсказките до няколко думи които да подскажат ключовите категории за търсене.

Заключение

Търсачката е неразделна част от сайтовете и приложенията с голямо съдържание. Доброто преживяване при търсене означава добро потребителско преживяване като цяло. Дори минимални промени като размера на търсачката може да подобри визията и и да увеличи използването и.