Handleiding

Next-Gen Images

Zet afbeeldingen om naar WebP of AVIF, zodat je WordPress-site sneller laadt, zonder dat je ze één voor één hoeft aan te passen.

Wat het doet

Foto’s en afbeeldingen zijn meestal het zwaarste onderdeel van een pagina. WebP en AVIF zijn nieuwere formaten die bij dezelfde kwaliteit veel kleiner zijn dan JPEG en PNG. Next-Gen Images zet je afbeeldingen daar automatisch naartoe om.

Nieuwe uploads worden meteen omgezet, inclusief alle thumbnails die WordPress aanmaakt.
Bestaande afbeeldingen zet je in één keer om, op de achtergrond. Alle verwijzingen in je pagina’s worden vanzelf bijgewerkt.
Te grote afbeeldingen worden verkleind (standaard maximaal 2560 pixels) en foto’s blijven goed gedraaid.
Oude links naar de .jpg of .png blijven werken dankzij automatische doorverwijzingen.
Terugdraaien kan als je het origineel hebt bewaard.
AVIF met WebP-terugval levert de kleinste bestanden aan browsers die dat aankunnen en WebP aan de rest.
Statistieken laten zien hoeveel ruimte je bespaart, op de instellingenpagina en in een blok op het WordPress-dashboard.

Wat er niet gebeurt

Animated GIF’s, SVG’s en afbeeldingen die al WebP of AVIF zijn blijven ongemoeid. Alleen JPEG en PNG worden omgezet.

Installeren

Vereisten

WordPress 5.8 of nieuwer. Voor AVIF is WordPress 6.5 of nieuwer nodig.
PHP 7.4 of nieuwer.
Een server met Imagick of GD die WebP kan maken. Voor AVIF moet de server ook AVIF ondersteunen. De plugin meldt het zelf als iets ontbreekt.

Stappen

Next-Gen Images is er voor klanten van STRYV. Wij installeren de plugin voor je. Heb je het zipbestand (next-gen-images.zip) van ons gekregen en wil je hem zelf installeren? Dan werkt het zo:

Ga in WordPress naar Plugins › Nieuwe plugin › Plugin uploaden en kies de zip.
Klik op Activeren.
Open Next-Gen Images in het beheermenu aan de linkerkant.

Upgraden van “Auto WebP Optimizer”?

Deactiveer de oude versie en activeer daarna Next-Gen Images. Je instellingen, statistieken, bewaarde originelen en redirects blijven behouden. Verwijder de oude versie niet, want dat wist die gegevens.

Het scherm in vogelvlucht

Alle instellingen staan op één pagina, in overzichtelijke blokken. Bovenaan zie je de besparing, rechts de voortgang van de bulkconversie, de updates en de serverchecks. De standaardwaarden werken voor de meeste sites goed.

Wijzig je iets, dan zie je onderaan dat er niet-opgeslagen wijzigingen zijn. Met Standaard herstellen zet je alle velden terug op de standaardwaarden. Opslaan moet je daarna nog zelf.

Instellingen

Formaat

Kies uit drie tegels in welk formaat afbeeldingen worden opgeslagen. WebP is snel en overal ondersteund en heeft daarom het label Aanbevolen. AVIF is vaak 20 tot 30% kleiner, maar het omzetten kost meer tijd en geheugen en browsers zonder AVIF tonen de afbeelding niet. AVIF + WebP levert beide, zie hieronder. Is AVIF niet beschikbaar op je server, dan wordt WebP gebruikt.

Kwaliteit

Met de schuifbalk stel je de kwaliteit in tussen 1 en 100. Lager is een kleiner bestand. Het formaat dat je gebruikt is gemarkeerd, het andere is grijs.

WebP: waarden van 75 tot 82 geven meestal de beste verhouding tussen kwaliteit en grootte.
AVIF: heeft een lager getal nodig voor dezelfde zichtbare kwaliteit. 50 tot 65 is vergelijkbaar met WebP 80.

Maximale afmeting

Afbeeldingen die groter zijn dan de ingestelde afmeting worden verkleind aan de langste zijde. Kies 1920, 2560 of 3840 pixels, of vul een eigen waarde in. Met Niet verkleinen (0) blijft de afmeting staan.

Gedrag

Instelling	Standaard	Wat het doet
Automatisch converteren	Aan	Zet nieuwe JPEG- en PNG-uploads meteen om, inclusief alle thumbnails.
Origineel bewaren	Uit	Bewaart het originele bestand op de server, zodat je later kunt terugdraaien. Kost extra opslagruimte.
Oude links doorsturen	Aan	Stuurt oude `.jpg`– en `.png`-links door (301) naar de nieuwe afbeelding. Behoudt je SEO.

Wil je kunnen terugdraaien?

Zet Origineel bewaren dan aan vóórdat je afbeeldingen converteert. Het bewaren geldt alleen voor afbeeldingen die daarna worden omgezet.

AVIF met WebP-terugval

Kies je het formaat AVIF + WebP, dan blijft WebP het hoofdbestand van elke afbeelding. Daarnaast maakt de plugin per bestand (en per thumbnail) een AVIF met dezelfde naam. Op je site geeft de plugin die samen door met een <picture>-element: browsers die AVIF kunnen tonen laden de AVIF, alle andere browsers laden de WebP.

Veilig: omdat WebP het hoofdbestand is, blijven links, de database, redirects en terugdraaien werken zoals altijd. Mist er ergens een AVIF, dan krijgt de bezoeker gewoon de WebP.
Nieuwe uploads: de WebP is meteen klaar. De AVIF-extra’s worden kort daarna op de achtergrond gemaakt, zodat uploaden niet vertraagt.
Bestaande afbeeldingen: converteer eerst je JPEG’s en PNG’s. Staan er al WebP-afbeeldingen in je bibliotheek, dan verschijnt in het blok Bestaande afbeeldingen de knop Maak AVIF-extra’s. Of gebruik wp awo avif.
Alleen waar het loont: is een AVIF niet kleiner dan de WebP, dan wordt hij weggegooid en blijft het bij de WebP.
Terug naar alleen WebP: kies je weer WebP, dan worden de AVIF-bestanden niet meer gebruikt. Met AVIF-extra’s verwijderen ruim je ze op.

Dit kost extra opslagruimte en rekentijd

Je hebt twee bestanden per afbeelding en het omzetten duurt langer. De AVIF-extra’s worden gemaakt van de WebP, niet van het origineel. Op goedkope hosting kan het geheugen tekortschieten bij zeer grote afbeeldingen.

Goed om te weten

De plugin zet <img>-tags in de uitvoer van je pagina’s in een <picture>. Afbeeldingen die als CSS-achtergrond worden geladen, blijven WebP. Sliders en lazy-load-scripts die het src pas later invullen, worden niet omgezet.
Past een thema zijn opmaak aan via een selector als figure > img, controleer dan even je belangrijkste pagina’s. Wil je het element helemaal uitzetten, voeg dan toe aan je thema: add_filter( 'ngi_picture_output', '__return_false' );
Gebruik je een cachingplugin of CDN? De omgezette pagina wordt gecached zoals gewoonlijk. Leeg de cache na het omschakelen.
De besparing in de statistieken gaat over het WebP-hoofdbestand. De extra winst van de AVIF-bestanden wordt niet apart meegeteld.

Nieuwe uploads

Zodra je een JPEG of PNG uploadt, gebeurt dit vanzelf:

De afbeelding wordt, indien nodig, verkleind tot de ingestelde maximale afmeting.
Hij wordt omgezet naar WebP of AVIF met de ingestelde kwaliteit.
WordPress maakt alle thumbnails aan, ook in dat formaat.

Is het nieuwe bestand niet kleiner dan het origineel, en is de afbeelding niet verkleind, dan blijft het origineel staan. Je krijgt dus nooit een grotere afbeelding.

Bestaande afbeeldingen omzetten

Maak eerst een back-up

Deze actie past je database en uploads-map aan. Zonder Origineel bewaren kun je het niet terugdraaien.

Controleer je instellingen en sla ze op. De huidige instellingen worden gebruikt.
Klik rechts onder Bestaande afbeeldingen op Converteer bestaande afbeeldingen en bevestig.
Je ziet een voortgangsbalk. Je kunt de pagina sluiten: de conversie gaat door op de achtergrond.

Wat er allemaal wordt bijgewerkt

De afbeelding zelf en alle thumbnails, opnieuw aangemaakt in het nieuwe formaat.
Verwijzingen in berichten, pagina’s en samenvattingen.
Verwijzingen in aangepaste velden en opties, ook in JSON-data van bijvoorbeeld Elementor en in geserialiseerde data.
Na afloop worden bekende caches geleegd: Elementor, LiteSpeed, WP Rocket, W3 Total Cache, WP Super Cache en Autoptimize.

Overgeslagen afbeeldingen

Afbeeldingen waarvan de omzetting niet kleiner uitvalt, of die niet gelezen kunnen worden, worden overgeslagen. Verander je later de kwaliteit, dan kun je ze met Overgeslagen opnieuw proberen nogmaals laten verwerken. Met Stop onderbreek je de taak. Je kunt hem later gewoon opnieuw starten.

Hoe werkt “op de achtergrond”?

De plugin gebruikt WP-Cron en werkt in porties van ongeveer 20 seconden. Staat WP-Cron uit op jouw site, dan zorgt de geopende instellingenpagina dat de taak doorloopt. Voor grote sites is WP-CLI de beste keuze.

AVIF vraagt veel van je server

Het omzetten naar AVIF is zwaar. Op goedkope hosting kan het geheugen of de uitvoertijd tekortschieten. Begin dan met WebP, of gebruik WP-CLI.

Terugdraaien

Terugdraaien kan voor afbeeldingen waarvan je het origineel hebt bewaard.

Eén afbeelding: open de mediabibliotheek in lijstweergave. In de kolom Optimalisatie staat bij elke omgezette afbeelding de besparing, en een link Herstel origineel. In de rasterweergave vind je dezelfde informatie in de details van de afbeelding.
Alles tegelijk: klik op de instellingenpagina op Herstel alle originelen.

Bij herstellen komt het originele bestand terug, worden de thumbnails opnieuw gemaakt, worden de verwijzingen in je content teruggezet en worden de WebP- en AVIF-bestanden (ook de AVIF-extra’s) verwijderd. Een hersteld bestand wordt niet automatisch opnieuw omgezet.

Redirects

Na een bulk-conversie bestaan de oude .jpg– en .png-bestanden niet meer, tenzij je het origineel bewaart. Links van buiten je site naar die bestanden, zoals Google Afbeeldingen, andere websites of mails, zouden dan een foutmelding geven.

Daarom stuurt de plugin zulke verzoeken door met een permanente (301) doorverwijzing naar de nieuwe afbeelding. Dat behoudt ook je SEO. Dit staat standaard aan en kan in de instellingen uit.

Redirects werken alleen als je server verzoeken voor ontbrekende bestanden doorgeeft aan WordPress. Dat is bij de standaardinstellingen van Apache en nginx het geval.

Statistieken en dashboard

Bovenaan de instellingenpagina zie je in drie kaarten hoeveel je hebt bespaard (met een ring in procenten), hoeveel afbeeldingen WebP of AVIF zijn, en het totaal vóór en na. In de mediabibliotheek staat per afbeelding de besparing.

De cijfers gaan over het hoofdbestand van elke afbeelding. De thumbnails worden ook kleiner, maar die tellen niet mee. Afbeeldingen die al WebP of AVIF waren toen ze werden toegevoegd, tellen wel mee in de aantallen, maar niet in de besparing: van die afbeeldingen is het origineel niet bekend. Een korte melding onder de balken laat dan zien om hoeveel afbeeldingen het gaat.

Blok op het dashboard

Op het WordPress-dashboard (het scherm direct na het inloggen) staat een blok Next-Gen Images, zichtbaar voor beheerders. Je ziet daar in één oogopslag:

hoeveel je hebt bespaard, in procenten en in MB of GB;
het aantal geoptimaliseerde afbeeldingen, het aantal WebP en AVIF en het aantal bewaarde originelen;
de voortgang van een lopende conversie, die vanzelf bijwerkt;
een melding bij overgeslagen afbeeldingen of problemen met de server;
een knop om de conversie te starten of te pauzeren, en een link naar de instellingen.

Zoals elk dashboardblok kun je het verslepen, inklappen of verbergen via Scherminstellingen bovenaan het dashboard.

Serverchecks

Op de instellingenpagina staat rechts een lijst met controles: WebP- en AVIF-ondersteuning, PHP- en WordPress-versie, WP-Cron en de geheugenlimiet. Bovenin de paginakop toont een label Alles werkt, Let op of Niet beschikbaar.

WP-CLI

Heb je veel afbeeldingen, of toegang tot de command line? Dan zijn deze commando’s de snelste en betrouwbaarste manier:

wp awo convert [--limit=<aantal>]   # bestaande afbeeldingen omzetten
wp awo avif [--limit=<aantal>]      # AVIF-extra’s maken naast bestaande WebP’s
wp awo restore [--limit=<aantal>]   # bewaarde originelen terugzetten
wp awo stats                        # besparing tot nu toe

Met --limit verwerk je een beperkt aantal per keer, handig om eerst te testen.

Updates

Next-Gen Images werkt zichzelf bij via GitHub. Nieuwe versies verschijnen onder Dashboard › Updates en in de pluginlijst, net als bij plugins uit de officiële plugin-directory. Je kunt met één klik updaten, of in de pluginlijst automatische updates inschakelen.

WordPress controleert zelf regelmatig op een nieuwe versie. De plugin vraagt GitHub hooguit eens per zes uur.
Wil je direct controleren? Klik op Controleer op updates in de pluginlijst of op de instellingenpagina.
Er wordt alleen contact gemaakt met de publieke GitHub-API. Er worden geen gegevens over je site verstuurd.
Bij elke update zie je onder Details bekijken wat er is veranderd.

Veelgestelde vragen

Er staat dat mijn server geen WebP of AVIF ondersteunt.

Je server mist Imagick of GD met WebP-ondersteuning. Vraag je hoster dit in te schakelen. Voor AVIF is bovendien WordPress 6.5 of nieuwer nodig, en op GD ook PHP 8.1 of nieuwer.

Ik koos AVIF, maar er komt WebP uit.

Dan ondersteunt je server of je WordPress-versie AVIF niet. Op de instellingenpagina staat in dat geval een waarschuwing. De plugin valt dan automatisch terug op WebP, zodat uploads niet mislukken.

Een afbeelding is niet omgezet.

Dat gebeurt als het resultaat niet kleiner is dan het origineel, bijvoorbeeld bij een al sterk gecomprimeerd bestand, of als het bestand niet gelezen kan worden. De afbeelding blijft dan zoals hij was. Na een wijziging van de kwaliteit kun je hem opnieuw laten proberen.

De conversie lijkt vast te zitten.

Staat WP-Cron uit op je site, dan loopt de taak alleen door zolang de instellingenpagina openstaat. Open de pagina opnieuw, of gebruik wp awo convert. Gaat het geheugen of de uitvoertijd op, dan helpt het om eerst WebP te gebruiken en de kwaliteit of maximale afmeting te verlagen.

Mijn afbeeldingen zien er na de conversie nog hetzelfde uit op de site.

Leeg je cache, bij je cachingplugin, je CDN en je browser. De plugin leegt bekende cachingplugins na een bulk-conversie, maar niet elke CDN.

Werkt het met Elementor en andere paginabouwers?

Ja. Verwijzingen in de opgeslagen data van paginabouwers worden meegenomen, ook in JSON. Verwijzingen die in een PHP-object zijn opgeslagen worden bewust met rust gelaten om data niet te beschadigen. Controleer na een bulk-conversie dus even je belangrijkste pagina’s, zoals de header, het logo en sliders.

Ondersteunen alle browsers WebP en AVIF?

WebP wordt door alle gangbare browsers ondersteund. AVIF ook door de huidige versies van de grote browsers, maar niet door heel oude. Kies je alleen AVIF, dan zien bezoekers met zo’n oude browser de afbeelding niet. Met AVIF + WebP krijgen zij gewoon de WebP.

Ik koos AVIF + WebP, maar zie geen <picture> op mijn site.

Controleer of er AVIF-bestanden bestaan: zie het getal bij “met AVIF-extra” op de instellingenpagina, en start zo nodig Maak AVIF-extra’s. Alleen afbeeldingen waarvoor alle gebruikte bestanden een AVIF hebben worden omgezet. Staat er een cachingplugin op, leeg dan de cache. Is ngi_picture_output uitgezet in je thema, dan blijft de uitvoer ook ongewijzigd.

Waarom staat er 0,0 B bespaard terwijl er afbeeldingen zijn?

De besparing wordt alleen berekend voor afbeeldingen die de plugin zelf van JPEG of PNG heeft omgezet. Waren je afbeeldingen al WebP of AVIF toen je ze toevoegde, dan is het origineel niet bekend. Ze tellen mee in de aantallen, maar niet in de besparing.

Verwijderen

Deactiveren laat alles staan. Verwijder je de plugin helemaal, dan worden instellingen, statistieken, de koppeling met bewaarde originelen en de redirects gewist. Bewaarde originele bestanden en AVIF-extra’s blijven in je uploads-map staan, maar kunnen daarna niet meer automatisch worden hersteld of opgeruimd. Haal dus eerst zo nodig je originelen terug en gebruik AVIF-extra’s verwijderen als je die niet wilt houden.

Kom je er niet uit?

Als klant van STRYV kun je altijd even bellen of mailen. We denken graag mee.

Mail STRYV

Bel 0495 234 444