Collapsible Ad Slots Hurt Your Page Performance

Balancing Revenue and User Experience

It can often be tempting to use collapsible slots in the case that, for whatever reason, an ad doesn’t fill. While this is perhaps an attempt at elegant error handling, in practice this often leads to a degraded user experience. This can be particularly pronounced when we let static rendering take care of the content before populating ad slots.

Cumulative Layout Shift (CLS) is one of Google’s Core Web Vitals. The Core Web Vitals are a base measure user experience on your page, and affect search rankings. CLS in particular measures how much the page “shifts around” as it loads.

An ad slot that is collapsed while it loads, and expands once it does, is then naturally going to have negative effects on your CLS metric.

So what can you do instead?

Avoid Disruptive Positioning

One method to fix this is to avoid ads embedded in your content—this is where classic sidebar ads shine. While perhaps a little old fashioned, sidebar ads are tried and true. They typically have high viewability, and thus excellent profitability. They are also minimally disruptive to your user’s experience; they don’t get in the way of what your user came here to see.

Fetch Ads Before Slots Render At All

More fashionably, if you have an infinite scroll feed on your site, the UI for subsequent content is typically loaded in chunks. Ads can be stealthily requested just before a new feed section is likely to be requested. This allows a decision to be made as to whether or not to render the slot based on whether or not the pre-fetched ad request fills.

Backfill Ads with Your Own Subscription Upsell

If you have ads that are part of your initial page load, and are also positioned to disrupt content—for example, a large “billboard”-style header ad—the cleanest way to handle cases where an ad fails to catch a bid is to use the unfilled inventory yourself. You likely also sell a subscription—this is the perfect opportunity to promote it.

Ads are often described as a necessary evil. But when done well, they can provide maximum value to both your business and your user, while minimally disrupting your intended experience.