AdSense? Responsive?
In July 2013, Google AdSense announced responsive ad units. This ad type made it a lot easier to include the biggest ad network into websites with responsive layouts. After a year of testing and some new features from AdSense I am finally able to write an extensive review for the Responsive AdSense Ad Units.
Read on to not only learn more about responsive banners, but to also understand when it is best to use them and when they are kind of tricky. I am also going to introduce you to my tests and optimization tricks.
What are Responsive Ad Units?
A Responsive Ad is an ad without a specific ad size. The size of the displayed creative is determined by the available space on the website. Responsive ads became most demanded with responsive layouts, which made it possible to use just a single layout for every device size. It made the work of web developers and publishers like me a lot easier.
Just imagine the frustration when you have to scroll to get passed a 300 x 600 pixel Large Rectangle on a mobile device with a screen resolution of only 320 x 480 pixels . Or better, a 728 x 90 Leaderboard forcing a horizontal scroll bar on your responsive layout. Responsive Banners can solve these problems.
Before Responsive Ads
When responsive layouts became an issue and my clients as well as my own projects attracted more and more visitors with mobile devices, there was no solution on the market. So I was forces to develop one by myself. This was a bit tricky to do, because of the technical restrictions some ad networks – AdSense included – have.
I ended up with a well working solution that used the visitors browser width to determine which banner size to deliver. I am still using this WordPress plugin when serving ads from other networks than AdSense or to disable ads completely on small devices. If you are interested in it, check out the Responsive Ads plugin.
Anyway, my solution had a small disadvantage. It didn’t work well with cached websites. So you can imagine me being very happy, when AdSense introduced their responsive ad units.
How to create a Responsive Ad Unit
To create a responsive ad unit in AdSense simply log into your AdSense account, visit the “My ads” section and click on “New ad unit”. There is a select box labeled with “Showing”. Choose “Responsive” here, like on the following screenshot
There is only one ad size to choose here. Clicking on “Preview” will show you some additional information about this ad size.
You only need to enter a name for your ad unit, the ad type and some styling settings and you can save your new ad and get the code.
Are you done now? Not really. The tough choice still lies ahead of you.
Smart Sizing vs. Advanced Mode
When first announced, the responsive ad units needed to be defined with exact ad sizes for a range of browser width. Since smart sizing was introduced in December 2013, this is no longer needed and you can set the size based on your layout. I suppose, Google needed to help a lot of non-technical publishers to use responsive banners without this feature.
Now, when getting your ad unit code, you can choose between two modes: Smart sizing and Advanced. This is what they mean.
Smart Sizing:
The ad unit automatically adapts to the available space. AdSense recommends this, but I don’t always (see below).
Advanced:
This mode uses Media Queries. If you know what those are, you can fine tune your ad sizes based on the size of the device. If you don’t know what they are, better use the Smart Sizing mode.
Experiences with Responsive Ads
Once you understand the idea behind responsive ads you can simply put them anywhere on your site, were the current banner doesn’t fit on smaller devices.
You can easily test this behaviour in your desktop browser. Simply minify the browser width until your responsive layout kicks in. Now, reload your page and you should see a smaller banner on the same spot.
Anyway, in the last year I did experiment a lot and ran into some challenges with responsive AdSense.
Problems with Smart Sizing
A few times I ran into problems with the Smart Sizing mode simply not being very smart. They were too big for the available space and either flew out the box and covered some other content or got cut by the parent box’s size.
This does not only look bad, it might also be against the AdSense terms of service. So when implementing a smart sizing ad unit I test a lot with different devices and browsers.
Another problem with Smart Sizing does occur, when AdSense is not able to determine the available space at all. In this case, no banner is served and the more tech savvy among you will see a notice in your javascript debug console that says “Error: Cannot find a responsive size for a container of width=”0px” and data-ad-format=auto”
Fixing Smart Sizing Errors
There are various advices to solve this, but not in every case I was able to apply them successfully. Anyway, if you face any of those, drop me a line via the contact form or in the comments and I will have a look. I am planning a follow up article on how to fix some of the issues, but still need some test sites.
Update: Read more about the solutions on How to fix the AdSense auto-resizing error and blank ads.
If I want to be completely sure to prevent the mentioned issues from happening, I serve the responsive ad units using the advanced mode.
Using custom ad sizes
If you read my article on ad placements, you might remember my idea of making your site bigger than it currently is. In case of my biggest project, we increased the maximum width to 1061 pixels. This enabled us to use bigger banners in the main content and increased the ad income.
Outside the main content, there was only a banner with 970 pixels width, the biggest ad size AdSense did offer us back than. But in December 2013, AdSense introduced custom ad sizes.
Custom Ad Sizes made it possible to fill any given space with ads. In our case, the ad space above the main content was now 1061 pixels wide and 90 pixels high. AdSense automatically adjusts text ads to this size, but also fills in other sizes, if they expect them to perform better, like the Large or a normal Leaderboard.
It looked smooth when a text banner appeared and filled in all the available space matching the size of the other content elements. But after running some tests – you expected me to do that, right? – I noticed a lower income performance for those sizes.
Testing Responsive Ad Units
Test 1: Leaderboard vs. Responsive
My first test I did on responsive ad units from AdSense was the standard Leaderboard (728 x 90 pixels) against a responsive ad unit in the header. Both where served for an ad space bigger than 728 pixels.
AdSense doesn’t allow to share specific numbers, but here are some results.
- the click through rate was almost the same
- the CPCs of all ad types for the normal Leaderboard were higher; in average 50%
- ¼ of ads in the Leaderboard and 1/3 of ads in the Responsive unit were text ads, the cheapest ad type
When looking even closer to the results by the size of the served creatives I noticed, the performance of the Leaderboard served through the Responsive was almost identical to the Leaderboard served directly. The bad performing part was the “dynamic” ad size.
Test 2: Responsive with specific ad sizes
Based on my first test I started another test where I set specific ad sizes for the Leaderboard. Before, I had told the responsive ad unit to deliver any ad size that fits the main box. Now I used the Advanced mode and set specific standard ad sizes like Large and Normal Leaderboard.
<style>
.word-grabber-header-responsive { width: 768px; height: 90px; }
@media(min-width: 1154px) { .word-grabber-header-responsive { width: 970px; height: 90px; } }
</style>Code language: HTML, XML (xml)As a result, the Large Leaderboard – not being served before at all – was delivered now for a few times. Also the share of the Normal Leaderboard within the responsive ad unit slightly increased, but the dynamic ad size was still served about 1/3 of the time.
I need to mention, that also the static Leaderboard deliveres dynamic ad sizes in case AdSense thinks they might outperform the standard sizes. Anyway, without a reason I know, the performance of those where also better than the performance of the dynamic creatives within the responsive ad unit.
When I summed it all up, the income performance from the fixed Leaderboard size was a lot higher than for the responsive banners, so I completely switched back to this fixed size.
Anyway, this test not only showed me how important tests are, but also what I need to test every time I implement a responsive ad unit:
- test smart sizing against sizes set manually
- test multiple specific ad sizes vs. filing the available space
When to use AdSense Responsive Ads?
Even though one might get another idea, but I still use responsive ad units. They are especially helpful where size matters. Like in my Sidebar. The best performing ad that matches only on small screens are Rectangles with a width of 300 pixels. In most browsers the sidebar gets smaller and before responsive ads, we just completely removed banners here.
AdSense’s responsive ad units made it easy for us now to monitize the sidebar also on small devices.
If you skipped the part where I tested different responsive ad units or just need a quick summary to get on with your own ad optimization, this is what you can take from this article:
- if you have a responsive layout you should definitely test responsive ads from AdSense
- test responsive ad units – especially the smart sizing ones – on different devices, browsers and browser sizes
- experiment with setting responsive banners to standard ad sizes using the advanced mode
- write a comment – just kidding, but I’d like to know about the problems you ran into
I am not completely finished with optimizing responsive ads. There is still the question of completely disabling them for a specific size or how to solve situations in which no ad is being served at all. Subscribe to the newsletter to not miss my findings.
Hai Thomas Maier,
It was nice reading about you testing out different aspects of adsense ads : responsive, adsense vs dfp, etc. I have a website with a responsive display, and all the three ad units I use are responsive ad units. So far, I haven’t encountered any troubles. However, I would like to use Google link units, but a responsive link unit is not available yet. Also, it looks like the Google CSE is also breaking my responsive display. Is there a way to use Google Adsense link units on responsive displays?
Thank you
Hi Rana Prathap, there is currently no solution. You can try my new Responsive Ads plugin for WordPress to make this work: http://wpadvancedads.com/responsive-ads/
Hi Thomas,
Was researching the web regarding responsive adds error
Cannot find a responsive size for a container of width=0px and data-ad-format=auto @ http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js:32
Any sollution you can recommend, my layout is very simple
Thanks
Max.
Hi Max, sorry to read that. I don’t see the error message on your site. Please use the contact form and provide me with a link to a page with this issue.
Thanks, Thomas
My responsive ad test is so far showing:
87% reduction in CTR
88% increase in CPC
78% reduction in RPM
I am using it where a footer banner ad was previously used. I am seeing almost no valuable info on others’ results.
I discovered that the responsive ad did not appear to be as well matched by keyword as the fixed ads. I believe that to be the issue with the low CTR. Is anyone else having issues? With such a drop in RPM I am forced to cut back on my test until results normalize.
Hi Ken, thanks for sharing your results. I had very different results for the responsive ad units. Some where better, some worse. Good you tested it!
Thanks for sharing your research, Thomas.
Incidentally, I found the opposite. On my sites I found that responsive ads gave much better results… but then I’ve only been running a week. Id love to hear from others with bigger traffic sites.
Thanks for sharing your insights. Indeed, I hope than many others are going to share their experiences with the responsive ad unit here.
Really nice article but will you please teach how to make responsive ad unit in dfp with adsense enabled.
Thanks in advance
Thank you. If you are using native AdSense through DFP you can just include the responsive ad tag there. If you want to teach dfp to be responsive, I would indeed have to write another tutorial.
Hey Thomas,
Great article. I am also interested in Fone Radar’s comment. How do I set up DFP to be responsive? I’ve gone through Google’s support on this and generally understand how to use it: https://support.google.com/dfp_premium/answer/3423562?hl=en, however, is there a better alternative?
The AdSense smart sizing feature is much easier to implement and does a much better job of filling the actual space allotted on my responsive website. I haven’t been able to create a DFP placement that uses an AdSense “responsive” ad as a third party code that actually functions as needed. If it worked properly, the starting space would be 728px wide and then would “smart size” down as the screen size got smaller and smaller until it was 300px wide on mobile.
Thanks for your help on this!
Hi Michael, indeed the DFP api documentation could be improved to make it more simple. I am currently working on a DFP implementation for Advanced Ads and might cover some of the technical parts in an article or you could just use the plugin if you are running on WordPress. However, if you are only using AdSense, the responsive adsense banner is the better way to go, even though the smart sizing might not always be better than the manual sizing.
I didn’t run hard tests to get exact figures on performance, but I did a few tests and I did test visually to see what ads were displayed when I chose “auto” for the ads in advanced mode versus setting the shape I wanted (rectangle, horizontal, vertical) manually.
I found that when setting the ad shape to “auto” they pretty much threw the kitchen sink at you. They’ll put text or image ads and every shape imaginable. It didn’t work well at all initially because rarely do you have content that will conform with any shape ad. You’re normally expecting it to be at least a particular shape.
So I began manually setting the shape. I did run a few tests on a few pages and saw a significant improvement in every metric when I set the shape of the ad. But I never tried using custom sizes. I just let them figure that part of it out.
In theory, if you leave the shape to “auto” long enough their algorithm should figure out the best ads to show. But I wasn’t seeing that theory play out so I just set it myself.
Have you tried experimenting with this feature?
Hi Brett, thanks for your detailled comment. I also tested both options. I ran a split test with auto and manual setting and discovered that the manual setting done with standard sizes performs much better.
Yeah, as awesome as Google is there will always be limitations. I mean, imagine having to come up with the algorithms to account for every possible ad on every web page on the planet??? Wow. So giving Google a hint for what shape the ad should be doesn’t seem unreasonable at all. We know what shape we’re looking for in our layouts. That’s a much better starting point for Google to work with.
Hi Thomas,
Thank you for this article – great information! I have been trying to set up a test (through the Adsense “experiment” area) where I can test a responsive ad on the right side of our site with a 300×600 static ad – but it seems that all you can test is “types” of ad, i.e. text vs display or testing different fonts and colors of the ads. Do you have any recommendations on how I can test a responsive ad vs a static ad that occupy the same place on our site? Thanks!
Hi Kathy, indeed there is no such test in AdSense yet. Depending on the ad management solution you can simply create two banners and rotate them on the same spot. Later, you can simply check the performance of both. My Advanced Ads plugin can do that using ad groups.
Hi Thomas we have a issue with the adsene mobile (320 x 50) i notice that the iframe go over the content that is under and in the case this content is a link the tab on the link in the mobile version don’t work. Have you an idea to resolve this bug? thanks in advance
Hi francesco, unfortunately I am not able to give detailed support through comments. If you need some customization you can contact me at support@webgilde.com.
Thanks, Thomas
Thank you for sharing this great tutorial post. I got right opportunity to learned some great ideas about responsive ads design. I’m confused that whether is it good or bad ideas to implement responsive ads. However, your article clearly shows the features of responsive ad. Do you like to recommend this ad design or not?
I prefer if ads don’t break the layout and responsive ads are a way to accomplish this.
HI Thomas, I definitely agrees with you that responsive ads does cause some drop in revenues from Adsense in the end day. However, with the recent changes of my blog to responsive layout, the responsive ads does really serve its purposes for resizing automatically into the suitable size, unlike conventional fixed sizes ads.
Really like you advice for advanced settings for the responsive ads instead of using smart sizing, will be trying that soon after I have cleared out all my fixed ads from my website !
Hi Jeffrey, thank you for sharing your experience with it. It might interest you that I just published an update of my Responsive Ads plugin with a dedicated support for AdSense responsive ads (see http://wpadvancedads.com/responsive-ads/).
Well, I used for a while the responsive codes. but my income dropped by 30% so I changed the codes with the regular ones after only three weeks.
Maybe in my niche there are not enough advertisers to support the both ad types.
Hi Thomas,
I am getting the “Cannot find a responsive size for a container…” error message and I am worried my ads are not being displayed.
I have tried before to define the ad sizes manually and the container sizes as mentioned in your other post with no luck.
Is there something I am missing?
Hi Chris, you could check in your AdSense reports how often the ad gets displayed. Sometimes it just needs a bit time. Can’t tell if you’re missing something since I don’t know where to look for the ad.
I added a CSS tweak and I started to see the ad on occasion. It seems to come and go on refresh. I only ever see the display ads too…
In Adsense I see “Active View Viewable” 30-50% on my ad spots… this don’t sound too good!?
The “Viewable” metric might just mean that the ad is on a spot where people don’t see it often, e.g. below the fold. This metric is very new and I don’t know yet if it also represents how often AdSense is able to load the responsive ad. Where can I see the ad?
You can find ads on the homepage: http://www.telltalesonline.com/ directly below the big slider, and another between the 6 blue content blocks in the sidebar. Thanks for taking the time to help!
Did you follow my guide to fix it? Doesn’t look like it. Of course I would suggest to use my Responsive Ads plugin 🙂
I want to add responsive ad code at My Site, Your code generator is not working, So Please send my responsive codes here.
Hi Emily, sorry to hear that, but I don’t know about what ad code generator you are talking. You can find your ad code in your AdSense dashboard and if that does not work for you it is best to contact Google AdSense.
Thomas
Thanks a lot ..It helped me to understand why to use responsive ads
Very informative and versatile tips on google adsense. Hope it will be helpful for beginner blogger like me who wants to increase their AdSense income. Thanks for nice article
Hi Thomas, I`m using WordPress and I`m very deep into testing responsive VS fixed size adsense ad units. Results are quite interesting but also confusing. I have even tried your WP plugin 🙂 However, so far I didn`t find adequate solution for putting some specific adsense ad unit code to be the first one in HTML code so I`m thinking about developing one myself… This can actually be a new idea for improvement of Advanced Ads WP plugin
Hi Drashco, I would be glad to offer you Advanced Ads as a basic for your idea. It is easy to build stuff on top of Advanced Ads and even provide them through the plugin website as well. Just contact me directly if you want to get more details.
Thanks, Thomas
Thomas, Your post is super useful but I cannot find smart-size and advanced options. Where do I find these options? Thanks.
The “smart-size” option was removed from the AdSense user interface. You can still use the code for it or my plugin to create it.
Great article about the subject, while from 2014 I guess most if it is still very appliable. I have some new projects in the workings and will give the repsonive ads a try (finally) and your article gave me a lot of insight and may preserve me from some caveats 🙂
Do readers even care much about ads in their sidebars anymore? it seems like I have trained myself to ignore sidebar ads and wondering whether anyone else feels the same way.
Great article Thomas.
Normally, they don’t. I consider the the sidebar to be a bad position when you have an action-based ad, like AdSense mostly is. Sulvo still works there.
Hi Thomas,
I have been experimenting with responsive ads on a site i am building, and they are working very nicely across devices.
However…
I am trying to make the big billboard style ads appear for widescreen devices, and although I have given a div width and height of 2000px + (just for testing) the largest ads I have seen are the 1200 x 90 ads.
Do the responsive ad blocks serve any ads larger than that?
Enjoyed reading the article and would appreciate any advice you may have.
Thanks
Luke
Hi Luke, thank you for this interesting question. Indeed, AdSense tries to fit smaller standard ads into larger spaces. I can also believe, while not be 100% sure, that they have an internal limit on how far they are stretching text ads. With 2000px in height it would also violate a few of their terms.
Hi Thomas,
Thanks for the reply. I have this morning seen a slightly larger ad appear, so I believe it might just be that the smaller ads appear more frequently than the larger ones. I’m fairly new to AdSense, so am spending a lot of time testing and experimenting with results.
From 2013 to till date in 2017 Responsive ads has improved a lot and can be now used everywhere.
I can definitely agree to Responsive ads having improved, but still prefer to fine tune my own ad sizes.