Ukážka dizajnov UI dizajnu krásneho vyhľadávacieho poľa
Je to typické na internete, kde - ak nedokážeme dostať to, čo hľadáme na webových stránkach, uchýli sa k vyhľadávaniu. Vyhľadávacie pole vždy tvorilo podstatnú časť webovej stránky. Ak spustíte webové stránky s obsahom náročným na obsah, je to ešte viac nevyhnutné. Sú zvyčajne umiestnené v nasledujúcich oblastiach: hlavička, horná navigačná ponuka alebo postranná lišta (horná časť). Niekedy môžeme zahodiť aj ďalší v zápätí, aby sme pre používateľov mohli vyhľadávať pohodlnejšie.
Prišli sme ďaleko od Web 1.0; vyhľadávanie na webe už nie je obmedzené zadajte kľúčové slovo a vyhľadajte vyhľadávanie. Vývojári sa snažia o to, aby vyhľadávajú lepšie skúsenosti pre svojich návštevníkov tým, že upravia a pridávajú ďalšie funkcie, hovoria, že vyhľadávajú filtrovanie, aby získali cielenejšie výsledky, poskytovali kľúčové slová vyhľadávania alebo históriu vyhľadávania,.
V dnešnom príspevku prezentujeme niekoľko krásnych vyhľadávacích políčok so sľubnými funkciami, ktoré sme sa dozvedeli. Či už chcete vylepšiť vaše webové stránky alebo jednoducho hľadáte inšpiráciu pre lepšie vyhľadávacie pole, tento príspevok je pre vás. Úplný zoznam po skoku!
PlaylistNow
Počnúc predponou "Ja som" sa tento vyhľadávací modul pokúša inteligentne zladit a zadať výsledky, ktoré zodpovedajú vášmu dopytu pri písaní.
Posúvajte vyhľadávací modul
Navrhnutá návrhárkou Nico Nuzzaci, toto vyhľadávacie pole umožňuje vyhľadávať zadaním alebo posunutím abecedného panelu.
TextboxList
Tento vyhľadávací modul má kombináciu niekoľkých funkcií: záplaty vyhľadávacích dopytov vo formáte značiek a umožňuje vymazať konkrétnu značku vyhľadávania. Dodáva sa aj s automatickým dokončením. Vyzerá dobre? Je to podobné ako značkovací modul Facebook!
Pamätajte si mlieko
Podobne ako pri vyhľadávaní YouTube, vyhľadávacie pole tu vám okamžite oznámi, či sa niečo zhoduje s vaším výsledkom. Ešte ďalší inteligentný príklad funkcie automatického návrhu.
Autentické úlohy
Myslím, že firmy Authentic Jobs už pred vyhľadávaním Google vyhľadávali okamžité výsledky.
Kontain
Konštanovo vyhľadávacie pole umožňuje používateľom vykonávať všeobecné vyhľadávanie alebo filtrovať výsledky vyhľadávania iba na "aktualizácie" alebo "používateľov".
New York Magazine
Podobne ako v Kontain, vyhľadávanie NY Magazine umožňuje hlbšie filtrovanie.
ThemeForest
Ďalším príkladom filtrovania v module vyhľadávania je pomôcť návštevníkom dostať to, čo chcú, v minimálnom čase.
Vyhľadávanie, triedenie a filtrovanie
Brianovo vyhľadávacie pole vyzerá ako predbežný vyhľadávací modul urobený krásnym spôsobom; prispôsobíte, ako chcete, aby výsledky vyzerali predtým, ako stlačíte tlačidlo vyhľadávania.
tumblr
Jemný a malý vyhľadávací modul na bočnom paneli - čistý!
MenuPages
Ak hľadáte kompletný vyhľadávací modul a priestor je obmedzený, tento prístup môže byť vhodný.
Quotezuki
Vyhľadávací modul hneď za logom, je to naozaj ťažké vynechať.
C Spire Wireless
Veľké vyhľadávacie pole s nízkym obsahom tuku, ktoré sa zobrazuje iba pri podržaní ukazovateľa na karte vyhľadávania. ďalší dobrý spôsob využitia priestoru.
Spokey
Selektívne vyhľadávanie s filtráciou sa skvele robilo.
VoucherCodes
Pri pohľade na svoju podnikateľskú povahu je pravdepodobne najlepší nápad.
iStockPhoto
Podobne ako ostatné weby iStockPhoto ponúka svojim čitateľom obrovské množstvo zdrojov, takže filtrovanie vo vyhľadávaní je rozhodne nevyhnutné.
TasteBook
Jednoducho vyzerajúce, ale skvelé vyhľadávacie pole.
Grooveshark
Grooveshark vám umožňuje počúvať a zdieľať hudbu online; prvá stránka sa skladá z ničoho, ale iba z vyhľadávacieho poľa pre vyhľadávanie požadovanej hudby. Má to úplne zmysel.
Hráči s pracovnými miestami
Pekný príklad úpravy prispôsobeného vyhľadávania Google.
David Torondel
Pekné tmavé vyhľadávacie pole, ktoré dobre spája dizajn lokality.
viac
- Vytvorenie hojdacieho vyhľadávacieho poľa CSS3 (Hongkiat)
- Navrhovanie svätého vyhľadávacieho poľa: Príklady a najlepšie postupy (Smashing Magazine)
- Krásny CSS3 vyhľadávací formulár výučby (Wall Designer Web)