Vælg et tema
Vælger du ikke et tema, vælger vi et for dig. Du kan efterfølgende skifte tema i footeren.
Header
- Standard header
- Standard header med navigation
- Kompleks header med alle rækker
- Header med større logo og brugeroplysninger
Headeren identificerer portalen, den ansvarlig myndighed og brugeren, der er logget ind med NemLog-in. Den fungerer også til navigation og overordnet styring af selvbetjeningsløsningen.
Retningslinjer
Anvendes til
Brug headeren til at give brugeren et “ankerpunkt”, der er ens på tværs af trin og undersider i selvbetjeningsløsningen.
Brug headeren til at kommunikere portal, NemLog-in-oplysninger, ansvarlig myndighed, evt. med kontaktoplysninger.
En eventuel overordnet navigation (topnavigation) skal også placeres i headeren, så brugeren altid kan navigere rundt i selvbetjeningsløsningen.
Anvendes ikke til
Anvend ikke headeren andre steder i løsningen end i toppen af siden.
Brug ikke topnavigationen som faneblade, anvend da faneblade.
Vejledning
Tag et kig på eksempelløsningerne, for at se hvordan komponenten passer ind i en komplet løsning.
En header består af et antal rækker med forskelligt indhold. Jo flere rækker jo mere kompleks en header. Designsystemet giver mulighed for op til 5 rækker og minimum 2 rækker.
- Række 1 og 2 er obligatoriske
- Række 3 til 5 er valgfri
Når du laver en header, bør du følge disse principper:
- Jo enklere navigationen er, desto bedre for brugeren.
- Brug kun række 3, 4, 5, med knapper, links og ekstra navigation, når det er absolut nødvendigt.
- Hold altid rækkefølgen, uanset kombinationen
Headerens rækker forklaret
Række 1 (obligatorisk)
Portal-logo, NemLog-in-oplysninger og ”Log af” knap.
Række 2 (obligatorisk)
Selvbetjeningens navn (løsningstitel), ansvarshavende myndighed og eventuelt support/kontakt oplysninger.
Række 3 (frivillig)
Navigation (topnavigation) i løsningen, eventuelt knapper, eventuelt ekstramenu.
Række 4 (frivillig)
Flere sorteringsmuligheder, eventuelt ekstramenu, eventuelt knapper.
Række 5 (frivillig)
Funktionslinks (igangsætter system- eller OS-funktionalitet, fx gem, print osv.)
En header med fem rækker er meget tilpasningsvenlig og gør det muligt at servicere både simple og komplekse løsninger. Den er også kompleks at anvende for brugerne. Du bør derfor udgangspunkt anvende færre end fem rækker i din header.
Se komponenten i eksempelløsninger
Se komponenten i forskellige eksempelløsninger
Referencer
Web Accessibility Tutorials: Headers