Afbeelding optimalisatie voor SEO & website performance

Gepubliceerd: maart 14, 2023
Geschreven door: Eva van Hout
BEWISE Solutions - Afbeelding optimalisatie vierkant - @catalyststuff

Je hebt een prachtige website met daarop goede teksten en afbeeldingen. Je wilt natuurlijk veel bezoekers naar jouw website leiden via Google. Om dit te doen moet je eerst goed werk verrichten voordat Google jouw site graag wilt tonen. Twee zaken die vaak vergeten worden zijn het hebben van een goede website snelheid & afbeelding optimalisatie. Maar hoe doe je dit? We vertellen je graag hoe je jouw afbeeldingen op de juiste manier optimaliseert.

Wat is afbeelding optimalisatie?

Bij het optimaliseren van afbeeldingen doe je er alles aan om de snelheid van jouw website te behouden, door de afbeeldingen te verkleinen zonder teveel kwaliteit te verliezen. Daarnaast optimaliseer je alle afbeeldingen voor Google, zodat jouw complete pagina hoger gaat scoren in de zoekmachine resultaten. We gebruiken ze elke dag, maar wat is eigenlijk het doel van zoekmachines? Een zoekmachine doet er alles aan om precies te vinden wat de gebruiker zoekt. Wanneer jij als gebruiker zoekt naar “een recept voor vegan pasta”, dan wil je daar zo snel mogelijk relevante pagina’s met recepten voor krijgen. Daar doen zoekmachines, als bijvoorbeeld Google, dan ook alles aan. Door jouw content te optimaliseren voor deze zoekmachines zorg je ervoor dat jouw content bovenaan in de zoekresultaten komt te staan.

Afbeelding optimalisatie voor website performance

We starten met de basis optimalisatie voor jouw website performance. Met deze kleine stappen maak je al een groot verschil.

  • Kies het juiste bestandsformaat

    Begin bij het kiezen van de juiste afbeeldingen in de juiste formaten. Zorg ervoor dat je een afbeelding zoekt in de beste kwaliteit die je kunt vinden. (In onze blog “Optimaal gebruik maken van copyright vrije afbeeldingen” staan diverse sites die je hiervoor zou kunnen gebruiken.)

  • Zorg voor het juiste bestandstype

    Een ander cruciaal onderdeel is het bestandstype. De extensie geeft weer om wat voor document het gaat (.png, .jpg…). Iets waar je rekening kunt houden is lossless & lossy. Bij losless wordt het bestand verkleind bij het comprimeren, maar kan het teruggezet worden naar de oude staat. Lossy wordt overgeschreven met de nieuwe gecomprimeerde data. Bekende en veelgebruikte bestandstype die je kunt gebruiken zijn:
    – PNG: Afbeeldingen van hoge kwaliteit, maar ook hoge bestandsgrootte. Wordt voornamelijk gebruikt op websites voor de weergave van afbeeldingen van hoge kwaliteit als lossless afbeeldingsformaat.
    – JPEG: Geschikt voor fotografisch materiaal met veel kleuren. Maakt gebruik van lossy en lossless optimalisatie. Fijne balans tussen kwaliteit en bestandsgrootte.
    – GIF: Laag bereik aan kleuren, vooral gebruikt voor bewegende afbeeldingen.
    – WebP: Speciaal door Google ontwikkeld om afbeeldingen beter te optimaliseren. Het enige ‘nadeel’ hiervan is dat het op bijna alle browsers wordt ondersteund, maar er zitten wat uitzonderingen bij. Bekijk welke browser WebP ondersteunt.

    BEWISE Solutions - Bestanden

 

Afbeeldingen comprimeren

Zorg ervoor dat je een afbeelding kiest dat past in je formaat. Denk hierbij aan horizontale en verticale afbeeldingen. Vaak zijn deze kwalitatieve foto’s van een grotere bestandsgrootte. Hierdoor kan de website ontzettend traag worden. Kies daarom een externe editor, als bijvoorbeeld Photoshop, om de afbeeldingen aan te passen en naar het gewenste formaat. Zo kun je bijvoorbeeld logo’s van merken prima opmaken in een formaat van 600 x 600 pixels. Wanneer je dit hebt gedaan, kun je de afbeeldingen gaan comprimeren. Hier heb je veel gemakkelijke programma’s voor. Een programma dat wij veel gebruiken is TinyJPG. Een groot voordeel hiervan, is dat je gemakkelijk jouw PNG, JPG & WebP afbeeldingen hierin kunt slepen om deze nog kleiner te maken.

 

Afbeelding optimalisatie met SEO

Nadat je de basis van de afbeeldingen goed hebt ingesteld, zul je al verschil gaan merken in de snelheid van je website. Een ander cruciaal onderdeel om mee te nemen bij afbeelding optimalisatie, is correct SEO gebruik. In de blog “10 SEO tips voor jouw webwinkel“, hebben we het al eens gehad over jouw afbeeldingen optimaliseren voor seo op je website.

  • Afbeeldingstitel

    Het is van belang om SEO afbeeldingen een naam geven. De bestandsnaam is namelijk dé plek om het zoekwoord waarop je de afbeelding wilt optimaliseren toe te voegen. Belangrijk om hierbij te onthouden, is dat deze naam zowel voor de zoekmachine als voor de mensen leesbaar moet zijn. Gebruik daarom normale woorden met spaties, zonder streepjes.

    BEWISE Solutions - Afbeelding title

  • Alt-attributen toevoegen

    Voeg je alt tag in. Dit is een tekst die wordt getoond wanneer jouw afbeelding niet wordt geladen. Deze kan vaak hetzelfde zijn als jouw afbeeldingstitel.

    Bewise Solutions - Afbeelding alt tekst

    Daarnaast voeg je een alt-tekst toe. Dit is een korte omschrijving van de afbeelding. Deze tekst helpt de zoekmachines niet alleen om de inhoud van de afbeelding te bepalen, maar ook om het onderwerp te vinden van de tekst eromheen. Daarnaast wordt deze tekst ook omschreven voor mensen die niet goed kunnen zien. Hoe zou jij de afbeelding omschrijven als de bezoeker deze niet kan zien?

    BEWISE Solutions - Afbeelding beschrijving

  • Relevante afbeeldingen

    Zorg ervoor dat jouw afbeeldingen relevant zijn bij jouw onderwerp. Zo zit er een rode draad in de algehele content, wat jouw mogelijkheid tot hoog ranken in de zoekmachines vergroot.

 

Nu heb jij de handvatten om jouw afbeeldingen te optimaliseren. Mocht je na het lezen van dit artikel meer willen weten wat we kunnen doen voor je? Neem dan contact met ons op voor een vrijblijvende afspraak.

 

Neem contact op

en kom bij ons op de koffie

Een vraag of een wens?

Laat dan een bericht achter op het formulier en we zullen spoedig met je contact opnemen. Wil je meer contact informatie? Klik dan op lees meer hieronder of bel anders even.

"*" geeft vereiste velden aan

Dit veld is bedoeld voor validatiedoeleinden en moet niet worden gewijzigd.