Retningslinjer design

For at å bruke sidene våre skal oppleves mest mulig sammenhengende av brukerne, er det viktig at vi designer sidene mest mulig likt, og følger de samme prinsippene.  

Menyer og navigasjon

Venstremeny

Tittel på mappen blir vist som venstrestilt navigasjonsmeny (også kalt kontekstmeny).

  • Navn bør være forståelige og konkrete
  • Dersom det er mulig: forsøk å begrense venstremeny til  5-7 menypunkter. Har du fler enn det: vurder om innholdet kan grupperes annerledes, eller om du bør bruke en forsidemal.
  • Prioriter mappene slik at de viktigste temaene ligger øverst. 
  • Forsøk å unngå "Tomme" mappenivåer
  • Skjul mapper som kun er for organisering av innhold (som "bilder")

Se veiledning for mapper

Forsidemalen

  • Bruk forsidemalen når du trenger å vise vei inn til et omfattende tema, ikke dersom du kan presentere det meste av innholdet på èn side, da kan du heller bruke en vanlig artikkel. 
  • Forsider skal bruke visuell profil med tilbakepeker, uten venstremeny. 

Full veiledning: forsidemalen

Mapper uten forside

  • Det er ikke alltid det er nødvendig med forside i en mappe. Skal du f.eks. bare liste tilgjengeliggjøre et utvalg dokumenter, kan du velge å la dokumentene ligge i en vanlig mappe uten forside. Da er det spesielt viktig at filnavnene må være forståelige og systematiske. 
  • Bruker du en mappe av typen artikkelliste, vil artiklene i den mappen vises som en liste hvor tittel, ingress og evt. ingressbilde er synlig. 
  • Se veiledningen for mapper
  • Oversikt: Hvilke maler brukes hvor

Elementer som kan settes inn på nettsider

Det finnes en rekke komponenter og elementer som kan settes inn på nettsider i Vortex, men noen av dem bør brukes med mer forsiktighet enn andre for å sørge for at brukeropplevelsen blir best mulig. 

Lenkeknapp (handlingsdriverknapp)

  • Brukes for å fremheve den viktigste handlingen på en side (klikke på en lenke, gå til et skjema, levere søknad e.l.)
  • Bør kun brukes én knapp pr nettside
  • Skal ikke brukes som erstatning for navigasjon
  • Teksten på en knapp bør være kort ("Send inn skjema"

Veiledning: knapper (uio.no)

Accordion/trekkspill

Denne komponenten gjør at alle hovedavsnitt (h2 eller h3) skjules, men ekspanderes når man trykker på overskriften. Accordions kan gi bedre oversikt, og fungerer godt for mobil. Egner seg spesielt for innhold der det kan være relevant for brukeren kun å lese utvalgte avsnitt. 

Veiledning: trekkspill-komponent (uio.no)

Accordions bør imidlertid unngås dersom det er sannsynlig at brukerne ønsker å lese alle avsnitt på en side, eller dersom det er veldig mange avsnitt. Da kan ankere eller Innholdsfortegnelse (uio.no) være et bedre alternativ. 

Tabeller

Bruk tabeller bare til å presentere tabelldata (statistikk, telefonliste, åpningstider e.l.), ikke for å lage layout. 

Bruk formateringsmulighetene i tabellverktøyet riktig: skriv inn tabellsammendrag og overskrifter.

Unngå for komplekse tabeller på nett, del heller opp. 

Se mer: 

Tabeller i Vortex(uio.no)

Universell utforming av tabeller (uu.difi.no)

 

 

 

Publisert 20. mars 2020 16:33 - Sist endret 20. jan. 2022 16:07