Showcase de design UI de design frumos caseta de căutare

Este un lucru obișnuit pe Internet unde, dacă nu reușim să obținem ceea ce căutăm pe un site web, recurgem la căutare. Caseta de căutare a fost întotdeauna o parte esențială a unui site Web. Dacă rulați un site web cu conținut intensiv, este și mai inevitabil. Acestea sunt de obicei plasate în următoarele zone: antetul, meniul de navigare de top sau bara laterală (în partea superioară). Uneori, este posibil să aruncăm și altul în subsol pentru a face căutarea mai convenabilă pentru utilizatori.

Am parcurs un drum lung de la Web 1.0; căutarea pe web nu mai este limitată la introduceți cuvântul cheie și căutați căutare. Dezvoltatorii se străduiesc să facă căutarea unei experiențe mai bune pentru vizitatorii lor prin revizuirea și adăugarea mai multor funcții, spun că filtrarea căutării pentru a obține rezultate mai bine direcționate, furnizând cuvinte cheie de căutare sau istorii de căutare pe măsură ce tastați.

În postul de astăzi, prezentăm câteva cutii frumoase de căutare cu funcții promițătoare pe care le-am cunoscut. Fie că sunteți în căutarea de a revigora site-ul dvs. sau pur și simplu căutați inspirație pentru o cutie de căutare mai bună, această postare este pentru dvs. Lista completă după salt!

PlaylistNow

Începând cu prefixul "Eu sunt", acest modul de căutare încearcă să se potrivească inteligent și să listați rezultatele potrivite interogării pe măsură ce tastați.

Derulați modulul de căutare

Sugerat de designerul Nico Nuzzaci, această casetă de căutare creativă vă permite să căutați tastând sau derulând panoul alfabetic.

TextboxList

Acest modul de căutare are o combinație de câteva funcții: acesta îți împachetează interogările de căutare în format de etichete și vă permite să ștergeți o anumită etichetă de căutare. De asemenea, vine cu auto-completare. Arata familiar? Este similar modulului de etichetare Facebook!

Amintiți-vă Laptele

Ca și în cazul căutării pe YouTube, caseta de căutare vă informează instantaneu dacă se potrivește rezultatul dvs. Un alt exemplu inteligent de caracteristică de auto-sugestie.

Locuri de muncă autentice

Cred că Locuri de muncă Autentice au avut deja căutarea lor cu rezultate instant și în desfășurare înainte de Google.

Kontain

Căsuța de căutare Kontain permite utilizatorilor să efectueze o căutare generală sau să filtreze rezultatele căutării numai la "actualizări" sau "utilizatori".

Revista din New York

Similar căutării Kontain, căutarea de la NY Magazine permite o filtrare mai profundă.

ThemeForest

Un alt exemplu de filtrare în modulul de căutare pentru a ajuta vizitatorii să obțină ceea ce doresc în timp minim.

Căutați, Sortați și filtrați

Caseta de căutare a lui Brian arată ca un modul de căutare avansată făcut într-un mod frumos; personalizați modul în care doriți ca rezultatele să pară înainte de a atinge butonul de căutare.

Tumblr

Modul de căutare subtil și mic pe bara laterală - îngrijit!

MenuPages

Dacă sunteți în căutarea unui modul complet de căutare și totuși spațiul este o constrângere, această abordare poate fi utilă.

Quotezuki

Modul de căutare imediat după siglă, este foarte greu să pierdeți.

C Spire Wireless

O casetă de căutare cu conținut mare de grăsimi care apare doar după ce treceți deasupra butonului de căutare; o altă modalitate bună de a folosi spațiul.

Spokeo

Căutarea selectivă cu filtrarea este făcută frumos.

VoucherCodes

Privind la natura sa de afaceri, smacking caseta de căutare superioară și dreapta în centru este probabil cea mai bună idee.

iStockPhoto

Similar cu alte site-uri, iStockPhoto oferă o sumă masivă de resurse pentru cititorii săi, deci filtrarea în căutarea este cu siguranță esențială.

TasteBook

Cutie de căutare simplă, dar minunată.

Grooveshark

Grooveshark vă permite să ascultați și să partajați muzică online; prima pagină este compusă din nimic, dar doar o casetă de căutare pentru ca dvs. să căutați muzica dorită. Are sens.

Jucătorii cu locuri de muncă

Un exemplu bun despre modul în care este personalizată Căutarea particularizată Google.

David Torondel

Cutie de căutare întunecată, care se potrivește bine cu design-ul site-ului.

Mai Mult

Crearea unei casete de căutare Rocking CSS3 (Hongkiat)
Proiectarea căsuței de căutare: exemple și bune practici (Smashing Magazine)
Frumos CSS3 formular de căutare Tutorial (Web Designer Wall)