murattunalı.

Layout shift risk auditor.

The layout shift risk auditor finds embedded content in pasted markup that has no space reserved for it.

A layout shift happens when the browser paints the page without knowing how much room an element will take. The image loads, claims its real size, pushes everything below it down, and the reader loses the line they were on. The only cure is reserving the space in advance — `width` and `height` attributes, or an aspect-ratio rule.

What it looks for

The tool flags three separate risks. The first and most common is embedded content with no declared size: images, video, frames and embedded objects. The second is a lazy-loaded first image above the fold — this produces delay rather than shift, but the outcome is similarly bad, because the largest contentful paint has been deliberately postponed.

The third is the typeface. If an `@font-face` declaration carries no `font-display`, the browser’s default behaviour takes over and the text reflows when the font arrives late. If no metrically matched fallback family has been chosen, even the number of lines can change, and at that point the shift comes from the text itself. The details are written separately.

This is not a measurement

The tool does NOT measure layout shift; it looks for the risk of one. The real value can only be computed in the browser while the page loads, using session-window logic, and it also depends on how the visitor scrolls. Looking at markup and saying “this page shifts by so much” is not possible.

The source of the risk, however, is almost always in the markup, and finding it there is cheap. Measurement finds the problem; auditing the markup shows it before it exists. Neither replaces the other. How the shift was brought to zero and the blind spot during scrolling are described separately.

The scrolling blind spot

Most auditing tools load the page, measure the first screen and stop. Yet shift occurs mostly during scrolling: lazy-loaded images, sections that appear later and scroll-driven animation all live below the fold. On this site that blind spot was found by measurement and closed with its own guard — the worst session window computed across the whole scroll has to stay under 0.08.

How to use

  1. Paste the markup of the section you want to audit
  2. Press Audit
  3. Every risky element is listed with its type and source

The tool runs entirely in your browser — no data is sent, no cookies are written.

SOURCES