Nettstedet og brukernavigasjonen

Portalen er delt i 9 temaer, fra pensjon og arbeid til energi og befolkning, og hvert av dem er en seksjon med sin egen farge. Fargen er ikke pynt. Den forteller deg hvor i portalen du er, uten at du må lese brødsmulestien, og den følger med i menyen, i overskriftene og i grafene.

Fargene skiller temaene fra hverandre, og alle er mørke nok til at hvit tekst på dem holder kravet til kontrast. Som tekstfarge er de et pågående arbeid: en seksjonsfarge som er lesbar mot hvitt, kan være nesten usynlig mot mørk bakgrunn. En hjelpefunksjon regner derfor ut en egen tekstvariant per visning, og en automatisk kontroll teller hvor mange steder som fortsatt bruker den rå fargen som tekst. Det tallet skal bare gå nedover.

Der fargen skal bære informasjon, skal noe annet bære den i tillegg - en strekstil, et ord, en form. Kunnskapskartet er det tydeligste eksempelet, og neste kapittel forklarer hvorfor.

Resten av det visuelle språket bor ett sted, som navngitte verdier: bakgrunner, tekstfarger, avstander og skygger. Bakgrunner og tekst har egne verdier for mørk visning. Seksjonsfargene bor ikke ett sted ennå. De står som fargekoder mange steder i koden, og derfor må tekstvarianten regnes ut for hver av dem.

Portalen har 150 sider, hvorav 130 ligger under en seksjon. Så mange sider trenger mer enn én vei inn, fordi folk leter ulikt. Hva seksjonene inneholder, står i kapitlet om innholdet; her er veiene inn.

1. 1. Menyen

   En meny som viser alle seksjonene og undersidene deres samtidig. Vet du hva du leter etter, er det som regel to klikk unna. Den store menyen, panelet på forsiden og de to mobilmenyene leser samme register, og en test feiler hvis et tema på forsiden mangler i det. Radene med undersider inne i hver seksjon er egne lister, som holdes i takt for hånd.

2. 2. Søket

   Søkefeltet på forsiden leter i tittel, beskrivelse og stikkord i et register med 117 oppføringer, og tar med bloggartiklene. Derfor finner «strømpris» energisidene selv om ordet ikke står i tittelen. Søket leter etter hele frasen du skriver, så flere ord treffer bare der de står i akkurat den rekkefølgen, og ikke alle sider ligger i registeret.

3. 3. Innholdsoversikten

   Nettstedet på én side, gruppert etter seksjon. Nyttig når du vil se hva som finnes framfor å lete etter noe bestemt. Oversikten er en egen liste, og ikke alle undersider står i den.

4. 4. Kunnskapskartet

   For den som leter etter sammenhenger framfor sider. Neste kapittel handler om det.

Inne i en seksjon får du en egen rad med undersidene. Den trekker seg unna når du scroller nedover, og kommer tilbake øverst på siden. Hver underside har sin egen adresse - ikke en fane som bare bytter innhold uten å endre nettadressen. Det betyr at en lenke til en bestemt underside faktisk åpner den, og at du kan gå tilbake dit du kom fra.

En graf viser en utvikling raskt, men skjuler de eksakte tallene. En tabell gjør det motsatte. Derfor kan hver visualisering på portalen vises som begge deler, med en bryter rett under overskriften.

Bryteren finnes både per graf og for hele siden samtidig. Trykker du på den øverste, skifter alle grafene på siden. Det er nyttig når du skal lese tall framfor å se former, og det er nødvendig for den som bruker skjermleser: en graf er vanskelig å lese opp, en tabell er det ikke.

Valget skal ikke følge deg videre til neste side: et klikk på «tabell» én gang skal ikke skjule alle grafer for deg for alltid. I dag blir det likevel stående når du går videre til en annen side på portalen, og nullstilles først når siden lastes på nytt. Det er en feil, og den skal rettes.

Sidene bygges ferdige på forhånd, men grafene tegnes i nettleseren, og da betyr det noe hva som sendes med. Registeret over når hver datafil sist ble oppdatert, drar alle datafilene med seg. En gang havnet det i det som ble sendt til nettleseren på sidene om økonomi, med en stor mengde tall ingen av sidene viste. En test følger nå importene fra hver komponent som kjører i nettleseren, og feiler hvis den når fram til det registeret eller til andre moduler som bare skal kjøre på serveren.

Nettstedet har lys visning, mørk visning og et valg om å følge det maskinen din allerede er stilt inn på. Mørk modus er ikke lys modus med omvendte farger, fordi en farge som er lesbar mot papir sjelden er det mot nesten svart. Bakgrunner og tekst er definert på nytt for mørk visning, og der en seksjonsfarge brukes som tekst, skal den byttes mot en lysere variant som er regnet ut for mørk bakgrunn.

Det gjelder også detaljene som er lette å glemme. En kildehenvisning som er dempet for å virke diskret, kan falle under kravet til lesbar kontrast nettopp mens du peker på den. Slike tilfeller er rettet ved å bruke understreking framfor demping - samme signal, uten å ofre lesbarheten.

Norsk lov krever at nettsteder er tilgjengelige, og portalen sikter mot WCAG 2.1 på nivå AA. For en portal med offentlig statistikk er det også innlysende på egne premisser: tallene handler blant annet om uførhet, helse og alderdom, og det ville vært et selvmål om sidene som viser dem var vanskelige å bruke.

En del av kravene kontrolleres automatisk ved hver endring: kontrast leses ut av kildekoden, og den automatiske kontrollen stopper vanlige feil, som klikkbare elementer uten tastaturstøtte. Resten av tastaturkravet, trykkflater og bevegelse sjekkes for hånd, og en full gjennomgang i nettleseren kjøres bare lokalt. Hvordan kontrollene virker, står i kapitlet om utviklingsprosessen.