Stop reflowing content for ads
You walk into a coffee shop and stand in line. You ask for a cup of coffee, but the barista instead offers you a shot of whisky first. It’s 10 AM, you don’t want a shot of whisky. You politely refuse and repeat your order. You drink your coffee and carry on with your day. You walk in the next day, and this time you are offered to buy a Microsoft Windows Asus tablet. You actually happened to need a tablet and had searched for it last night — just not at this moment and not at a coffee shop. Would you ever go back to this coffee shop?
Sadly, this is analogous to the state of display advertising today.
Things your readers may not need are offered at the wrong time while adding friction to what they came to do — read.
This sounds outrageous but is exactly the sort of experience most websites/ publishers give their readers. Readers visit a site to read content, yet get bombarded with experiences like below.*
Just when readers start consuming content, the ad dynamically reflows the page layout. This is incredible distracting and chances are the user will immediately leave your page.
The page is establishing an implicit contract with the reader by giving the user what they came for, but then deceives them with — WHAM! LOOK AT THIS THING THAT YOU ABSOLUTELY DON’T CARE ABOUT!
The only thing that’s worse than a bad experience is a bad experience that’s inconsistent. Inconsistent experiences causes subtle anxiety. Often, the same ad slot expands out of the ad slot into a full page ad or sometimes autoplays a video. At times, the ad expands into a full interstitial which blocks the user from proceeding before interacting with the ad. Your job as a publisher is to promote experiences on your site that keep the user consuming your content for as long as possible.
There are gentler, more polite patterns to advertise on the web without turning the dial up to 11.
Establish an interaction flow and stick with it
Once you give your users something they came for, don’t take it back. Don’t paint anything on the page unless you have everything you want to show the user in the first viewport. This is not an easy problem to solve because content on the page is typically fetched from a different location vs the ad. This is how most of the web works — sourcing multiple different pieces on the page from different servers.
All hope is not lost though:
Don’t show any ads high up in the first viewport
Contrary to popular belief, ads placed in the top of the page are not necessarily more viewable. The best position to place ads is right above the fold. This helps the user to start consuming content while loading ads in parallel without causing visible content reflow above the fold.
Make ad sizes static
As a publisher, it’s worth asking yourself if that jazzy animation out-of-page ad brings positive brand awareness to your advertisers. If so, is it worth alienating your readers? Instead, consider reserving the space required for your ads before you even layout the page. This way ads can take however long they want but never block the user from consuming content.
Speed up your ads and your site
Publishers typically own the content on the page but they have less control over the ads. The advertising industry’s ‘tragedy of commons’ problem doesn’t incentivize creative developers to make the creatives light and therefore fast. As a publisher, you must negotiate contracts with your advertisers and ad servers so that your ads and the first viewport always renders under 1 second (median).
I truly believe that advertising keeps the web open and free for everyone. That’s a wonderful thing. It’s time publishers embrace reader-friendly advertising patterns before more readers embrace ad blockers.
*P.S: I don’t mean to specifically pick on Vox/ Recode in the video- I came across the article by chance. They are one of very few brands that actually care about these things. There are far worse ad implementations on the web.