CLS Checker & Learning Tool
Scopri come viene calcolato il punteggio Cumulative Layout Shift ed esegui un elenco di controllo delle migliori pratiche.
Visual Instability Simulator
Article Headline
This content shifts down when the element above "loads" without reserved space.
Layout shifts cause accidental clicks and a poor user experience.
Heuristic Audit
Complete the audit to see your stability score.
Cumulative Layout Shift (CLS) is the Core Web Vital that measures unexpected movement of content while a page loads. This tool helps you understand and reduce it: enter the two factors that make up a shift to see the resulting score, watch a live demonstration of an element shifting late, and work through a checklist of the common causes. It's an educational and planning aid — read the note below on what it can and can't tell you.
Come viene costruita la partitura
Each layout shift is scored as impact fraction × distance fraction. The impact fraction is how much of the visible screen the moving content covers; the distance fraction is how far it travels, as a share of the viewport. Enter both and the tool multiplies them to a score with three decimals. Google's widely-cited thresholds are good ≤ 0.1, needs improvement ≤ 0.25, and poor above that — so a small element moving a short way scores well, while a large banner jumping down the page scores badly.
Cos'è (e cosa non è) questo strumento
Questo è un calcolatoree una lista di controllo per comprendere CLS, non una misurazione del tuo sito live. Non può vedere le tue pagine, quindi non restituirà il tuo CLS reale, che proviene dai dati sul campo (il report sull'esperienza utente di Chrome o uno strumento di monitoraggio degli utenti reali) e da strumenti di laboratorio come Lighthouse o PageSpeed Insights. Usalo per apprendere la formula, verificare l'integrità di un singolo ipotetico spostamento e spuntare le solite correzioni: impostare larghezza e altezza su immagini e video, riservare spazio per annunci e incorporamenti, evitare di inserire contenuti sopra contenuti esistenti e precaricare i caratteri per evitare il riflusso tardivo.
Domande Frequenti
Does this measure my website's real CLS?
No. It cannot access your pages. It calculates a single shift from the impact and distance values you enter and teaches the concept. For your real CLS, use PageSpeed Insights, Lighthouse, or Search Console's Core Web Vitals report.
What counts as a good CLS score?
Google's thresholds are 0.1 or below for "good", up to 0.25 for "needs improvement", and above 0.25 for "poor". CLS is the sum of all unexpected shifts during the page's life, not a single one.
What are impact and distance fractions?
Impact fraction is the proportion of the viewport affected by the moving element; distance fraction is how far it moved relative to the viewport. Their product is that shift's score.
What are the most common causes of layout shift?
Images and videos without width/height, ads and embeds with no reserved space, content injected above existing content, and web fonts that reflow text when they load. The checklist covers each.