When I try to prototype a website thinking in the IAB display advertising guidelines using a grid system (960gs - 10-60-10) the only banner that fits in a 3 column space it's the half banner (300x250) so what do you recommend?

The logical response could be planning thinking in IAB ads spaces and forget the grid, if I use responsive layout I need to let the banners float but the aspect of the site sometimes looks strange.


Disclaimer: I work for ResponsiveAds

Implementing IAB standard advertising on responsive layouts that have fluid grids is indeed a bit tricky and in most cases it requires ad units that also respond to screen size.

My personal opinion is that the best solution is to have a 300x250 or 300x600 (half page) ad that would have the capability to shrink ~10% proportionally (maintaining the same aspect ratio) and then swap to perhaps 160x600 (wide skyscraper) and swap again when reaching mobile screen sizes to 320x50 (mobile leaderboard).

This way you can have the ad always stay above the fold, which is what the advertisers are most likely paying for. ResponsiveAds has a good solution how to create these ad units that can dynamically change size and shape.


You can customize 960.gs with this app http://grids.heroku.com/.

But I wouldn't suggest you to change it too much. You can always leave space around the banners.

  • I thinking in a solution with fluid layout and change the banner depending on the screen size, ill hope to share soon – Ulises Rojas Jul 27 '12 at 15:52

This is always a challenge.

Really the approach is as you note to take (all) the ad units that you are required to incorporate - this is most likely a revenue stream for the client - and build a grid around this, the ad units are your design constraints.

Have a read of Mark Boulton's thoughts for more detail and the (still) current failings of the ad (sales) world.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.