Add min-height to GPT slots
Closed this issue ยท 16 comments
To reduce CLS, GPT slots should have min-height set to the minimum available height configured for the slot according to the viewport.
While I know this is a big one for CLS, and thus why it was also part of AMP, it's also a big reason why we've been moving publishers to AMP Plus (standard GPT) -- to get rid of this set min height. It causes unsightly white space when an ad slot goes unfilled and depending on a publisher's selling strategy, there may be purpose behind unfilled impressions. Additionally, there is no 100% backfill solution, so the only way for every single impression to be filled is to ensure publishers have a correct house ad strategy in place. But like I said, some impressions go unfilled on purpose. Take our global placements for example -- a publisher could want the below nav placement to appear everywhere, except the homepage. To do this, they'd enable the placement in Newspack, and then target away from the homepage within their targeting in GAM (we have several publishers who do exactly this). Moving forward with this issue will cause undesired white space in a very visible place on the homepage for those publishers.
All that to say, I do not think we should move forward with setting a min height for ads (unless we make it an optional setting), but welcome all opinions for us to reach a consensus!
Take our global placements for example -- a publisher could want the below nav placement to appear everywhere, except the homepage.
We could try 2 combined strategies:
- Make the min-height optional through the settings
- Study the possibility of some global placement visibility options on our end
The second strategy has many possibilities and is a dangerous zone to explore. A simple solution that would satisfy the example you gave is having a page/post panel (just like the Ad Suppression one) for selecting global placements to suppress on that specific page or post. Or even enhancing the current Ad Suppression to allow a more specific selection of placements to suppress.
Make the min-height optional through the settings
I would be comfortable with this!
The second strategy has many possibilities and is a dangerous zone to explore.
I totally agree and am not sure we want to go down this rabbit hole just yet.
- Make the min-height optional through the settings
More than 50% of total layout shift is happening because of Above the header or Below the header ad position. Will min-height be set as per device dimensions? Height of Ad configured and served varies a lot as per device used by visitors: let's say 320x50 for mobile, 728x90 for tablet and 970x90 and 970x250 for Desktop.
Will min-height be set as per device dimensions?
Yes, as per description:
set to the minimum available height configured for the slot according to the viewport.
Take our global placements for example -- a publisher could want the below nav placement to appear everywhere, except the homepage.
Then it should be possible to disable global ad slots per-page. If an ad's not supposed to be somewhere, there should be no ad slot โ targeting away from the homepage sounds like a hack necessitated by the lack of this feature.
Making min-height optional is pulling the user into the weeds of CLS and web perf plumbing (imagine the help text on that setting), it's not user-friendly.
targeting away from the homepage sounds like a hack necessitated by the lack of this feature.
I wouldn't say this is a hack of the feature, targeting away from placements or pages is a very common tactic in ad delivery and used regularly based on sales agreements.
Making min-height optional is pulling the user into the weeds of CLS and web perf plumbing (imagine the help text on that setting), it's not user-friendly.
This is a decision that I whole-heartedly believe should be in the hands of the publisher. On a near weekly basis we get publishers in the help channel asking what we can do about the white space caused by min-height set by AMP. When we explain the pros and cons, they choose to go to AMP Plus every time because they believe the hit to CLS is worth a prettier frontend.
Also, by setting a min-height set to the minimum available height is still going to cause CLS hits regardless. A common flex combo on mobile is 300x250, 320x50, 320x100 -- so in setting the min height to 50, CLS will be affected every time a 300x250 or 320x100 renders and 90% of the time, a 300x250 will win that placement. On desktop common combos are 729x90, 970x90, and 970x250, so anytime a 970x250 renders, CLS will be affected. All that to say, setting a min-height set to the minimum available height isn't going to be much more of a benefit over not having a min height set at all.
Making min-height optional is pulling the user into the weeds of CLS and web perf plumbing (imagine the help text on that setting), it's not user-friendly.
I'd respectfully disagree. I don't think we need to get into the CLS weeds by adding this option. Having that white space is just yucky. It's not a great reader experience to see a giant empty space on the page for no apparent reason. Pubs don't need to understand CLS to understand that they want to get rid of the whitespace. They shouldn't have to go full AMP Plus in order to achieve this small thing.
I'd defer to Katie's expertise on this one as she knows the ad experience for our customers better than anyone. But it seems to be that adding this as an option is better than what we have now and presents a good happy medium.
90% of the time, a 300x250 will win that placement
Should we move the strategy to use the maximum height? It's how AMP does it and smaller ads would be vertically centered to reduce blank space perception. I think we can get away with that by making it optional. I'd go further to suggest we make that optional per-placement ๐ฌ
I agree we shouldn't introduce a feature that produces a poor reader experience and doesn't actually resolve the real-life issue.
Should we move the strategy to use the maximum height? It's how AMP does it
AMP also has a 2/3 rule for flexible sizes to prevent the white space from looking too awkward (i.e. you can't have 728x90 and 970x250 be available options within a single slot, or 320x50 and 300x250 -- all available sizes must be within 2/3 the size of the other). If we go with using the max height, we should put in a similar restriction, otherwise the visual experience will be too drastically affected and not worth the effort (or potential benefit to CLS). However, I'm also avidly against the 2/3 rule because it limits sales and highest bid price opportunities.
Before we make a decision on this, I think we should take a handful of publishers who are currently AMP and an equal number who are AMP Plus (and who use flexible sizes on above the fold placements) and compare their CLS scores. If there is a drastic difference, we can resume this conversation to find the best options, but if there is minimal difference, I don't think we should move forward on it.
Great discussion here! The main takeaway I see is:
Ad slots are sometimes unfilled by design, and sometimes by chance (no ad to serve). If min. height is set, but slot is not filled, the resulting white space is bad reader experience.
Since AMP does set min. heights on ads, a purposefully unfilled ad slot would render as a blank space, is that right? How do publishers handle that if they are on AMP?
Also, by setting a min-height set to the minimum available height is still going to cause CLS hits regardless. [โฆ] On desktop common combos are 729x90, 970x90, and 970x250, so anytime a 970x250 renders, CLS will be affected.
It's not about the fact of CLS, but the cumulative amount of it. A shift from 0 to 250 is worse than a shift from 90 to 250, in this case.
When experimenting on one (non-AMP) live site, setting min. heights on ads had a large impact on CLS. The heights set were the midpoint between the shortest and tallest size (e.g. for a 320x50 and 300x250 combo, min. height would be 150) โ this causes additional whitespace some of the times, but not much of it.
We'll experiment more but results so far show that there is a direct relation between CLS and ads' min. heights.
Since AMP does set min. heights on ads, a purposefully unfilled ad slot would render as a blank space, is that right? How do publishers handle that if they are on AMP?
AMP renders a placeholder:
It's not about the fact of CLS, but the cumulative amount of it. A shift from 0 to 250 is worse than a shift from 90 to 250, in this case.
That is good to know, but if we're going to make the fixed height optional, I think we should use the maximum height. WDYT?
I also think that allowing a page/post to suppress specific placements is an important addition to this. This way an above/below header placement that does not render on the homepage can have a fixed height without showing a blank space.
Since AMP does set min. heights on ads, a purposefully unfilled ad slot would render as a blank space, is that right? How do publishers handle that if they are on AMP?
One thing to clarify (that is an important detail) is that if a slot is unfilled on AMP, a placeholder will show only if that slot was in view when the page rendered. Slots that are unfilled but are out of view upon initial pageload, the div collapses. This can happen anywhere on the page, but whatever slots are within the loaded viewport (top of the page or on a refresh somewhere in the middle), those slots will have a placeholder, all others will collapse. If we set a min height (optional or not), we should replicate this functionality.
๐ This issue has been resolved in version 1.37.0-alpha.1 ๐
The release is available on GitHub release
Your semantic-release bot ๐ฆ๐
๐ This issue has been resolved in version 1.37.0 ๐
The release is available on GitHub release
Your semantic-release bot ๐ฆ๐