Critical CSS
Performance
Critical CSS
Critical CSS plaatst essentiële stijlen voor above-the-fold content inline in de <head>. De rest laad je asynchroon. Zo verminder je render-blocking CSS en versnel je de eerste weergave. Let op de balans: te veel inline CSS vergroot de HTML, te weinig veroorzaakt FOUC.
Andere termen met deze tag:
FOUC
AA
Performance
Flash of Unstyled Content
FOUC is een korte flits waarbij ongestylede HTML zichtbaar is voordat CSS en webfonts zijn toegepast. Oorzaken zijn late CSS-load, async CSS, trage fonts of client-side rendering. Voorkom dit met critical CSS inline in de <head>, preload overige CSS non-blocking, minimaliseer render-blocking resources en gebruik font-display: swap/optional.
AA
Performance
Render-blocking
AA
Performance
Render-blocking resources
Render-blocking resources zijn CSS- en JavaScript-bestanden die de browser dwingen het renderen van de pagina te pauzeren totdat ze geladen en verwerkt zijn. CSS in de <head> blokkeert altijd — scripts zonder async of defer ook. Dit vertraagt de First Contentful Paint. Oplossingen: inline critical CSS, defer/async voor scripts en preload voor kritieke resources.
AA
Performance
FCP
AA
Performance
First Contentful Paint
FCP is het moment waarop de eerste tekst of afbeelding in beeld komt. Het laat zien wanneer een gebruiker 'iets' ziet. Verbeter dit met critical CSS, een snelle serverrespons, minder render-blocking JS/CSS en geoptimaliseerde fonts.
AA
Performance
400 kaartjes
Een uitgebreide collectie begrippen voor elk niveau
12 categorieen
Van HTML & CSS tot databases en security
3 niveaus
Geschikt voor beginners en gevorderden
Voor teams & klassen
Ideaal als lesmateriaal of teambuilding tool
Offline oefenen
Fysiek aan de slag, zonder scherm