Hvor ”tunge” bør bilder på nett være?

Et spørsmål vi ofte får av nettredaktører har med bildestørrelser å gjøre, altså ikke dimensjoner, men filstørrelse. Hvor ”tunge” (i mangel av et bedre ord) kan bildene på nett være?

Bildebruken på nett har bare økt de siste årene. Vi bruker flere bilder enn før på nettstedene våre, og de er både større og tyngre enn før. I 2012 nådde den gjennomsnittlige størrelsen på en nettside 1Mb. I 2015 hadde dette doblet seg til 2Mb. I 2017 var gjennomsnittsstørrelsen 3Mb. Mer enn 65% av dette er bilder.

Tregere sider betyr færre konverteringer

Når sidestørrelsen øker, øker også Iastetiden. Dette fører til at brukeren lett kan bli sittende utålmodig og vente på at siden skal laste ferdig. Når vi i tillegg vet at rask lasting av siden og antall konverteringer gjerne henger sammen, blir dette noe vi kan kjenne på bunnlinjen. Det er mye vi kan gjøre for å sørge for at siden vår laster så raskt som mulig, men redusere filstørrelsen på bildene er kanskje et av de enkleste grepene vi kan gjøre selv, uten å måtte involvere utviklere.

Ta hensyn til mobil

En annen grunn til å redusere tyngden på bildene dine er mobilbrukerne. Allerede i 2014 var det fler som gikk på nett med mobil enn med desktop, og trenden har bare akselerert. Dermed er vi ikke bare nødt til å ta hensyn til mobilbrukerne, men vi må ta hensyn til dem først av alle. Mobilbrukerne har ikke luksusen av store skjermer og superraskt bredbånd, og i tillegg har mange brukere begrensninger på datamengden de kan laste ned pr. måned. Da blir det ekstra viktig å sørge for at sidene er raske, også på mobil.

Hva du kan gjøre: 

1. Velg riktig grafikkformat

De viktigste grafikkformatene på web er GIF, JPEG og PNG. Alle disse er såkalte komprimerte formater, slik at bildene skal bli så lette som mulig. De egner seg imidlertid til litt forskjellig bruk:

Fotografier: JPEG eller PNG-24
Enkel grafikk (lavt antall farger): GIF eller PNG-8
Enkel grafikk (lavt antall farger) med gjennomsiktige områder: GIF eller PNG-8
Komplisert grafikk med eller uten gjennomsiktige områder: PNG-24

2. Reduser filstørrelsen på JPEG-bildene dine

JPEG-bilder kan bli ganske små i filstørrelsen, samtidig som de har bra bildekvalitet. JPEG-formatet har variabel kompresjon, det vil si at man kan bestemme hvor stor filstørrelsen skal være. Ulempen er at jo mer man komprimerer bildet, jo dårligere blir bildekvaliteten. En god komprimeringsinstilling for web i Photoshop vil være 60%. Ved 75% eller mer vil man begynne å se en tydelig forringing av bildekvaliteten.

3. Tenk på hele sidestørrelsen

Hele siden bør ikke overstige 1,5 Mb. Hvis 65% av dette er bilder, vil bildene utgjøre ca. 975 Kb. Hvis man deler dette på antall bilder på siden, finner man en gjennomsnittstyngde som bildene bør ha. Har man f. eks. 5 bilder på siden, bør gjennomsnittstyngden på et bilde være ca. 195 Kb. Det gjør naturligvis ingenting om det er mindre enn dette. I prinsippet kan man si at jo lettere siden er, jo bedre er det.

4. Sett en maksgrense for bildetyngde på nettsiden din

Dette er  først og fremst fordi det er en enkel retningslinje å etablere og kontrollere, og derfor er med å sikre at alle som er involvert i arbeidet med innholdet på nettsidene arbeider etter samme standard når det gjelder bilder. Her kan man også bruke regnestykket ovenfor som et utgangspunkt, og i tillegg kutte f. eks. 10-20% for å være på den sikre siden.

Det er mange faktorer som bestemmer både faktisk og opplevd hastighet på en nettside. Vi anbefaler imidlertid at man utfører bildeoptimalisering før man ser på mer kostnadskrevende tekniske løsninger, da bildeoptimalisering både er kosteffektivt, enkelt å gjøre selv, og kan utgjøre en reell forskjell i hastigheten på nettsidene dine.

 

Har du lyst til å lære mer? – Vi i Webgruppen har en rekke kurs om webkommunikasjon og digital marketing.

 

 

 

 

 

 

Kommentarene er lukket