Kauniit hakukentän käyttöliittymän mallit
Se on yleistä Internetissä, jossa - jos emme saa sitä, mitä etsimme verkkosivuilla, haemme hakua. Hakukenttä on aina ollut olennainen osa verkkosivustoa. Jos käytät sisältöä vaativaa sivustoa, se on jopa väistämätöntä. Ne sijoitetaan yleensä seuraaviin alueisiin: otsikko, ylävalikkovalikko tai sivupalkki (ylempi). Joskus voimme myös heittää toisen alatunnisteen, jotta etsintä olisi helpompaa käyttäjille.
Tulimme pitkälle Web 1.0: n jälkeen. haku verkossa ei ole enää rajoitettu anna avainsana ja osoita hakua. Kehittäjät pyrkivät tekemään kävijöille parempaa kokemusta etsimällä ja lisäämällä lisää toimintoja, sanoo, etsivät suodatusta, jotta saat enemmän kohdennettuja tuloksia, tarjoamalla hakusanoja tai hakuhistoriaasi kirjoittaessasi.
Tämän päivän postissa esitellään joitakin kauniita hakukenttiä, joissa on lupaavia ominaisuuksia. Haluatko muokata sivustosi tai yksinkertaisesti hakea inspiraatiota parempaan hakukenttään, tämä viesti on sinua varten. Täysi lista hyppyjen jälkeen!
PlaylistNow
Tämä hakumoduuli yrittää älykkäästi vastata ja luetella kyselyyn vastaavat tulokset, kun kirjoitat.
Selaa hakumoduulia
Suunnittelijan Nico Nuzzacin ehdottama mainoshaun avulla voit etsiä kirjoittamalla tai vierittämällä aakkosjärjestystä.
TextboxList
Tässä hakumoduulissa on muutamia toimintoja: se pakkaa hakukyselysi tunnisteiden muotoon ja voit poistaa tietyn hakumerkin. Siinä on myös automaattinen täydennys. Näyttää tutulta? Se on samanlainen kuin Facebook-tunnistusmoduuli!
Muista maito
Samoin kuin YouTube-haku, tässä hakukentässä kerrotaan heti, jos jotain vastaa tulosta. Vielä yksi älykäs esimerkki automaattisesta ehdotuksesta.
Authentic Jobs
Mielestäni autenttiset työt olivat jo etsineet pikaviestituloksia ja käynnissä ennen Googlea.
Kontain
Kontainin hakukentän avulla käyttäjät voivat tehdä yleisen haun tai suodattaa hakutulokset vain "päivityksiin" tai "käyttäjään".
New York Magazine
Samoin kuin Kontain, NY-lehden haku mahdollistaa syvemmän suodatuksen.
ThemeForest
Vielä yksi esimerkki hakumoduulin suodatuksesta, joka auttaa kävijöitä saamaan mitä he haluavat mahdollisimman vähän aikaa.
Etsi, lajittele ja suodata
Brianin hakukenttä näyttää hyvältä etukäteen etsintämoduulilta; voit muokata, miten haluat tulosten näyttää ennen hakupainiketta.
Tumblr
Hieno ja pieni hakumoduuli sivupalkissa - siisti!
MenuPages
Jos etsit täydellistä hakumoduulia ja vielä tilaa on rajoitus, tämä lähestymistapa voi olla kätevä.
Quotezuki
Etsi moduuli heti logon jälkeen, se on todella vaikea jäädä.
C Spire Wireless
Suuri rasvaa hakukenttä, joka tulee näkyviin vain, kun etsit haun välilehteä; toinen hyvä tapa käyttää tilaa.
Spokeo
Valikoiva haku suodatuksella, joka on tehty kauniisti.
VoucherCodes
Tarkasteltaessa sen liiketoimintaa luultavasti paras ajatus on hakukentän ylemmän ylimmän ja oikean keskipisteen piilottaminen.
iStockPhoto
Muiden sivustojen tapaan iStockPhoto tarjoaa valtavan määrän resursseja lukijoilleen, joten suodattaminen haussa on ehdottomasti välttämätöntä.
TasteBook
Yksinkertainen näköinen vielä mahtava hakukenttä.
Grooveshark
Groovesharkin avulla voit kuunnella ja jakaa musiikkia verkossa; ensimmäinen sivu sisältää vain hakukentän, jolla voit etsiä haluamaasi musiikkia. Se on täysin järkevää.
Pelaajat, joilla on työpaikkoja
Hyvä esimerkki siitä, miten Google Custom Search on mukautettu.
David Torondel
Mukava tumma hakukenttä, joka sopii hyvin yhteen sivuston suunnittelun kanssa.
Lisää
- Rocking CSS3 -hakukentän luominen (Hongkiat)
- Pyhän hakukentän suunnittelu: esimerkkejä ja parhaita käytäntöjä (Smashing Magazine)
- Kaunis CSS3-hakulomake (Web-suunnittelijaseinä)
