Afbeeldingen optimaliseren in Magento 2 - 4 tips

Afbeeldingen optimaliseren voor Magento 2: 4 tips

Nog te veel webshops gebruiken verouderde, niet-geoptimaliseerde afbeeldingen die niet bijdragen aan de laadtijd van de pagina. Terwijl iedereen zich focust op het SEO vriendelijk inrichten van de pagina, besteden ze te weinig aandacht aan een van de belangrijkste factoren om de paginalaadtijd te verbeteren: geoptimaliseerde afbeeldingen.

Wil je meer bezoekers aantrekken en wil je dat deze langer op je webshop blijven, start vandaag nog met het optimaliseren van afbeeldingen. Het optimaliseren van afbeeldingen leidt tot een snellere website en een hogere positie in de SERP. Een kans die anno 2021 veel webshops nog laten liggen.

In deze blog behandelen we de voordelen van het optimaliseren van afbeeldingen, welk bestandstype je het beste kunt gebruiken en geven we je een viertal tips waarmee je direct aan de slag kunt.

Waarom is het optimaliseren van afbeeldingen voor Magento 2 belangrijk?

Het optimaliseren van afbeeldingen voor Magento 2 brengt een aantal voordelen met zich mee. Het is daarom belangrijk dat iedere webshop dit onderwerp serieus aanvliegt en consistent blijft doen. Het optimaliseren van afbeeldingen heeft de volgende voordelen:

  1. Afbeeldingen met een kleine bestandsgrootte zorgen voor een betere gebruikerservaring omdat de content sneller geladen wordt;
  2. Afbeeldingen met een kleine bestandsgrootte zorgen voor kortere laadtijden;
  3. Een betere gebruikerservaring en korte laadtijden zorgen voor meer conversie;
  4. Zoekmachines houden van snelle websites en plaatsen deze hoger in de SERP;
  5. Verbruik van minder opslag en bandbreedte.

Zoals je leest maken afbeeldingen onderdeel uit van je zoekmachine-optimalisatie (SEO) en conversie-optimalisatie. Daar draait het uiteindelijk om. Ze hebben invloed op je ranking, vindbaarheid en spelen een belangrijke rol in de manier waarop bezoekers je webshop ervaren.

Waar moet je opletten bij het optimaliseren van afbeeldingen?

We hebben vijf belangrijke punten opgeschreven waarmee je rekening moet houden bij het optimaliseren van afbeeldingen. Gebruik ze als checklist, elke keer voordat je nieuwe afbeeldingen uploadt. Dan kan het niet misgaan.

Bestandsgrootte: Naast video’s zijn hoogstwaarschijnlijk afbeeldingen over het algemeen verantwoordelijk voor de grootte van je webpagina. Er zijn verschillende bewerkingsprogramma’s en tools die je kunt inzetten om de afbeeldingen kleiner te maken, zonder kwaliteitsverlies. Vooral bewerkingsprogramma’s zoals Photoshop en Gimp zijn hiervoor geschikt. Of online tools zoals TinyPNG, TinyJPG of Optimizilla. Over het algemeen wil je dat afbeeldingen niet groter zijn dan 500kb. Om de bestandsgrootte te drukken kun je de afmeting van de afbeelding verkleinen of de afbeelding comprimeren. Let er wel op dat dit afbeeldingskwaliteit wordt gewaarborgd.

Let er op dat je voor sommige platforms niet gebruik te maken van externe tools maar deze kennen zelf zogeheten ‘Image optimizers’. Later meer hierover.

Afbeelding afmeting: Net als het optimaliseren van de bestandsgrootte, wil je ook de afmeting optimaliseren. Doorgaans hebben afbeeldingen een hoge resolutie en een grote afmeting, vaak groter dan nodig is. Wanneer je een foto maakt met een mobiele telefoon of digitale camera kan deze zomaar een grootte van 3000 x 3000 pixels hebben terwijl de afbeelding op je webshop maar 300 x 300 pixels is. Een te grote afbeelding kan leiden tot een ongewenste bestandsgrootte wat leidt tot een vertraging in de laadtijd van je webpagina.

Doorgaans wil je dat afbeeldingen een maximale breedte van 1500 pixels hebben. En headers en achtergrondafbeeldingen niet breder dan 2500 pixels. Experimenteer met deze afmetingen totdat je de juiste balans in afmeting en bestandsgrootte hebt gevonden.

Laadtijd: Zoals bij ‘Bestandsgrootte’ en ‘Afbeelding afmeting’ aangegeven zijn afbeeldingen hoogstwaarschijnlijk voor een groot deel verantwoordelijk voor de laadtijd van je webpagina. Hoe groter de bestanden, des te langer het duurt voordat de webpagina geladen is. Bezoekers die lang moeten wachten haken snel af. Daarom heeft Google destijds besloten om laadtijden mee te laten wegen in het rankingsproces. Een snelle webshop rankt hoger. Via Google PageSpeed Insights kun je per webpagina zien welke afbeeldingen optimalisatie nodig hebben.

Unieke afbeeldingen: Kies eigen, unieke afbeeldingen. Bij tekst wordt vaak gesproken over duplicate content en hoe het schadelijk kan zijn voor je ranking. Dit geldt hetzelfde voor afbeeldingen. Zorg voor eigen, unieke afbeeldingen in je webshop. Neem bij voorkeur dus niet de afbeeldingen over van leveranciers, maar ga uit van eigen kracht.

Alt-tags: Door alt-tags toe te voegen aan afbeeldingen begrijpen zoekmachines beter wat er op de webpagina staat en daardoor rank je beter. Gebruik zoektermen die aansluiten bij de tekst op de webpagina. Als je bijvoorbeeld zoekwoorden onderzoek hebt gedaan voor het bouwen van de pagina kun je de zoekwoorden terug laten komen in de alt-tags.