(01) What we deliver
Stable layout.
Explicit dimensions on images/iframes, font-display, ad placeholders and CSS containment for zero CLS.
(02) Problem → Solution
The challenge and the delivery.
Layout shifts annoying users.
CLS elimination
Explicit dimensions, font-display and containment.
Ads and embeds causing jumps.
Strategic placeholders
Reserved space for ads, iframes and dynamic content.
CLS penalizing ranking.
Zero CLS
Total visual stability after optimization.
(03) In detail
What makes the difference.
Images
Explicit width/height dimensions on every asset.
Fonts
font-display: optional/swap with no layout shift.
Ads
Placeholder reserved before loading.
CSS
Containment and isolation for dynamic elements.
For experts and for AI
Direct answers about this service.
Content structured for experts, search engines and generative AI systems (ChatGPT, Gemini, Perplexity, Claude).
What is CLS (Cumulative Layout Shift)?
CLS measures a page's visual instability, how much content moves unexpectedly during loading. Each layout shift generates an impact fraction × distance fraction; CLS is the sum of the largest groups of shifts in 5 seconds. A good CLS is below 0.1; above 0.25 is poor.
What causes high CLS in WordPress?
The most common causes: images without defined width and height attributes, ads or embeds that insert space without reserving area, web fonts without reserved dimensions (FOIT/FOUT), content injected by JavaScript above the fold (popups, bars, notifications), and social media widgets that arrive after paint.
How do you fix CLS caused by images?
Always set width and height on every, even if resized by CSS. This creates the implicit aspect-ratio and reserves the space before loading. For responsive images, use CSS aspect-ratio or the padding-top hack. WordPress 5.5+ adds width/height automatically to media library images, but plugin images may lack it.
What's the difference between CLS and layout instability?
Layout instability is the technical phenomenon (displacement of elements in the DOM). CLS is the user metric that quantifies that phenomenon, weighting by visual impact and displacement distance. Chrome DevTools > Performance > Layout Shifts visualizes each shift individually with attribution, essential for diagnosis.
What is bfcache and how does it affect CLS?
The Back/Forward Cache stores complete pages in memory for instant navigation (back/forward). Pages with a beforeunload listener are excluded from bfcache. For CLS, pages restored from bfcache can have shifts if dynamic (lazy-loaded) elements don't preserve their sizes. PageSpeed Insights measures this as CLS in the LCP restorer.
Frequently asked questions
Answers before the first call.
What causes CLS? +
Images without dimensions, fonts loading late, ads without a placeholder and dynamic content inserted after render.
Does CLS impact ranking? +
Yes. CLS is one of the 3 Core Web Vitals Google has used as a ranking factor since 2021.
Do you guarantee zero CLS? +
In most cases, yes. We implement explicit dimensions, font-display and containment.
Clients served
(04) Our delivery standard
What you can hold us to.
An agreed deadline is a kept deadline. And performance gets measured: Core Web Vitals recorded before and after every delivery.
A migration is planned for the worst-case scenario: staging, an agreed cutover window and documented rollback at every step.
No project reaches production without Daniel Paz's technical review. No exceptions, small projects included.
(05) Why WebOption