What to Use: Media Query or Responsive Ad Units?

Spread the love

Last updated on July 25th, 2022 at 05:29 pm

Responsive ad units are a great fix to show ads based on the device size. Also, the responsive ad units from Google experiment with several ad sizes. However, we have seen that some standard ad sizes perform better since advertisers prefer those ad sizes and are willing to pay a higher CPC for the creatives they generate for those sizes.

Publishergrowth: The Revenue Acceleration Platform for Publishers

Blognife is elated to announce the launch of Publisher Growth- a community of publishers that helps you actively accelerate your revenue. This platform assists publishers in growing their traffic and revenue. As publishers, you can share and read reviews of ad networks and hosting companies. You can connect with other publishers to build links for growth and monetization hacks and more. This platform will help you stay up to date with the advertising and publisher ecosystem.


  • List of 200+ ad networks to monetize your site across all verticals.
  • Personalized site audit upon signing up on the platform that can increase your revenue.
  • Find all upcoming adtech conferences, webinars, and events in one place.
  • Stay informed with the latest adtech news across the globe.

  • Typically, we have seen 336×280 generates the highest CPC on desktops, along with 600×300, 700×300, and other custom sizes. Advertisers are preferring these custom sizes since they fit in well within the post content area and blends with the content. Also, larger ad sizes increase the competition since it fits more creatives, and thus, more number of creatives are up for bidding, thereby increasing the CPC of the ad being served on your site.

    Also Read:  AdSense Arbitrage Techniques 2023

    What to Use: Media Query or Responsive Ad Units?

    Understand whether you should use media queries or responsive ad units based on your needs.

    Should you use Responsive Ads from Google?

    Yes, you should at least try using responsive ad units once to see how these units perform on your site. You can have a detailed reporting of these units from performance reports. Make sure, you label these ad units properly.

    For a lot of publishers, responsive ad units perform quite well! They fit into the screen size and sometimes show non-standard ads that help fight banner blindness. Also, few responsive text ads blend very well with the content, increasing the CTR and the overall revenue.

    In case these responsive ads don’t perform well on your blog, due to a myriad of reasons, you should consider using an alternative rather than giving up. The solution is a media query. Media Query allows you to show ads based on the visitor’s screen size. You can define either the maximum or minimum width of the screen size and show the preferred ad sizes.

    Showing Different Ad Sizes Based on Screen Width Using Media Query

    This example shows you how to modify your responsive code to set specific ad unit sizes for three ranges of screen widths, i.e., mobile, tablet and desktop. You don’t need to have any previous experience with CSS media queries or modifying AdSense ad code to follow this example.

    Before choosing the Screen width and ad sizes, I logged into Google Analytics to check the popular screen sizes which my traffic has. Once you have an idea of the popular screen sizes you’ve all set to define the minimum width for which a particular ad size will be displayed. I am testing media query on one of my blog and here is the code

    Also Read:  Sulvo Review: Best Supply Side Platform for Premium Publishers

    Adunit name is: Beamingnotessresp02

    { width: 250px; height: 250px; }
    @media(min-width: 300px)
    { width: 300px; height: 250px; }
    @media(min-width: 360px)
    { width: 336px; height: 280px; }

    @media(min-width: 1080px)
    { width: 620px; height: 300px; }
    <script async src=”//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js”></script>
    <!– Beamingnotessresp02 –>
    <ins class=”adsbygoogle Beamingnotessresp02″
    (adsbygoogle = window.adsbygoogle || []).push({});

    Tip: While naming an ad unit make sure you don’t use a dot anywhere if you’re using the ad unit with media query codes.

    Create an A/B Split Test

    To track the performance of a Responsive AdSense ad unit with Media Query vs. only Responsive Ad unit; I suggest you create a new responsive ad unit and then create an experiment that includes this new responsive ad unit as a variation in the experiment. (You can create experiments from your AdSense dashboard under My Ads section)

    Doing so will ensure the performance monitoring of both the responsive ad units (with and without media query) and the data will help you take a better decision on which one is working better for your site.

    Ezoic banner

    This is obviously worth testing, and I suggest you apply this optimization tip and let me know how this performs on your site. Till then, happy optimizing!

    Our Recommended Tools for Publishers:

    Looking to Increase your Ad Revenue: Get in touch with me for a personalised consultation and increase your ad revenue across native, display, video (instream and outstream), in-app and other verticals. I also assist in customized DFP setup, header bidding, and content creation strategy. My skype id is: ronniedey. Feel free to connect!

    Spread the love

    Leave a Comment