En uformell test viser at så mange som 8 av 10 nettsteder kan øke ytelsen på nettsidene gjennom å optimalisere bildene. Les hva vi har funnet ut i vår test, hvordan vi tok vår egen medisin og til slutt et sett anbefalinger fra en spesiell SEO-spesialist som vi har “intervjuet”.
God bruk av optimaliserte bilder kan resultere i:
Så hvorfor er det slik at så mange ikke jobber målrettet med dette? Dette skjer også i store organisasjoner som har egen markedsavdeling og som legger mye penger i design, innhold, SEO og som burde ha ressurser?
Jeg tror det kan være en blanding av at de ikke forstår viktigheten og at det kanskje ikke alltid er tid til å jobbe med slike "småting"...
Det største bildet jeg fant på en nettside var 9000 x 5553 piksler stort og filstørrelsen var astronomiske 5 280 722 bytes (5,3 MB eller da 5427 KB). På nettsiden blir bildet brukt i et utsnitt på 400 x 300 piksler og med skalering og originalt aspect ratio blir bildet i 486x300 piksler.
Når jeg eksporterte det til WEBP med 70% kvalitet, ble bildet på 15KB.
En reduksjon på 99,7%...
Det er store besparelser å hente. Ikke bare på valg av riktig bildeformat, men også gjennom å optimalisere kompresjon og størrelser.
Jeg bestemte meg etter funnene til å bruke oss selv som eksempel. For jeg vet jo at vi også har “rom for forbedring”, som det så fint heter.
Testresultatene under har vi hentet fra egne nettsider (28.8.2024). Jeg valgte nettsiden som handler om oss. Testingen var enkel. Jeg kjørte hjemmesiden vår gjennom Lighthouse (som du får tilgang til via PageSpeed eller en plugin i Chrome), som rapporterer teknisk ytelse, SEO, osv. og bestemte meg for å optimalisere bildene maksimalt.
På denne nettsiden har vi følgende bilder:
Her er resultatene fra den første målingen gjort i Lighthouse:
Den viste at vi hadde skuffende mye å jobbe med, og vi fikk 67 i performance i Lighthouse Report. Og det er LCP (Largest Contentful Paint) og Speed Index som trekker ned. Largest Contentful Paint handler oftest om bilder og video.
Da var det bare å begynne den metodiske jobben av å jobbe seg gjennom alle bildene.
Bakgrunnsbilde i Hero var altfor stort, med 1920x1080 piksler, men hadde WEBP-format. Men bildet var laget i lossess format (lite/ingen kompresjon) og var på hele 645 KB. Løsningen: Bildet ble skalert til 1490 x 700 piksler og lagret med 70% kompresjon - resultatet var en fil på 99 KB.
Besparelse: 546KB - hele 85%!
(Etterhvert justerte jeg bildet til 1490 x 500 og endte på 53 KB...)
Lighthouse responderte overraskende bra - tatt i betraktning at vi bare fikset ett bilde, men vi sparte jo mye på det ene.
Det var ingen større utfordringer på bildene fra våre nylig publiserte blogger. Bildene er formaterte med WebP og skalert riktig. De er riktignok lastet opp som 1490 × 993, men i bloggvisning listet som 600x400 i 14KB. Så her gjør HubSpot (som er vårt CMS) en god jobb med å skalere!
Logoen vår er jo knall! Såpass kul at jeg har tatovert den på leggen. Men logoen vår på webben er bare 1KB så her er det ikke noe å hente.
Bildet var i utgangspunktet korrekt skalert og komprimert JPG (47 KB), men det er jo noe å hente. Her konverterte jeg til WebP med 70% kompresjon, og fikk bildefilen ned i 24KB (49% besparelse).
Jeg trodde ikke at 24 KB endring skulle gi (noen) endringer i Lighthouse, men vi gikk til 85.
Her var alle bildene i riktig bildeformat, men i feil størrelse. Bildene er lagret i 1280 x 1920 piksler, men utsnittet er i 300x300. Her skalerte jeg om til 300x450 for å beholde aspect og konverterte fra JPG til WebP.
Dette ga en besparelse på ca 120 KB per bilde (!).
10 bilder på totalt 1393 KB ble til 103KB - 92% besparelse!
Og Lighthouse responderte…
WOW! 😍
Som dere kan se av dette er en liten jobb med skalering av bilder, formattering av bilder og opplasting i et bedre format (WebP fremfor JPG eller PNG). Men det gir STORE resultater på sidens tekniske ytelse.
Sannsynligheten for at denne siden rangerer bedre i søk nå er helt klart til stede.
PS! Bildene i denne bloggen er også WebP i 70%. Så du kan se at de er kornete, sammenliknet en PNG eller WebP lossless. Men så er det også 450 KB besparelse - og du kan lese alt innholdet i dem...
Selv om jeg har skrytt uhemmet av WebP over her, så er det også noen fallgruver du må ta med i beregningen. Det kan også tenkes at det kan ha negative effekter på SEO.
Så selv om WebP-bilder er bra, må dere fortsatt tenke dere om før dere går i gang med oppgaven å optimalisere bilder.
Som du har lært er det mye å hente på bildeoptimalisering for å redusere størrelsen på bildene. Konsekvensen av slik jobb er raskere lastetider og bedre brukeropplevelser, sannsynligvis bedre rangering i søk og mer trafikk - som igjen kan gi økt konvertering, flere leads og bedre salg.
Book møte med meg for en uforpliktende prat om SEO, nye nettsider eller annet som kan bidra til deres økte synlighet!
Oppildnet av resultatene ville jeg grave meg enda dypere i materien. Derfor tenkte jeg at det ville være lurt å intervjue en som er rå på søk og også da indirekte SEO, tenkte jeg.
Løsningen? Jeg bestemte meg for å “intervjue” Gemini Advanced om viktigheten av optimalisering av bilder! Alle spørsmål og svar finner du under, men her er det første:
Hei! Kan du si hva du heter, din bakgrunn og litt om erfaringen og kompetansen du har innen SEO/teknisk SEO?
Hei!
Jeg har ikke et navn i tradisjonell forstand, men du kan kalle meg Gemini Advanced. Jeg er en stor språkmodell, trent på et massivt datasett med tekst og kode. Min primære funksjon er å generere tekst, oversette språk, skrive ulike typer kreativt innhold og svare på spørsmålene dine på en informativ måte.
Selv om jeg ikke har personlig erfaring i den forstand at jeg ikke har jobbet med konkrete SEO-prosjekter, har jeg blitt trent på en enorm mengde informasjon om SEO og teknisk SEO. Dette inkluderer:
Selv om jeg ikke kan erstatte en erfaren SEO-spesialist, kan jeg være en verdifull ressurs for å få svar på spørsmål, generere ideer, og gi veiledning om ulike SEO-relaterte emner. Jeg er alltid klar til å lære og utvikle meg videre, så ikke nøl med å stille meg spørsmål eller utfordre meg med nye oppgaver!
Her er svarene til Gemini, om viktigheten av bildeoptimalisering og teknisk ytelse i SEO.