The responsive web + AdSense

We know one of the biggest challenges publishers currently face is designing websites that adapt to different screen sizes, resolutions and user experiences. You’ve been asking for responsive ad units to help you deliver the best possible user experience on your pages, and we’ve listened to your feedback. Today, we’re happy to share that responsive ad units are now available as a beta feature alongside our recently released asynchronous tag. The new responsive ad units allow you to support a wide range of devices by working with your responsive design web pages.  You can now dynamically specify the size of the ad that will be served, adapting it to fit the way your site renders a page on a particular device. As this is still a beta feature, here are a few pointers to keep in mind:

• Be sure to specify fixed pixel values when setting the width and height of the ad to be served.
• Make sure that the specified width and height match one of our supported ad sizes. Please note that link unit sizes aren’t supported at the moment.
• The new ad code is responsive on initial page load only. Subsequent changes to the ad size, such as a screen orientation change, will not cause a new ad to be displayed. We know that this is an important feature for many of you and we’re currently working to address this. 
• Always set a default ad size in case some media queries aren’t supported.

Step 1 - create a responsive ad unit

Step 2 - modify the sample CSS media queries in the new ad code

More detailed examples and steps to get started can be found in our Help Center. If you’d like to know more about responsive design, have a look at our Google Developers resource. Thanks for all of your feedback on responsive web design to date. Please do continue to share your suggestions so we can keep improving AdSense for you. Watch this space for more news and updates in the near future!

Tweet