Ep 2: Reserve the slot: fixing ad layout shift (CLS)

Your ad loads late and shoves the whole article down.

That jump is scored as Cumulative Layout Shift, or CLS. Good is zero point one or less.

On recipes.example, the phone screen is eight hundred pixels tall, and the recipe fills the top four hundred. A three hundred by two fifty ad loads above it and pushes the text down two fifty. Before and after, the text covers six fifty of eight hundred pixels, an impact of about zero point eight. It moved two fifty of eight hundred, a distance of about zero point three. Multiply, and one ad scores just over zero point two five. That’s poor. The fix, reserve two hundred fifty pixels of height in CSS, before the ad tag runs. For multi-size slots, reserve the size that fills most often.

Check every ad container on your page has a minimum height in CSS.

Next, lazy loading ads without losing impressions.