Knapper og links

Få her et overblik over den bedste måde at lave knapper og links på.

Hvilken knap skal jeg vælge?

I har I jeres design mulighed for, at vælge mellem forskellige knapper. For at give et overblik over mulighederne, viser vi dem her med DJ's farver fra hovedsitet. Farverne på knapper og links følger farverne, I har på jeres subsite.

Brugen af knapperne afhænger primært af:

Vigtigheden af linket
Linkets længde
Mængden af links

Vigtigheden af linket

En knap kaldes også en "Call-to-action". Det vil sige, at den er handlingsanvisende. Vi vil gerne lede brugeren hen mod knappen, derfor er den designet på en måde, som påkalder sig mere opmærksomhed end et traditionelt link.

Hvis en bruger ser en "skov" af links, som alle ligner knapper, kan det virke overvældende og svært for brugeren at tage stilling til, hvilket link de skal vælge.

Brug derfor jeres knapper sparsomt, hvis I har en side med mange links. Hvis brugeren bliver præsenteret for syv forskellige knapper, alle med farvet baggrund og på den samme side, vil det være svært at tage en beslutning.

Derfor anbefaler vi, at lave links ud fra disse principper:

Hvis I har mange, relaterede links, anbefaler vi at lave en link liste (læs mere om dette nederst i dette afsnit)
Hvis I har et par enkelte links, som er vigtige, brug da knapper (også kaldet "call-to-action's").
Hvis I sidestiller to eller flere knapper, brug da knapper med det samme udtryk (knap med farvet baggrund eller omrids), medmindre I ønsker at fremhæve én knap over de andre.
Hvis I har et link der har brug for særligt meget opmærksomhed, kan I bruge jeres kraftigste farvede knap, som vist her med DJ's røde:

Bliv medlem af DJ

Lad links stå for sig selv

Forsøg at tage links ud af tekstblokke, da linket vil fremstå mere tydeligt. Se disse to eksempler:

Se eksemplet her, hvor linket er en del af teksten:

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus auctor fringilla. Dette er i forhold til lovgivningen, som du kan læse mere om her. Cras justo odio, dapibus ac facilisis in, egestas eget quam.

Op imod dette eksempel, hvor linket er trukket ud af teksten markeret med en knap og derfor nemmere for brugeren at få øje på:

Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Donec ullamcorper nulla non metus auctor fringilla.

Læs mere om lovgivningen her

Cras justo odio, dapibus ac facilisis in, egestas eget quam.

Linkets længde

Hvis du oplever at skulle lave et langt link, anbefaler vi at bruge et link med pil. Grunden til dette er, at knapper med meget tekst kan risikere at bryde i flere linjer, hvilket især sker på mindre tekstbokse samt i mobil.

Se to eksempler sidestillet her, hvor linket med pil er at foretrække, da der er tale om et langt link på en lille plads: