Витрина на красиви дизайнерски интерфейси в полето за търсене

Това е нещо общо в интернет, където - ако не успеем да получим това, което търсим на уебсайт, ние прибягваме до търсене. Полето за търсене винаги е било съществена част от уебсайт. Ако използвате уебсайт, съдържащ много съдържание, това е още по-неизбежно. Обикновено те се поставят в следните области: заглавие, горно навигационно меню или странична лента (горната част). Понякога може да хвърлим още един в долния колонтитул, за да направим търсенето по-удобно за потребителите.

Изминахме дълъг път от Web 1.0; търсенето в мрежата вече не е ограничено до въведете ключова дума и натиснете търсене. Разработчиците се стремят да направят търсенето по-добро за своите посетители, като обновят и добавят още функции, казват, филтриране на търсенето, за да получат по-целенасочени резултати, като предоставят ключови думи за търсене или истории на търсене, докато въвеждате.

В днешния пост показваме някои красиви полета за търсене с обещаващи функции, които сме опознали. Независимо дали искате да обновите уебсайта си или просто да търсите вдъхновение за по-добро поле за търсене, този пост е за вас. Пълен списък след скок!

PlaylistNow

Започвайки с префикса „Аз съм“, този модул за търсене се опитва интелигентно да съвпада и да изброява резултатите, съответстващи на заявката ви, докато въвеждате.

Превъртане на модула за търсене

Предложено от дизайнера Nico Nuzzaci, това творческо поле за търсене ви позволява да търсите, като пишете или превъртате в азбучния панел.

TextboxList

Този модул за търсене има комбинация от няколко функции: тя обгръща заявките ви за търсене във формат на етикети и ви позволява да изтриете конкретен маркер за търсене. Той също така идва с автоматично попълване. Изглежда познато? Това е подобно на модула за маркиране в Facebook!

Запомни млякото

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

Автентични работни места

Мисля, че автентичните работни места вече са търсили с мигновени резултати и се изпълняват преди Google.

Kontain

Полето за търсене на Kontain позволява на потребителите да извършват общо търсене или да филтрират резултатите от търсенето само до „актуализации“ или „потребител“.

New York Magazine

Подобно на Kontain, търсенето в NY Magazine позволява по-дълбоко филтриране.

ThemeForest

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

Търсете, сортирайте и филтрирайте

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

Tumblr

Фин и малък модул за търсене на страничната лента!

MenuPages

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

Quotezuki

Търсещ модул веднага след логото, наистина е трудно да го пропуснете.

C Spire Wireless

Голямо поле за търсене на мазнини, което се показва само при задържане на раздела за търсене; друг добър начин да се използва пространството.

Spokeo

Селективно търсене с филтриране направено красиво.

VoucherCodes

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

iStockPhoto

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

TasteBook

Просто търсене, но страхотно поле за търсене.

Grooveshark

Grooveshark ви позволява да слушате и споделяте музика онлайн; първата страница се състои само от поле за търсене, за да търсите търсената музика. Това напълно има смисъл.

Геймърите с работни места

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

Дейвид Торондел

Хубаво тъмно поле за търсене, което се смесва добре с дизайна на сайта.

| Повече ▼

• Създаване на люлеещо се поле за търсене на CSS3 (Hongkiat)
• Проектиране на Свещената кутия за търсене: примери и най-добри практики (Смъкващо списание)
• Красива CSS3 Обучение на формуляр за търсене (Стена на уеб дизайнера)