INP verbeteren op een WordPress site met Elementor, zo pak je het aan

Kort antwoord. INP verbeteren op WordPress betekent vooral minder JavaScript laten draaien op het moment dat iemand klikt, tikt of typt. Bij Elementor sites zitten de grootste vertragers meestal in zware widgets, popups, sliders, chatwidgets en tracking scripts. Schrap wat niet nodig is, stel de rest uit en controleer het effect in Search Console met echte gebruikersdata.

Wat meet INP en waarom telt het?

INP staat voor Interaction to Next Paint. Het is sinds maart 2024 een van de drie Core Web Vitals, naast LCP en CLS. INP meet hoe snel een pagina zichtbaar reageert na een interactie. Denk aan het openen van een menu, het klikken op een tab of het invullen van een formulierveld.

Chrome meet alle interacties tijdens een bezoek en rapporteert grofweg de traagste. Google kijkt daarna naar de waarde die 75 procent van de bezoeken haalt.

Core Web Vitals zijn een rankingsignaal, maar geen doorslaggevend signaal. Een goede INP tilt zwakke content niet omhoog. De echte winst zit bij bezoekers. Een menu dat een halve seconde hapert, voelt kapot, zeker op een eenvoudige Android telefoon. Juist daar valt je INP het slechtst uit.

Waarom hebben Elementor sites vaak een trage INP?

Elementor zelf is zelden het hele probleem. Het probleem is wat er in de loop der jaren omheen groeit.

Een grote DOM

Elke sectie, kolom en widget voegt HTML elementen toe. Oudere Elementor pagina’s met geneste secties hebben snel duizenden elementen. Bij veel interacties moet de browser de opmaak daarvan opnieuw berekenen. Hoe groter de pagina, hoe langer dat duurt.

Te veel scripts van plugins

Addon pakketten voor Elementor laden vaak hun scripts op elke pagina, ook als je de widget maar op één pagina gebruikt. Tel daar een slider plugin, een popup builder, een formulierplugin en een chatwidget bij op. Dan staat de hoofdthread van de browser constant bezet.

Tracking en externe tags

Tag Manager met tien tags, een heatmap tool, een Meta pixel en een cookiebanner draaien allemaal op dezelfde hoofdthread. Klikt een bezoeker terwijl die scripts bezig zijn, dan wacht de klik gewoon. Dat heet input delay, en het is een van de drie delen waaruit INP bestaat. De andere twee zijn de verwerkingstijd van je eigen code en de tijd die de browser nodig heeft om het resultaat te tekenen.

Hoe vind je de oorzaak van een slechte INP?

Begin bij data van echte bezoekers, niet bij een labtest. Lighthouse kan INP namelijk niet meten, omdat er tijdens die test niemand klikt. Het toont Total Blocking Time als benadering.

• Search Console. Het rapport Core Web Vitals groepeert URL’s met hetzelfde probleem. Zo zie je of het om één template gaat of om de hele site.
• PageSpeed Insights. Bovenaan staat de veldwaarde uit het Chrome User Experience Report, mits de pagina genoeg verkeer heeft. Daaronder volgt de labtest.
• Chrome DevTools. Het Performance paneel toont live je INP terwijl je zelf klikt. Zet CPU vertraging aan om een gemiddelde telefoon na te bootsen.

In DevTools klik je daarna precies op het element dat traag reageert, bijvoorbeeld de mobiele menuknop. De opname laat zien welk script de tijd opslokt. Vaak is dat een plugin waarvan niemand meer weet waarom die er staat.

Welke stappen verbeteren INP op WordPress het meest?

1. Ruim plugins op. Deactiveer alles wat geen duidelijke functie meer heeft. Vervang zware addon pakketten door losse widgets die je echt gebruikt.
2. Zet de prestatiefuncties van Elementor aan. In de instellingen vind je onder meer geoptimaliseerde DOM output, verbeterd laden van assets en de flexbox container. Bouw nieuwe pagina’s met containers in plaats van geneste secties.
3. Laad scripts alleen waar ze nodig zijn. Met een plugin als Perfmatters of Asset CleanUp schakel je per pagina scripts uit. Het formulierscript hoort op de contactpagina, niet op elke blogpost.
4. Stel niet kritieke scripts uit. WP Rocket en Perfmatters kunnen JavaScript pas laden na de eerste interactie. Test dit goed, want de eerste klik kan juist trager worden als dan alles tegelijk inlaadt.
5. Kijk kritisch naar Tag Manager. Verwijder tags van tools die niemand meer gebruikt en laat zware tags pas later afgaan.
6. Vervang zware effecten. Animaties bij scrollen, parallax en sliders die automatisch draaien kosten veel rekenwerk. Vaak doet een statische sectie hetzelfde werk.

Snellere hosting en caching helpen vooral bij LCP. Voor INP maken ze minder verschil, omdat INP draait om wat er in de browser gebeurt.

Hoe controleer je of de verbetering werkt?

Na een aanpassing zie je in DevTools direct of de interactie sneller is. De veldwaarde in Search Console en PageSpeed Insights loopt echter achter, omdat die over 28 dagen wordt berekend. Klik in Search Console op Oplossing valideren zodra je klaar bent. Google volgt de getroffen URL’s dan ongeveer vier weken. Plan in die periode geen nieuwe grote wijzigingen, anders weet je niet wat het effect veroorzaakte.

Houd daarnaast een eenvoudig logboek bij. Noteer per datum welke plugin eruit ging of welke instelling veranderde. Bij een terugval na een update vind je dan snel de oorzaak.

Wanneer is een herbouw slimmer dan blijven optimaliseren?

Soms is een site zo opgebouwd dat elke verbetering een pleister blijft. Denk aan pagina’s met honderden geneste secties, een thema dat zelf ook een paginabouwer meebrengt en een stapel plugins die van elkaar afhankelijk zijn. Dan is een nieuwe opzet met containers, een licht thema en een kleine set plugins vaak voordeliger dan maanden sleutelen. Die afweging maken we per site, op basis van de metingen. Meer over hoe we WordPress sites bouwen lees je bij WordPress website laten maken. Wil je dat iemand de snelheid doorlopend in de gaten houdt, dan past webbeheer beter.

Wat is een goede eerste stap?

Open het rapport Core Web Vitals in Search Console en kijk welke groep URL’s op mobiel het slechtst scoort. Pak daar één template van en meet in DevTools welke interactie het traagst is. Wil je dat onze specialisten dat samen met de rest van je technische SEO doorlichten, vraag dan de groeiscan aan. Je krijgt een concreet overzicht van wat eruit kan en in welke volgorde.