Je vraagt je misschien af hoe je WebP-afbeeldingen in WordPress kunt gebruiken. Door over te schakelen naar het WebP-formaat kun je de bestandsgrootte van afbeeldingen aanzienlijk verkleinen zonder kwaliteitsverlies, wat helpt om pagina's sneller te laden en de algehele gebruikerservaring te verbeteren. In deze handleiding bespreken we praktische methoden om WebP-afbeeldingen effectief te implementeren op je WordPress-site. 

WebP is een modern afbeeldingsformaat, ontwikkeld door Google, dat een betere compressie biedt dan formaten zoals JPEG en PNG . Naast snellere laadtijden kan het gebruik van WebP ook een positieve invloed hebben op SEO, de serverbandbreedte verminderen en ervoor zorgen dat uw website optimaal functioneert op verschillende apparaten en browsers. Dit artikel begeleidt u door verschillende benaderingen, waaronder plug-ins en serverinstellingen, om een ​​naadloze overgang te garanderen.

Wat is een WebP-afbeelding?

WebP is een modern afbeeldingsformaat dat door Google speciaal voor het web is ontwikkeld. Het belangrijkste voordeel is dat het veel kleinere bestanden produceert dan traditionele formaten zoals JPEG en PNG, doorgaans 25-35% kleiner, met behoud van dezelfde beeldkwaliteit. Dit betekent dat uw website sneller kan laden zonder dat de beeldkwaliteit eronder lijdt, wat vooral gunstig is voor websites met veel afbeeldingen, zoals blogs, portfolio's of webwinkels.

WebP ondersteunt zowel compressie met als zonder kwaliteitsverlies, evenals functies zoals transparantie en animatie, waardoor het een veelzijdig alternatief is voor diverse oudere formaten. Door de bestandsgrootte van afbeeldingen te verkleinen, draagt ​​WebP bij aan betere websiteprestaties, een lager bandbreedtegebruik en een soepelere gebruikerservaring.

De meeste moderne browsers ondersteunen WebP, waaronder Chrome, Firefox, Edge, Opera en Safari (iOS 14 en later), die samen ongeveer 95% van de internetgebruikers dekken. Slechts een klein deel van de oudere browsers, zoals Internet Explorer of oudere versies van Safari, ondersteunt WebP niet. In die gevallen kunnen websites JPEG- of PNG-afbeeldingen als alternatief gebruiken om ervoor te zorgen dat iedereen de foto's correct kan zien.

Hoe WebP-afbeeldingen te gebruiken in WordPress

Het gebruik van WebP-afbeeldingen in WordPress is een slimme manier om de snelheid en algehele prestaties van je website te verbeteren. Door dit moderne afbeeldingsformaat te gebruiken, kun je kleinere, hoogwaardige afbeeldingen weergeven die sneller laden voor bezoekers, waardoor zowel de gebruikerservaring als de SEO .

In dit gedeelte bespreken we verschillende praktische methoden om WebP-afbeeldingen op je WordPress-site te implementeren.

WebP-afbeeldingen gebruiken in WordPress met EWWW Optimizer

EWWW Image Optimizer is een van de beste WordPress-plugins voor beeldcompressie. Het verkleint niet alleen de bestandsgrootte van afbeeldingen, maar ondersteunt ook het WebP-formaat. Het kan WebP-afbeeldingen automatisch naar compatibele browsers sturen, waardoor uw website sneller laadt en beter presteert.

De eerste stap is het installeren en activeren van de EWWW Image Optimizer-plugin. Ga na activering naar Instellingen > EWWW Image Optimizer om de opties te configureren.

Ga in het instellingenscherm naar beneden en schakel de 'WebP-conversie' . Klik vervolgens op 'Wijzigingen opslaan' om uw configuratie op te slaan.

Ga vervolgens naar het gedeelte WebP-conversie, waar de plugin een aantal herschrijfregels met een rode voorbeeldafbeelding weergeeft. Klik op 'Herschrijfregels invoegen' om deze regels automatisch aan uw .htaccess-bestand toe te voegen.

Als het lukt, wordt de voorbeeldafbeelding groen en krijgt deze het label "WebP".

Om eerder geüploade afbeeldingen naar WebP te converteren, ga je naar Media > Bibliotheek en schakel je over naar de lijstweergave. Pas het aantal items per pagina aan via Schermopties om meerdere foto's tegelijk te selecteren. Schakel het selectievakje Alles selecteren in, kies Bulkoptimalisatie in het vervolgkeuzemenu en klik op Toepassen.

Met de plugin kunt u compressie overslaan en afbeeldingen alleen naar WebP converteren als ze al geoptimaliseerd zijn. Klik op 'Scannen naar niet-geoptimaliseerde afbeeldingen' en vink 'Alleen WebP' aan.

Zodra dit is voltooid, genereert EWWW WebP-versies voor alle geselecteerde afbeeldingen.

Om te controleren of WebP-afbeeldingen correct worden weergegeven, opent u een bericht met meerdere afbeeldingen. Klik met de rechtermuisknop op een afbeelding en selecteer 'Openen in nieuw tabblad'. Als de URL eindigt op .webp, betekent dit dat uw WordPress-site WebP-afbeeldingen correct weergeeft.

WebP-afbeeldingen gebruiken in WordPress met ShortPixel

ShortPixel is een van de meest gebruikte WordPress-plugins voor beeldoptimalisatie. De plugin is ontworpen om afbeeldingen die naar je website worden geüpload automatisch te verkleinen en te comprimeren. Een van de functies is dat je afbeeldingen kunt converteren naar WebP-formaat en deze kunt weergeven in browsers die dit moderne formaat ondersteunen, waardoor de laadsnelheid van de pagina en de algehele prestaties verbeteren.

De plugin telt elke geoptimaliseerde afbeeldingsgrootte als een credit. Dit betekent dat het optimaliseren van meerdere miniatuurformaten voor één afbeelding meerdere credits kan kosten. Er zijn geen beperkingen qua bestandsgrootte en u kunt uw ShortPixel-credits verdelen over een onbeperkt aantal websites, allemaal onder hetzelfde ShortPixel-account. Dit maakt het beheer van meerdere websites flexibel.

Om WebP-afbeeldingen met ShortPixel te kunnen weergeven, moet je de plugin installeren via WordPress.org.

Voer vervolgens uw API-sleutel in, die u kunt verkrijgen door een gratis ShortPixel-account aan te maken.

Op het tabblad Algemene instellingen kunt u basisoptimalisatievoorkeuren configureren, zoals compressieniveau en het formaat van afbeeldingen aanpassen. Om WebP-levering mogelijk te maken, schakelt u de Geavanceerde modus in. Schakel vervolgens 'WebP-afbeeldingen maken' en 'WebP/AVIF-afbeeldingen serveren...' en selecteer daarna de optie ' Tagsyntaxis gebruiken' . Klik ten slotte op 'Opslaan '.

WebP-afbeeldingen gebruiken in WordPress met Imagify

Imagify is een plugin voor beeldoptimalisatie voor WordPress, ontwikkeld door het team achter WP Rocket, een toonaangevende caching-plugin. Het biedt een eenvoudige manier om afbeeldingen te comprimeren en om te zetten naar het WebP-formaat voor snellere laadtijden en betere prestaties.

Om te beginnen installeer en activeer je de Imagify-plugin op je WordPress-website. 

Na activering ga je naar Instellingen > Imagify om de plugin te configureren. Klik op "Een gratis API-sleutel aanmaken" en geef een geldig e-mailadres op. Je ontvangt een e-mail met je API-sleutel. Kopieer en plak deze in de plugininstellingen en klik vervolgens op "Wijzigingen opslaan".

Ga vervolgens naar het gedeelte 'Optimalisatie', klik op 'WEBP' en schakel dit in, samen met 'Afbeeldingen in Next-GEN-formaat op de site weergeven'.

Imagify biedt twee methoden voor het leveren van WebP-afbeeldingen: de .htaccess-methode en de tagmethode. De .htaccess-methode is sneller, maar werkt mogelijk niet als u een CDN gebruikt, terwijl de tagmethode compatibel is met CDN's, maar mogelijk conflicten kan veroorzaken met sommige thema's. Kies de methode die het beste bij uw configuratie past en klik op "Opslaan en naar Bulk Optimizer gaan".

Op de Media > Bulkoptimalisatie start de plugin automatisch met het verwerken van alle afbeeldingen op de achtergrond. Als uw site veel foto's bevat, kan dit proces enige tijd duren.

Om te controleren of WebP-afbeeldingen correct worden weergegeven, opent u een bericht of pagina met foto's, klikt u met de rechtermuisknop op een afbeelding en selecteert u 'Afbeelding openen in nieuw tabblad'. De URL van de afbeelding moet eindigen op .webp, wat bevestigt dat Imagify WebP-versies succesvol op uw WordPress-site weergeeft.

Naast het optimaliseren van afbeeldingen met plugins, kunt u overwegen om WP Media Folder om uw WordPress-mediabibliotheek beter te beheren. Deze plugin helpt bij het organiseren van afbeeldingen in mappen, waardoor het gemakkelijker wordt om grote hoeveelheden media te beheren. Bovendien integreert de plugin naadloos met plugins voor beeldoptimalisatie, zodat uw WebP-bestanden altijd correct worden beheerd.

Voordelen van WebP voor prestatieoptimalisatie

WebP is een modern afbeeldingsformaat dat is ontworpen om de prestaties van websites te verbeteren door de bestandsgrootte te verkleinen zonder kwaliteitsverlies. Het gebruik van WebP op WordPress-sites zorgt ervoor dat pagina's sneller laden, biedt een soepelere browse-ervaring en verlaagt het bandbreedtegebruik, waardoor het een waardevol hulpmiddel is voor websiteoptimalisatie.

Kleinere bestandsgroottes

WebP-afbeeldingen zijn aanzienlijk kleiner dan traditionele formaten zoals JPEG en PNG, waardoor de bestandsgrootte vaak met 25-35% wordt gereduceerd met behoud van dezelfde beeldkwaliteit. Deze kleinere bestandsgrootte zorgt ervoor dat webpagina's sneller laden, wat vooral belangrijk is voor sites met veel afbeeldingen, zoals portfolio's, webshops of fotografieblogs.

Kleinere bestanden helpen ook bij het beheren van de opslagruimte op uw hosting server. Door de afbeeldingsgroottes te optimaliseren, vermindert u de totale gebruikte schijfruimte, waardoor back-ups sneller en efficiënter verlopen en uw website soepel blijft draaien.

Snellere paginalading

Omdat WebP-afbeeldingen lichter zijn, kunnen browsers ze sneller downloaden, wat de laadtijden van pagina's direct verkort. Dit is cruciaal voor de gebruikerservaring, aangezien traag ladende pagina's bezoekers vaak frustreren en het bouncepercentage verhogen, met name op mobiele apparaten met een trage internetverbinding.

Snellere laadtijden maken het ook gemakkelijker om andere prestatieverbeteringen door te voeren, zoals lazy loading en caching, omdat de afbeeldingen zelf geen knelpunt meer vormen. Dit zorgt ervoor dat uw website responsief en naadloos aanvoelt voor gebruikers.

Betere SEO-prestaties

De laadsnelheid van een website is een cruciale factor voor de ranking in zoekmachines, en het gebruik van WebP kan een positieve invloed hebben op je SEO. Sneller ladende pagina's verbeteren de gebruikersbetrokkenheid, zoals de tijd die bezoekers op de site doorbrengen en een lager bouncepercentage. Zoekmachines interpreteren dit als signalen van kwalitatief hoogwaardige content.

Daarnaast maakt WebP het voor websites mogelijk om hoogwaardige afbeeldingen te behouden zonder prestatieverlies. Dit betekent dat je aantrekkelijke, gedetailleerde afbeeldingen kunt gebruiken zonder je SEO in gevaar te brengen. Deze balans tussen esthetiek en snelheid helpt om meer bezoekers aan te trekken en te behouden.

Verminderde bandbreedte en serverbelasting

Kleinere WebP-bestanden verbruiken minder bandbreedte, wat vooral gunstig is voor websites met veel verkeer. Door de hoeveelheid data die per paginaweergave wordt verzonden te verminderen, kunnen de hostingkosten dalen en wordt serveroverbelasting tijdens piekuren voorkomen.

Een lagere serverbelasting verbetert ook de algehele betrouwbaarheid van de website. Doordat er minder gebruik wordt gemaakt van de serverbronnen, blijven pagina's toegankelijk en snel, zelfs wanneer meerdere gebruikers tegelijkertijd de site bezoeken. Dit zorgt voor een betere gebruikerservaring voor iedereen.

Ondersteunt moderne webfuncties

WebP ondersteunt zowel compressie met als zonder kwaliteitsverlies, evenals functies zoals transparantie en animatie. Deze veelzijdigheid maakt het mogelijk om meerdere oudere afbeeldingsformaten te vervangen, waardoor het beheer van afbeeldingen wordt vereenvoudigd en de kwaliteit behouden blijft.

Door moderne functies te ondersteunen, stelt WebP websites in staat geavanceerde visuele effecten te gebruiken zonder dat dit ten koste gaat van de prestaties. Ontwerpers kunnen afbeeldingen van hoge kwaliteit, animaties of transparante overlays integreren, terwijl de laadsnelheid van de pagina geoptimaliseerd blijft.

Conclusie

Het gebruik van WebP-afbeeldingen in WordPress kan de snelheid, efficiëntie en algehele prestaties van uw website aanzienlijk verbeteren. Door uw foto's naar het WebP-formaat te converteren, verkleint u de bestandsgrootte zonder verlies van beeldkwaliteit. Dit zorgt ervoor dat pagina's sneller laden, de server minder belast wordt en bezoekers een soepelere ervaring hebben op alle apparaten. De implementatie van WebP vormt bovendien een aanvulling op andere optimalisatiestrategieën, zoals caching en het gebruik van een CDN, om ervoor te zorgen dat uw WordPress-site efficiënt blijft draaien.

Over het algemeen biedt het gebruik van WebP-afbeeldingen meerdere voordelen, waaronder snellere laadtijden, verbeterde SEO, minder bandbreedtegebruik en ondersteuning voor moderne webfuncties zoals transparantie en animatie. Of u nu plugins zoals EWWW Optimizer, ShortPixel of Imagify gebruikt, of servergebaseerde oplossingen implementeert, overschakelen naar WebP zorgt ervoor dat uw website er visueel aantrekkelijk blijft uitzien en optimaal presteert voor alle gebruikers. Voor een nog beter beheer van uw mediabibliotheek WP Media Folder overwegen om uw afbeeldingen efficiënt te organiseren en WebP-optimalisatie nog eenvoudiger te maken.