Dekoratøren
Om dekoratøren
Kort oppsummert er dekoratøren toppen og bunnen av nav.no, dvs logoen, menyen, innloggingsknappen, søkefunksjonen og alle lenkene i det blå feltet i bunnen av siden.
Målet med dekoratøren er å gi brukeren en helhetlig opplevelse på nav.no. Nav.no består av mange individuelle applikasjoner og tjenester som eies av mange forskjellige team. For innbyggerne er det derimot viktig at nav.no oppleves som én side hvor det er lett å kjenne seg igjen, enten man skal finne informasjon om AAP, sende inn meldekort eller søke om svangerskapspenger.
Vi har en egen Slack-kanal for dekoratøren. Den finner du på #dekoratøren_på_navno. Her poster vi nyheter om endringer og oppdateringer som gjøres. I tillegg fungerer den som en support-kanal for alle som har spørsmål eller trenger hjelp.
Hvorfor er det en fordel for team å bruke dekoratøren?
Når team bruker dekoratøren slipper de å vedlikeholde ting som søk, menyer og innlogging – det får de automatisk. Dessuten inneholder dekoratøren også en rekke hjelpefunksjoner som gjør at teamene slipper å lage alt dette selv. Eksempler på slike funksjoner er utloggingsvarsel, samtykkebanner («cookie-banner»), analyse og språkvelger.
Hvordan ta i bruk dekoratøren
Team som vil ta i bruk dekoratøren, kan besøke https://github.com/navikt/nav-dekoratoren og finne teknisk dokumentasjon og forklaring på hvordan de kommer i gang. Denne artikkelen fokuserer på den overordnede intensjonen med dekoratøren og hvordan den hjelper med å skape ett enhetlig nav.no.
Slik er dekoratøren bygget
Rent teknisk er dekoratøren en egen applikasjon. Det kan du se hvis du besøker www.nav.no/dekoratoren. Når teamene bruker dekoratøren, hentes alle delene som JavaScript-kode, html og stilsett fra denne applikasjonen. Det betyr at alle team alltid vil ha en oppdatert versjon av dekoratøren. Hver gang vi i Team nav.no gjør en endring, legger til en ny funksjon eller oppdaterer lenker, vil disse oppdateringen vises i alle applikasjoner som bruker dekoratøren uten at teamene trenger å gjøre noe selv.
Grønn dekoratør
Dagens dekoratør er bygget for å sende minst mulig kode. Den er bygget med webcomponents, helt vanlig javascript og annen standardisert webteknologi uten store og tunge rammeverk. Det sparer mange kilobyte pr visning. Med 97 millioner sidevisninger i året, så merkes den innsparingen godt! Derfor skryter vi litt av at dekoratøren er ganske så grønn!
Cookie-banner for håndtering av samtykke
Ekomloven krever at vi må be om samtykke ved bruk av informasjonskapsler og lignende teknologi som ikke er strengt nødvendige for at nettsidene og tjenestene våre skal være sikre og fungere som de skal.
Team nav.no har laget et felles cookie-banner for nav.no, som omfatter alle applikasjoner som bruker dekoratøren. Det gjør at vi kan sentralisere og organisere samtykkene, slik at teamene enkelt kan sjekke hvilke samtykker brukeren har gitt, og være sikre på at lagring skjer i samsvar med brukerens ønsker.
Loven er teknologiuavhengig, og dekker alle typer teknologi som brukes til å lagre data i brukerens nettleser eller hente ut data fra brukerens utstyr på, for eksempel cookies, localstorage, sessionstorage og fingerprinting. Vi bruker for enkelhets skyld samlebegrepet «informasjonskapsler» eller «cookies» for alle typer teknologi som er omfattet av lovverket i denne artikkelen.
Vi har designet cookie-banneret slik at det skal skille seg tydelig fra annet innhold på sidene, basert på formspråket og designsystemet til Nav.
Banneret er utarbeidet i tråd med anbefalingene fra tilsynsmyndighetene, og felles mønster for samtykkebanner i Designsystemet: Be brukerne om samtykke til å lagre informasjon (designsystemet.no).
Banneret ligger helt i toppen av siden, over dekoratøren. Det dekker dermed ikke over annet innhold på nav.no, og tvinger ikke brukerne til å ta et valg før de kan bruke siden. Teksten i banneret forklarer kort hva brukeren kan velge å samtykke til. Valgene «Ja» eller «Nei» er likestilte, slik loven og retningslinjene krever. Banneret lenker videre til en cookie-erklæring, med mer utfyllende informasjon: Om informasjonskapsler, hva vi lagrer og hvorfor (nav.no).
Banneret inneholder også informasjon om at brukeren når som helst kan endre valget sitt gjennom en lenke i bunn av siden. De kan også endre valget sitt ved å klikke på en knapp i cookie-erklæringen. Begge disse trigger ny visning av cookie-banneret.
Cookie-banneret vises automatisk i alle applikasjoner som bruker dekoratøren.
- Banneret vises første gang brukeren besøker nav.no, og på nytt etter 90 dager. Slik sørger vi for at vi jevnlig får innhentet nytt samtykke.
- Alle lagrede cookies som ikke er «strengt nødvendige» slettes når vi viser banneret første gang, og når vi viser det på nytt etter 90 dager.
- Brukeren regnes som å ikke ha gitt sitt samtykke hvis
- banneret vises og bruker ikke har tatt et valg
- bruker har klikket «Nei»
- Dekoratøren laster ikke inn valgfrie cookies og scripts for Innblikk, Skyra eller liknende før bruker har gitt aktivt samtykke.
Dekoratøren har en tillattliste med alle navn/nøkler på cookies som det er lov å lagre. Vi tilbyr funksjoner som sjekker om en cookie er tillatt å skrive før den settes. Da sjekkes det om
- navnet på cookien er kjent og ligger i tillattlisten
- hvis cookien er definert som valgri, sjekkes om brukeren har gitt sitt samtykke til valgfrie cookies.
Du finner mer informasjon om dette i dokumentasjonen for nav-dekoratoren-moduler.
Nødvendige cookies kan vi fortsatt bruke uten å be om samtykke. Det er cookies som sikrer at nettstedet og tjenestene våre fungerer godt teknisk, og som ivaretar grunnleggende funksjonalitet, sikkerhet og brukervennlighet i løsningene våre.
Valgfrie cookies krever aktivt samtykke. Typisk er dette cookies vi bruker for å samle brukerinnsikt. Det vil si informasjonskapsler fra statistikk- og analyseverktøy, og fra verktøy vi bruker for å gjennomføre frivillige spørre- og brukerundersøkelser.
Det er teamene selv som er ansvarlige for etterlevelse av lovkravene, og som må vurdere hva de definerer som «strengt nødvendig» med hensyn til lagring av cookies.
Cookie-banneret vises automatisk i alle applikasjoner som bruker dekoratøren. Teamene trenger ikke å gjøre noe aktivt selv for å “slå på” cookie-banner. Derimot finnes det hjelpefunksjoner som teamene kan bruke for å være sikre på å etterleve kravene. Disse funksjonene ligger i nav-dekoratoren-moduler som er en hjelpepakke som team bruker for å sette inn dekoratøren i applikasjonene sine.
Eksempler på slike funksjoner er:
setNavCookie: Denne sjekker om en cookie finnes i tillatt-listen og om det er lov å lagre den i henhold til brukers eventuelle samtykke.isStorageKeyAllowed: Sjekker om en cookie er tillatt å lagre. Kan for eksempel brukes dersom teamet må håndtere spesielt dersom bruker ikke har gitt samtykke.getCurrentConsent: Gir informasjon om hvilket samtykke brukeren har gitt. Nyttig dersom teamet for eksempel har egne måter å lagre cookies eller annet på og vil sjekke om bruker har gitt samtykke til for eksempel analyse.
Dekoratøren stopper ikke lagring av cookies med mindre teamet bruker hjelpefunksjonene i nav-dekoratoren-moduler som i eksemplene ovenfor! Derfor er det viktig at teamene sjekker hvilket samtykke brukeren har gitt. Hvis ikke kan teamet risikere at bruker ikke har gitt samtykke, men at valgrie cookies (f.eks. Innblikk) lagres allikevel. Det er et brudd på krav om etterlevelse.
Det er viktig å understreke at funksjonaliteten i dekoratøren er ment å være til hjelp for teamene. De funksjonene som leveres via dekoratøren, Innblikk, Skyra og andre måleverktøy, har dekoratøren ansvaret for å stoppe dersom brukeren ikke har gitt samtykke.
Utover dette er det teamene som er ansvarlig for etterlevelse. Hvert enkelt team er ansvarlige for å gjøre egne vurderinger av om cookiene de bruker er nødvendige eller valgfrie, og for å dokumentere etterlevelse av kravene i loven. Team som har egne cookies må melde inn disse til #dekoratøren_på_navno. Det er både for å legge de til i tillattlisten, men også fordi alt som lagres på brukerens maskin skal informeres om i cookie-erklæringen.
Hvis dere er usikre, be om råd og bistand i #dekoratøren_på_navno.
Verktøy for webstatistikk og spørreundersøkelser
Dekoratøren tilbyr Innblikk for logging og innsikt i tillegg til Skyra for undersøkelser. Disse scriptene lastes inn automatisk i dekoratøren (forutsatt brukers samtykke) slik at de er klar til bruk i teamenes applikasjoner.
Vi bruker et verktøy vi har utviklet selv, Innblikk, til å samle inn data til bruk i statistikk og analyse.
I nav-dekoratoren og nav-dekoratoren-moduler finnes det hjelpefunksjoner som som kan benyttes for å gjøre mer detaljert analyse for brukere som har gitt samtykke. Dekoratøren logger alle sidevisninger automatisk til Innblikk forutsatt at brukeren har gitt samtykke (se lenger opp).
For team som ikke bruker Innblikk via dekoratøren, men i stedet har laget sin egen integrasjon ber vi teamet kontakte #researchops.
Undersøkelser for Skyra settes opp på egne måter utenfor dekoratøren. Dekoratøren brukes kun for å hente inn og sette i gang undersøkelsene, slik at team ikke trenger å gjøre dette i sin egen kode.
For team som trenger hjelp, kontakt #team-navno på Slack.
Innlogging
Dekoratøren har ikke egen mekanisme for innlogging. Innloggingsknappen som ligger i headeren sender brukeren til login.nav.no, hvor ID-porten håndterer hele prosessen. Deretter sendes brukeren tilbake til den opprinnelige siden eller applikasjonen vedkommende var på. Dekoratøren sjekker hva slags innloggingsstatus brukeren har for å kunne vise navnet til brukeren i topp av siden, og for å kunne vise en egen innlogget meny.
Hvis team ønsker å sjekke innloggingsstatus, hente informasjon om innlogget bruker eller finne token for kall mot andre tjenester, må de gjøre dette via felles API for innloggingstjenester. Dokumentasjon på dette finnes på nais.io.
Utloggingsvarsel
En innlogging varer i 60 minutter før den må fornyes (såkalt «token refresh»). Dersom brukeren er aktiv i form av musebevegelser eller tastaturklikk fornyes innloggingen automatisk. Ved stillstand vil brukeren få et utloggingsvarsel 5 minutter før utløp. Det gir mulighet til enten å fornye innloggingen med nye 60 minutter eller logge ut umiddelbart.
Denne funksjonen er slått på som standard i dekoratøren, men team som bruker dekoratøren kan velge å slå den av.
En total innlogging varer i 6 timer (såkalt «session»). Denne kan ikke fornyes. Brukere som har vært logget inn lenge ved å stadig fornye innloggingen sin, vil til slutt måtte logge ut og logge inn på nytt.
Språk
Språk i dekoratøren
Dekoratøren støtter bokmål og engelsk i det visuelle grensesnittet, det vil si topp, bunn, søkefelt, meny, utloggingsvarsel, cookie-banner etc. Det finnes også delvis støtte på samisk.
Hvis du har en side hvor selve innholdet (f.eks. artikkelteksten) er oversatt til polsk, så vil språket i dekoratøren-grensesnittet vises på engelsk, mens innholdet vises på polsk.
Språkvelger
Dersom du har innhold på flere språk, tilbyr dekoratøren en språkvelger. Dette er en nedtrekksmeny som lar brukeren skifte språk på én side til et av de andre språkene som teamet har gjort tilgjengelig. Teamet kan selv angi hvilke språk som er tilgjengelige for en gitt side ved å sende inn språkene som innstilling til dekoratøren. Teknisk dokumentasjon om språk finnes her.
Språkvelgeren støtter en rekke språk og målformer: bokmål, nynorsk, samisk, engelsk, polsk, ukrainsk og russisk.
Søk
Dekoratøren tilbyr søk direkte fra menyen. I tillegg kan brukeren velge å åpne søkeresultat på en egen side, som også tilbyr avanserte søkefiltere.
Søket inkluderer innhold på alle sider i Enonic XP (redaktørplattformen på nav.no). I tillegg er det mulig å legge inn ekstra treff for team som ønsker at søk på spesielle nøkkelord skal lede brukeren til deres egen applikasjon. Ta kontakt med #team-navno for hjelp med dette.
Prioriteringer i søk
Søket bruker Opensearch. Denne analyserer innhold og nøkkelord og rangerer søkeresultatene avhengig av hvilke ord brukeren har skrevet inn. I hovedsak er prioriteringene hensiktsmessige, men i enkelte tilfeller kan man oppleve at treff som burde komme øverst vil havne lenger ned på listen.
Søk og personvern
Vi vet at noen brukere misforstår meningen med søket og skriver lange setninger, oppgir personinformasjon osv. For å unngå at slik informasjon lagres, filtrerer vi vekk innhold som for eksempel kan likne på fødselsnummer, telefonnummer etc. I tillegg har vi satt en begrensning på 100 tegn i søkefeltet.
Meny
Menyen i topp og bunn hentes fra Enonic XP. Dersom du har spørsmål eller ønsker å endre lenker i menyen, ta kontakt med #team-navno.
Brødsmulesti
For sider som ligger under flere andre nivåer i strukturen, kan det være til hjelp å legge inn en brødsmulesti. Brødsmulesti fungerer som et veikart for brukeren til nettstedets hierarki, og er nyttig i noen tilfeller. En brødsmulesti kan hjelpe brukeren å
- se hvor de er i sidestrukturen (spesielt når de kommer inn på nav.no via et organisk søk)
- navigere tilbake i strukturen
- gå direkte til et nivå lenger opp i strukturen
Brødsmulesti er et sekundært navigasjonselement, og skal ikke erstatte hovednavigasjonen på siden. Vi bruker ikke brødsmulesti
- hvis strukturen har mindre enn tre nivåer
- ved lineær navigasjon gjennom stegene i et skjema eller en prosess
Dekoratøren har innebygde komponenter for å vise brødsmulesti. Dette sikrer at den blir lik ut på tvers av applikasjoner på nav.no, i de tilfellene hvor den skal vises. For å bruke brødsmulestien via dekoratøren, sender applikasjonen inn data om struktur, sidetitler og url, og så bygges brødsmulestien automatisk.
Mer teknisk informasjon om brødsmulesti finnes i dokumentasjonen til dekoratøren.
Brødsmulestien blir plassert til venstre på siden, under menyen og hovednavigasjonen, men over sidetittelen. Alle leddene i brødsmulestien vil være klikkbare lenker, bortsett fra siden brukeren står på, som er vanlig tekst. Brødsmulestien er også testet med hensyn til universell utforming (WCAG) og fungerer med både skjermleser og tastaturnavigasjon.
Om brødsmulesti på de åpne sidene på nav.no
Chatbot
Chatboten er skjult som standard, og vises dersom det finnes en pågående chat med veileder. Det er også mulig å slå chatbot helt av. Husk at dersom chatbot slås helt av, så vil den ikke vises på den aktuelle siden eller applikasjonen, selv om brukeren har en pågående samtale.
Endringslogg
| Dato | Endringer |
|---|---|
| 21.10.2026 | Endret plassering og tekst |
