Gå til sidens indhold

Vælg et tema

Vælger du ikke et tema, vælger vi et for dig. Du kan efterfølgende skifte tema i footeren.


Komponenter

Søgefelt

Søgefeltet lader brugeren søge efter bestemt indhold på siden eller i løsningen.

Sådan bruges komponenten

Anvendes til

Søgefeltet er en samlet komponent (søgefelt og -knap), der giver brugeren mulighed for at søge efter specifikt indhold, hvis de kender søgeordene eller ikke kan finde indholdet gennem menuer eller anden navigation.

Søgefeltet giver et alternativ til brugere, der af den ene eller anden årsag ikke kan anvende løsningens navigation.

Anvendes ikke til

På meget små løsninger eller løsninger, der kun består af en enkelt side, bør det ikke være nødvendigt med et søgefelt.

Vejledning

Det er vigtigt for brugerne, at kunne se de indtastede søgeord. En god tommelfingerregel er at søgefeltet er 27 karakterer (27ch) langt som minimum.

Sørg for at søgefeltet ligner et søgefelt.

Hvis der anvendes et lup-ikon, skal ”Søg” fremgå i koden, så skærmlæsere kan se funktionen.

Søgefeltet vises i sin helhed på løsningens hjemmeside og ikke kun som et link.

Vis fortsat søgefeltet – også på søgeresultatet, der viser søgeordene.

Brug kun avanceret søgning som valgmulighed. Den primære søgning skal være en standardsøgning for at undgå forvirring omkring dens anvendelse.

Søgeknappen skal være en submit-knap.

Sådan (do)

Eksempel på, hvordan et søgefelt kan se ud

Sådan: Gør søgefeltet mindst 27 tegn bredt, så det kan rumme flere ord uden at skjule dele af brugerens søgestreng (Nielsen, 2002).

Ikke sådan (don't)

Eksempel på, hvordan et søgefelt ikke bør se ud

Ikke sådan: Lav ikke søgefeltet så smalt, at brugerne ikke kan se, hvad de har indtastet. De fleste søgninger indeholder to eller flere ord.

Sådan (do)

Eksempel på, hvordan et søgefelt kan se ud

Sådan: Gør det nemt at finde søgefeltet. Placér det i øverste højre hjørne, hvor brugerne forventer det (Nielsen, 2001). Lad feltet være tomt (Silver, 2018, s. 268) og hvidt (Guy, 2014), så det er tydeligt, at det er et indtastningsfelt.

Ikke sådan (don't)

Eksempel på, hvordan et søgefelt ikke bør se ud

Ikke sådan: Undgå at placere hjælpetekster, labels eller eksempler i søgefelter. I de fleste tilfælde er de helt unødvendige. Hvis der er brug for instruktioner, så placér dem over søgefeltet.

Se komponenten i eksempelløsninger

Sagsoversigt: Find sag

Referencer

Installation

HTML Struktur

Du kan styre søgefeltets bredde via input-width- og input-char- se mere under punktet formular elementer og input bredde og validering.

Du bør som oftest implementere auto-suggest på søgefelter, så brugeren foreslås relevante søge ord/sætninger.

Ordet ”Søg” skal altid fremgå af søgeknappen. Hvis der anvendes et lup-ikon, skal ”søg” fremgå i en aria-label, så skærmlæsere kan se funktionen.

Formularens felt skal have et skjult label af hensyn til skærmlæsere.