Responding to Responsive Design

For much of the past year, my colleagues at the IAB and I have been beating the drum of “mobilizing the web.” I fully believe in that mandate (see “Tap Into Mobile“); however, it’s easier said than done. The messily fragmented world of mobile, with dozens of smartphones, tablets, and in-between devices, makes it practically impossible to build custom content for every screen.

Rather than wishing for an unlikely device monopoly, mobile media needs technical solutions to help optimize content across devices. Thus the growing buzz around something called “responsive design.”

Responsive design takes two forms today:

  • Responsive web design (RWD) is any technology that automatically changes the appearance (content or layout) of a web page to make it fit appropriately, legibly, and beautifully on whatever screen the user is looking at.
  • Responsive creative design (RCD) does the same specifically for advertising creative.

Responsive design solutions break a page or ad down into assets that can be resized, repositioned, added, or subtracted according to pre-set rules depending on the available screen real estate. The same JavaScript and HTML framework might appear as a multi-column page with side navigation and video on a PC, but as a single column, top-navigation page with a still image on a phone. An IAB wide skyscraper ad unit on a large screen might become a medium rectangle ad in closer quarters.

I’ve been working with a group of IAB members to write a new overview of responsive design. The following are a few observations from that paper.

With Great Tools Come Great Responsibility

Responsive design has the ability to make the web a more flexible place, and to give consumers on all of today’s, and even tomorrow’s, devices a good experience with content and ads. But responsive design is not a panacea. It would be a mistake to think “just deploy responsive design and you never have to think about presentation (or phone or tablet users) again.” Responsive design is a tool – it can speed execution and delivery, but it does not replace the human expertise needed to ensure a website succeeds or an ad captivates across screens.

Responsive Design Requires Responsive Business Practices

It’s also tempting to think of responsive design just in terms of cost-savings and future-proofing content development. But of course the size and layout of content and advertising have a direct business impact.

For example, web publishers considering RWD must understand whether ad sales will still be able to sell smartphone, PC, and tablet ads separately; how ad positioning (“above the fold” vs. “below the fold”) changes as layout modifies itself; and the metrics ad operations can obtain on ad and site performance. Marketers thinking about RCD need to consider its impact on standard practices like quality assurance and creative approval, and how delivering multiple ad sizes or placements via a single tag will affect their ability to monitor and analyze campaign performance. Evaluating the business-practice ramifications is critical to making an informed decision on deploying RCD or RWD.

Redefining Standard Ad Units?

The IAB was founded way back in 1996 to standardize banner ad sizes across web publishers: the need to build custom ads for each web publisher was harming the growth of digital advertising. Ironically, if RCD had been available then, the IAB might not have been necessary.

I’m not worried about RCD putting the IAB out of business today. There is plenty of work around metrics, ad operations, public policy, and education to keep us busy. But I do believe responsive design could be transformational. If RCD gains wide adoption as a cross-screen solution, I can imagine a future where the IAB defines standard ad units not by how big they are in pixels, but by how they behave and how users interact with them. The IAB’s Mobile Rising Stars point in that direction, and I’m excited to see how else the industry responds to responsive design.

Related reading

A QR code which leads to the URL for the ClickZ article about QR codes. Meta.