7 parimat tava otsingukasti kujundamisel ja paigutusel

0

Otsingukast on veebisaidi üks olulisemaid elemente. Olenemata sellest, mis tüüpi ettevõte teil on, on hästi kujundatud otsingukasti olemasolu väga oluline, et külastajad leiaksid otsitava hõlpsalt üles. See ei tähenda, et piisab lihtsalt otsingufunktsiooni lisamisest, isegi mõtlemata, kuidas see välja näeb.

Peate arvestama otsingukasti funktsionaalsuse, kasutajasõbralikkuse, esteetika ja isegi paigutusega. Seda kõike selleks, et saaksite oma veebisaidil kasutajakogemust parandada, mis võib isegi kaasa tuua suurema konversioonide arvu.

Mida peate otsingukasti kujundamisel tegema? Kuigi täpsed soovitused võivad teie vajadustest ja eesmärkidest lähtuvalt olla subjektiivsed, on mõned üldised näpunäited, mis võiksid toimida erinevat tüüpi veebisaitide puhul. Siin on mõned parimad tavad otsingukasti kujunduse ja paigutuse kohta.

1 Muutke see silmapaistvaks

Otsingukasti kujundamise esimene ja kõige olulisem reegel on muuta see kergesti märgatavaks. Kui loote otsingukasti, mis sulandub ülejäänud veebisaidiga, võite olla liiga keskendunud disaini esteetikale. Kuid on oluline meeles pidada, et lisate otsingukasti inimestele, kes soovivad teie veebisaidilt midagi leida. Otsingukasti otsimine ei ole mõttekas ja võib isegi negatiivselt mõjutada nende kogemust.

See ei tähenda, et peate esteetika osas täielikult järeleandmisi tegema. Töötage välja kujundus, mis näeb hea välja teie olemasoleva veebisaidi kujunduse taustal, jäädes samas piisavalt silmapaistvaks, et inimesed seda märkaksid. Seega peaks kast olema suur, kuid mitte liiga suur, et see võtaks lehel liiga palju ruumi. Ja värv peaks olema kontrastne, kuid siiski täiendama ülejäänud lehel kasutatavaid värve.

Parima ostu otsingukast on hea näide, kuna valge kontrastsus lehe sinisega, samal ajal joondudes teiste lehekujunduses kasutatud värvidega. Otsingukasti suurus ei ole liiga suur, kuid on siiski piisavalt silmapaistev, et inimesed seda kohe lehele sisenedes märkaksid.

2 Tõstke esile nupp Esita

Nagu varem mainitud, on otsingukasti kogu eesmärk saidi külastajate jaoks lihtsamaks muuta. Vältige asjade ülekeerutamist väikeste esitamisnuppudega, millele kasutajad peavad klõpsamiseks keskenduma. Esitamisnupu esiletõstmine parandab otsingukasti enda nähtavust ja hõlbustab ka sellel klõpsamist.

See, kas kasutate suurendusklaasi ikooni või kirjutate saatmisnupul sõna „Esita", on teie otsustada. Keskenduge siiski nupu suurusele ja värvile, et kasutajatel ei tekiks probleeme selle leidmisega pärast nupu sisestamist. Tehke neile pärast otsitava teksti sisestamist selgeks, mida nad peavad tegema.

Mõned veebisaidid lähevad isegi nii kaugele, et panevad külastajatele midagi otsima ainult suurendusklaasi ikooni. See võib osutuda veebisaidi esteetika jaoks suureks kasuks, nagu Levi’s Straussi puhul. Kuid see pole optimaalse otsingukasti kujunduse näide.

Kuigi see näeb disaini poolest hea välja, võib see külastajatele ebamugavaks osutuda, kuna pärast luubi ikoonil klõpsamist peavad nad ootama, kuni otsingukast laaditakse. See võib olla masendav, eriti kui sisenete saidile kohast, kus ühendus on aeglane. Selle eraldi laadimise asemel võib olla parem lasta otsingukastil laieneda samasse kohta, kuhu on asetatud luup.

Kui ruum on piiratud, kuid otsing on oluline, võib olla tore, kui see sulandub ülemisse navigeerimismenüüsse. Täpselt seda tegi shralpin oma mobiilisaidil.

Xero Shoes seevastu ei ole esitamisnuppu üldse. Külastajad peavad saidil midagi otsimiseks sisestama esitatud otsingusse märksõna ja seejärel vajutama sisestusklahvi. Nüüd võite arvata, et polegi nii halb vajutada otsingu alustamiseks lihtsalt sisestusklahvi, aga kuidas on lood ülejäänud külastajatega? Mõned neist võivad otsida spetsiaalselt esitamisnuppu ja neil võib olla raske seda tüüpi kujundust kasutades otsingut läbi viia.

Amazoni saatmisnupp on üsna silmatorkav oranžiga, samas kui ülejäänud otsingukast on valge. Esitamisnupu värv on kontrastiks ka veebisaidi päise tumedama värviga. Ehkki nad kasutavad saatmisnupuna ainult suurendusklaasi ikooni, on see erinevalt Levi näitest siiski selgelt nähtav. Veenduge, et ikoon oleks polsterdatud, kuna see suurendab nähtavust.

3 Asetage see kohta, kuhu kasutajad kõige tõenäolisemalt vaatavad

Käimas on arutelu selle üle, milline on parim koht otsingukasti veebisaidile paigutamiseks. Kui aga vaatate ringi mõnel kõige populaarsemal veebisaidil, märkate, et otsingukastid on sageli paigutatud lehe ülaserva keskele või paremasse ülaossa. See ilmneb SLI Systemsi avaldatud uuringust. Analüüsist selgus, et 54% jaemüüjatest paigutavad otsingukasti paremasse ülaossa, 30% keskele ja ainult 16% vasakule.

See tähendab, et külastajad võivad eeldada, et leiavad otsingukasti teie veebisaidi paremas ülanurgas. Selle paigutamine ootamatusse kohta tähendab, et kasutajad peavad otsingukasti leidmiseks rohkem pingutama. Sellest hoolimata on siiski hea mõte uurida külastajate tegevust soojuskaardi või pilgujälgimise tööriista abil. See aitab teil tuvastada, kuhu nad kõige tõenäolisemalt otsivad, ja mõista, kuhu peaksite oma saidil otsingukasti paigutama.

Olenemata sellest, kas valite vasakule, paremale või keskele; veenduge, et see asuks lehe ülaosas, kuna NN Groupi pilgujälgimise uuringu kohaselt on see koht, kus külastajad tõenäoliselt kõigepealt skannivad. Teil oleks hea teha A/B-test erinevatel otsingukasti paigutustel ja seejärel teha kindlaks milline positsioon näib teie jaoks kõige paremini toimivat.

Siin on näide Get Plus Followersi lehe paremasse serva paigutatud otsingukastist.

EBay otsingukasti paigutus on lehe keskel, kus see on hästi nähtav ja üks esimesi asju, mida külastajad veebisaidi juures märkavad.

4 Ühendage automaatne lõpetamine graafikaga

Teie veebisait võib olla nende 62,5% hulgas, kes kasutavad oma otsingukastis automaatse täitmise funktsiooni. Konkurentsieelise saamiseks võite seda funktsiooni veelgi täiustada, lisades oma otsingufunktsiooni toote piltide eelvaateid koos automaatse täitmise soovitustega. Seda seetõttu, et ainult 28,2% osalevatest veebisaitidest rakendab seda funktsiooni praegu.

Graafika automaatse täiendamise tagamiseks võiksite vaadata LED Huti korpust. Pärast piltide eelvaadete lisamist automaatse täitmise soovitustele suutis LED-valgustuse pakkuja suurendada otsingu konversioonimäära 200%. Kui lisate otsingusoovitusse pildi eelvaateid, näeb see välja järgmiselt.

5 Vältige otsingukasti eraldamist või ülerahvastatust

Esimeses punktis mainiti, kui oluline on otsingukasti silmapaistvaks teha. See tähendab, et peaksite vältima ümbritsevate alade ülerahvastamist ikoonide või muude elementidega, mis võivad külastajate tähelepanu otsingukastilt kõrvale juhtida. Otsingukasti tuleb prioritiseerida ja sellele keskenduda. Samal ajal vältige sellega liialdamist, kuna võite otsingukasti niivõrd isoleerida, et seda on raske leida.

Lumi ja kivi otsingukast on hea näide hästi kujundatud otsingukastist. Nagu näete alloleval pildil, ei ole selle asukohas liiga palju elemente. Kuid näete seda siiski lehe keskel vasakus servas ja see pole paigutatud kohta, kus kasutajatel on raske leida. Esitamisnupp on ka kontrastne ülejäänud veebisaidi värvidega, muutes selle silmapaistvaks.

6 Valige laienev otsingukast

Kui otsite võimalusi ruumi säästmiseks, muutes otsingukasti kasutajate jaoks silmapaistvaks, võite valida kasvava otsingukasti. See on ideaalne valik veebisaitidele, kus otsing ei pruugi olla liiga oluline, kuid soovite siiski anda kasutajatele võimaluse midagi otsida. Selle asemel, et lisada ainult suurendusklaasi ikooni, lisate selle kõrvale väikese otsingukasti, mis toimib saidi külastajatele visuaalse vihjena. Kui kasutaja klõpsab väljal, siis kast laieneb ja võimaldab kasutajatel sisestada vajaliku termini.

Siin on hea näide Net-a-Porterist. Kui vaatate veebisaidi paremat ülaosa, näete, et otsingukast on nähtav, kuid mitte liiga suur. Seal on suurendusklaasi ikoon, mis võimaldab kasutajatel tuvastada, et tegemist on otsinguvalikuga.

Kui aga väljal klõpsate, laieneb otsingukast vajaliku otsingusõna sisestamiseks. See esteetika ja kasutatavuse kombinatsioon sobib suurepäraselt veebisaidile, mis peab sisaldama avalehel palju elemente, kuna see aitab säästa ruumi ilma otsingukasti nähtavust kahjustamata.

7 Kaaluge rippmenüü lisamist

Otsingukast on olemas inimestele, kellel on juba aimu, mida nad otsivad. Aga kuidas on lood nendega, kes pole liiga kindlad, mida nad otsivad. Teil võib olla soovituste automaatse täitmise funktsioon, kuid mõne veebisaidi puhul võib olla hea mõte lisada rippmenüü funktsioon otse otsingukasti kõrvale. See annab kasutajatele suunataju ja annab vihjeid selle kohta, mida otsida.

See taktika osutus Brasiilias asuva kinnisvarafirma Casa Mineira jaoks edukaks. Veebisaidil läbi viidud juhtumiuuringus aitas tavalise otsingukasti asendamine rippmenüüdega luua rohkem müügivihjeid. Tegelikult andis variatsioon 57,25% rohkem müügivihjeid kui varem.

Põhjus, miks see variatsioon nii hästi toimis, on see, et külastajatele anti selge tegevussuund ja nad suutsid otsitava kiiresti leida. Eelmises kujunduses pidid külastajad olema kindlad, mida nad täpselt otsivad. Et külastajaid paremini juhendada, otsustasid nad katta väga erinevaid asukohti ja majutusvõimalusi.

Kuid on oluline meeles pidada, et see valik ei pruugi olla parim igat tüüpi veebisaitide jaoks. Näiteks e-pood ei pruugi seda tehnikat kasutades muuta otsingut külastajate jaoks funktsionaalsemaks. Kuid kinnisvaraettevõtete ja teenustega seotud ettevõtete jaoks võib rippmenüüst otsimise funktsioon olla ideaalne lahendus.

Alumine joon

Nüüd saate näidete ja näpunäidete abil paremini mõista otsingukasti kujundust ja paigutust. Mida sa sellest õppisid? Võib-olla olete märganud otsingukasti silmapaistvusele ja nähtavusele pandud rõhku. See tähendab, et värvikontrast, esteetika ja otsingukasti suurus on ühed kõige olulisemad aspektid.

Peaksite keskenduma funktsionaalsusele ja esteetikale, mida ei pruugi olla lihtne teostada. Parim nõuanne, mida saate, on viia läbi A/B-testid erinevatel kujundustel ja positsioonidel, nagu eelmistes punktides mainitud. Kas teil on otsingukasti kujunduse kohta küsimusi? Jäta julgelt alla kommentaar.

: instantshift.com

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More