Ad Margins To Reduce Accidental Clicks

What is best for mobile?

[IanTurner]

So we all know that accidental clicks can be reduced by putting a good white space margin around your ads.

Google's adsense blog recommends 150px as a stating point [adsense.googleblog.com ]

I've done some experiments with this and found that I get good results with 50px or greater margins on Desktop and Tablet - but that for Mobile this isn't getting the same sort of effect and going up above 100px the white space on the mobile screen just makes the page look ugly or as if it finishes before the add.

So has anyone else any experience of putting extra margins around ads - and have you found something that works well on mobile?

[keyplyr]

We had a similar discussion on this a few weeks ago (I searched but couldn't find it.)

I agree that a 150px margin is extreme looking, especially on phones. I use 50 with no repercussions. Looks like enough spacing to me.

I do get a small clawback every month but I attribute that to bots and not accidental clicks due to my design.

[Broadway]

On mobile, my ads are spaced no differently than my paragraphs of text.

My "invalid activity" per month runs on the order of 1.5%.
My text ads show those big arrows (I'm not being penalized for invalid clicks on them).

[martinibuster]

For an AdSense unit contained within a DIV, I'll use a single line break before the DIV and another line break prior to where the AdSense code begins. And if the Ad looks better, I'll place an additional line break after the AdSense code. This will usually cause it to blend in naturally with the other on-page elements on both desktop and mobile and show up exactly where users expect it without unnatural crowding or spacing.

For an AdSense ad unit placed freestyle on a page without any sort of container, I add two line breaks above and below.

Line breaks reproduce well regardless of device.

[IanTurner]

That is interesting thinking, I used line breaks a lot in the past, but with my HTML5 rewrite I removed them.

[martinibuster]

Line breaks probably aren't for adding a space prior to a div, technically. But they're within specs (including HTML5) for preceding a script.

[Ronnyy]

I started using line breaks as well, I find it easier than to fiddle with the css and add the content of the ad in a div.
I was hoping that one line break would be enough.

BTW how do you calculate the distances in pixels? especially when it's more complicated, when you have several html tags involved (e.g. around a menu).

[keyplyr]

Line breaks are not uniform across browsers. Using line breaks can cause signifant discrepancies in rendering.

Compare the difference spacing between Chrome, Edge, IE, Safari, Opera, Firefox. etc.

For mobile don't forget about the various apps that render your pages with their browsers.

Using exact spacing with CSS is the most efficient method.

[martinibuster]

I'm counting on line breaks displaying differently across devices. I've yet to see a line break cause an awkward layout and it seems to me that's because the line break is rendered in a manner that's scaled to the device viewport. I am pretty certain that line breaks display relative to viewport (or close enough that it does not blow up a layout) when used properly. Perhaps if the line break is used where it should not be used it will break a layout.

The essence of responsive design is that a layout is fluid. Thus we're usually working with percentages so that the various layout elements scale up and down. Pixels are fixed and thus can be in opposition of a responsive design, resulting in an awkward layout. Finding a way to work with pixels or a method superior to pixels for specifying the margin around an ad is at the core of this discussion.

In my opinion line breaks are a relative and fluid measurement of distance and that's why they work. A line break on a small device is going to be smaller if measured in pixels (or em) than a line break on a desktop.

The problem with pixels is that you're dealing with absolute vertical margins while the responsive nature of an element is horizontal. You can make the left-right axis expand and contract but when you're dealing with pixels on the vertical plane you're going to end up with awkward layouts because the responsiveness of a layout is on the horizontal axis.

You can use percentages but the percentages on responsive designs are (I think) always on the horizontal plane.

Use relative units
A key concept behind responsive design is fluidity and proportionality as opposed to fixed width layouts. Using relative units for measurements can help simplify layouts and prevent accidental creation of components that are too big for the viewport.

https://developers.google.com/web/fundamentals/design-and-ui/responsive/ [developers.google.com]

[IanTurner]

I think if you use line breaks then this has to be done consistently across the site, not only for ad margins but also for header spacing, table spacing and image spacing too.

I'm going to run an experiment to see what happens if I do it anyway.

[IanTurner]

Some data from my experiments - well at least the first one to finish

This was four different ad margins, but all using the same ad unit (which I think may have been a bad idea - so I am now running an experiment with clean ad units for each ad margin).

I will give the original a value of 100 and give the other sizes their percentage of the original value

The four ad margin sizes are original 25px, 50px, 70px and 90px (the experiment on line breaks is separate and still running)

Starting with revenue eCPM

25px 100
50px 82
70px 66
90px 60

Conversion rate

25px 100
50px 102
70px 103
90px 105

Pages per session

25px 100
50px 99
70px 99
90px 99

Average Session Duration

25px 100
50px 98
70px 93
90px 98

Bounce Rate (Note this doesn't mean a 100% bounce rate for the original

25px 100
50px 96
70px 95
90px 94

On this experiment it seems that there is very little change in Session Duration and Pages/Session caused by changing ad margins, but that Bounce Rate and Conversion Rate are improved and that Revenue decreases with larger margins.

Bizarrely, Google gave 50px a 100% chance of improving my Adsense revenue despite it performing worse than the 25px original - as I used Adsense revenue as the experiment goal.

I am no busy running more experiments to see if results are the same with four clean Adsense ad units.

[Chrispcritters]

Thanks for sharing Ian.

[ken_b]

Thanks for the numbers Ian.

[denisl]

So we all know that accidental clicks can be reduced by putting a good white space margin around your ads.

This is to make a larger gap between the clickable area of the ad and other clickable areas?

I didnt like the idea of all that white space on mobiles either so have done a certain amount of re-doing the layout to avoid having other clickable areas next to ads, thereby avoiding white space.

[IanTurner]

Yes it is to have a non clickable area around the ads, but I have found that just having white space for readability also helps.

I will post the data from the mobile segment for you later today or tomorrow - white space works on mobile too.

[ogletree]

I have been out of the Adsense game for quite some time but had a question.

Why would you want to stop accidental clicks? Isn't that also throwing away money?

[eek2121]

Google takes back earnings from accidental clicks at the end of the month. Also, if your site is found to be intentionally encouraging clicks, you will face a possible ban from Adsense. Even if it seems like you are getting away with things, they WILL eventually catch up to you.

[IanTurner]

Yes it is about reducing accidental clicks to increase the quality of the return you are giving advertisers - thus hopefully allowing the ad slots to become more attractive long term and thus generate a better longer term income. This seems to be the way Google has been going recently with Adsense.

[IanTurner]

Now for just the mobile segment, again this was four different ad margins, but all using the same ad unit.

I will give the original a value of 100 and give the other sizes their percentage of the original value

The four ad margin sizes are original 25px, 50px, 70px and 90px

Starting with revenue eCPM

25px 100
50px 94
70px 87
90px 89

Conversion rate

25px 100
50px 106
70px 101
90px 104

Pages per session

25px 100
50px 102
70px 99
90px 99

Average Session Duration

25px 100
50px 108
70px 94
90px 90

Bounce Rate (Note this doesn't mean a 100% bounce rate for the original)

25px 100
50px 96
70px 99
90px 99

For mobile the revenue drop from the bigger ad margins was less pronounced, but the improvement in bounce rate and conversion rates was seen most with the 50px ad margin. So from this it seems that the wider margins are actually more effective on mobile.

[EditorialGuy]

We don't use AdSense on our mobile impressions, but on our desktop/laptop/tablet pages, or ads are in a sidebar with a horizontal rule above and below (and with the small word "Advertisement"). That makes it pretty unlikely that a reader is going to click an ad by accident.

It seems to me that one of the best ways to prevent accidental clicks is to keep ads separate from editorial content (and clearly recognizable as ads), regardless of the display device. Borderless ads that float within body text are just inviting accidental clicks.

[magician]

Do they really mean 150px ? It's just too much. I know they recommend 150px with flash games but with text it's just too much. I think the writer of the linked blog has just copied it from their flash game recommendation thing. They do such things all the time.