Derfor bør nettstaden din vere responsiv

19. juni 2017 – Oda Holmelid Sandvik

Ein responsiv nettstad er ein nettstad med innhald som tilpassar seg skjermen sin størrelse. Innhaldet er fleksibelt og relativt til eininga du brukar. Layouten (det grafiske oppsettet) og innhaldet ser gjerne annleis ut på ein dataskjerm enn ein mobilskjerm.

Responsiv nettstad på mobilskjerm og dataskjerm

På ei mindre flate, for eksempel ein mobilskjerm, er det plass til mindre innhald enn det er på ein dataskjerm, og ein må derfor tilpasse innhaldet og oppsettet slik at det får plass i skjermen. Viss det er noko innhald som ikkje får plass kan ein heller flytte dette ned og finne dette ved å bla seg nedover i nettstaden. Ein meny vil heller ikkje fungere på same måte på ein mobilskjerm. Menytekst kan her verte for liten til å vere leseleg. Vi anbefaler heller å bruke det vi kallar for ein hamburgarmeny som ein kan trykke på før menyen dukkar opp over heile skjermen.

Slik kan denne sjå ut:

Side før hamburgarmeny er opna

ide etter hamburgarmeny er opna

Bilete og andre media skal også kunne vere relative i størrelse ut i frå kva eining du brukar. Eit bilete bør ikkje plasserast på same måte på mobil- og dataskjerm. Prøv å få bilete til å dekke heile breidda i skjermen på mobil viss dette er ein viktig del av informasjonen du presenterer på sida. Detaljar kan verte usynlege viss ikkje.

Viss du har ein tanke om at brukarane dine brukar tenesta mykje eller mest på mobil, kan du under arbeidet med nettstaden din utforme den etter det som vert kalla «mobile first»-prinsippet. Her har du fokus på mobildesignet før du tilpassar dette til dataskjermen.

Med ein responsiv nettstad gjev du brukaren ei god oppleving uansett kva eining han brukar. Responsive nettstadar skapar mindre irritasjon og frustrasjon hos brukaren, og gjev han sannsynlegvis meir lyst til å besøke og bruke nettstaden din i framtida.

Tre ting som er verdt å tenke på:

 Det er mindre plass på ein liten skjerm. Nettstaden skal ikkje sjå lik ut her som på ein dataskjerm.
 Bruk heller hamburgarmeny framfor tekstelement med lenkjer til undersidene dine på mindre skjermar.
 Bileta skal kunne spele ei like stor rolle på ein mobilskjerm. Tenk på at desse må ta større plass.

Universell utforming

Frå 2014 pliktar både offentlege og private verksemder som utarbeidar IKT-løysingar retta mot allmennheten å utforme sine produkt universelt. Med dette meiner ein at løysinga skal kunne nyttast av flest mogleg. Føremålet er å skape likestilling og likeverd. Ein kan gå inn på Lovdata si side for å lese forskrifta.

Noko som kjenneteiknar ein universelt utforma nettstad er at alt innhald skal kunne vere mogleg å lese for flest mogleg. Det er ikkje nok at innhaldet passar inne i ein mobilskjerm, men at innhaldet også er så stort at ein kan lese det. Derfor er det viktig å tenke på at ein ikkje får plass til like mykje synleg innhald på ein mobilskjerm som ein dataskjerm. Viss innhaldet på ein nettstad eller ei anna digital løysing ikkje tilpassar seg forskjellege skjermstørrelsar vil den heller ikkje følgje alle krava om universell utforming.

Viss du vil lese meir om krava for universell utforming av nettløysingar kan du besøke uu-skolen på Direktoratet for forvalting og IKT (Difi) sine nettsider.

Tre grunnar til å ha ein responsiv nettstad:

 Du vil kome høgare opp i Google-søk. Google nedprioriterer nettstadar som ikkje er responsive.
 Med ein responsiv nettstad oppfyller du fleire av krava om universell utforming.
 Du unngår mykje frustrasjon og irritasjon hos brukarane dine, og dei får lyst til å bruke nettstaden igjen.

Dei fleste webbyrå kan hjelpe deg med å gjere nettstaden din responsiv. Ta kontakt med dykkar leverandør og høyr kva dei kan tilby. Du kan også kontakte Mediebruket eller ein av våre samarbeidspartnarar for eit uforpliktande tilbod.