På en typisk hjemmeside udgør billeder i omegnen af 60-80% af den mængde data, der skal transmitteres over Internettet. Vi kan reducere datamængden betragteligt, ved at justere på komprimeringsgraden eller tilbyde billeder i et moderne format som WebP
En lettere hjemmeside indlæses hurtigere – specielt på mobiltelefoner – og reduktionen i filstørrelsen kan direkte oversættes til et lavere strømforbrug mindre CO2-udledning./
Indhold
Ét foto, fire forskellige komprimeringsindstillinger
I galleriet herunder, ses fire udgaver af det samme 2560*1440 pixels store billede, komprimeret med fire forskellige indstillinger. Klik på et af billederne for at zoome ind. Du kan bladre i galleriet med højre og venstre piletast.
Fotos med fine detaljer og sarte farveovergange er vanskelige at komprimere, uden det kan ses. I det viste eksempel ses forskellen tydeligst på træerne i midten af billedet.
JPEG er godt. WebP er bedre.
WordPress komprimerer som udgangspunkt JPEG-billeder i kvalitet 82. Ved bare at sænke denne indstilling til 70, kan vi reducere filstørrelsen betragteligt uden nævneværdig visuel forringelse. Går vi skridtet videre og konverterer billedet til WebP-format, opnår vi en yderligere reduktion i filstørrelsen
| Filformat | Filstørrelse |
|---|---|
| JPEG-82 | 440 kB |
| JPEG-70 | 312 kB |
| WebP-82 | 254 kB |
| WebP-80 | 203 KB |
Så lidt fylder de komprimerede filer i forhold til originalen
Fotos er forskellige og det afspejler sig også i hvor meget de fylder. Fotos med mange detaljer, fylder mere end fotos med få. Test forskellige komprimeringsgrader med dine egne fotos, og vælg en fornuftig balance mellem filstørrelse og kvalitet. Her kan du se hvor lidt billedet med vindmøllerne fylder i forhold til originalen i de forskellige kvaliteter:
De fleste fotos er til pynt
De fleste fotos bruges blot til illustration eller dekoration og er forhåbentligt altid skaleret ned i en størrelse, der passer til layoutet, og altid komprimeret i en eller anden grad. Er det afgørende, at et foto er til rådighed i fuld opløsning, f.eks. på et foto site som Unsplash, er der en særlig download knap til formålet. En let øget komprimering eller konvertering til WebP, bliver næppe bemærket af den besøgende – det skulle da kun være fordi, at sitet indlæses hurtigere.
Kan du bruge WebP?
Ja du kan. Alle moderne browsere understøtter WebP. Webserveren som serverer WebP-varianter af dine billeder, tjekker lige understøttelse med den besøgendes browser, og hvis browseren ikke bryder sig om WebP, får den blot serveret den originale JPEG eller PNG.
Webp Image format (based on the VP8 video format) that supports lossy and lossless compression, as well as animation and alpha transparency. WebP generally has better compression than JPEG, PNG and GIF and is designed to supersede them. AVIF and JPEG XL are designed to supersede WebP.
caniuse.com
Vil du også ha’ en bæredygtig hjemmeside?
Vil du vide mere om hvordan du kan optimere billeder på dit website, tilbyde en bedre brugeroplevelse samtidig med at dit website bliver grønnere? Så kontakt os.
