How to combine responsive design with content management

  • Previous
  • 1 of 2
  • View as single page

Responsive design is getting plenty of attention these days, and for good reason. Mobile internet traffic is increasing exponentially -- by 2014 "mobile" web traffic will surpass desktop traffic. This paradigm shift creates new opportunities along with new challenges.

One of those challenges is making your website mobile-friendly. Historically, this change has been made by "forking" the website that already exists. This move involves creating a new website and duplicating content, which doubles the effort required to manage your web presence. Despite all the work, forking could be doable if it truly solved the problem -- but it doesn't.

Statistics show there are more than two devices (mobile and desktop) accessing our websites at any given time -- devices like smartphones, tablets, netbooks, laptops, widescreen displays, and more -- and it's not realistic to create dedicated websites for each device out there.

Responsive design promises to solve this challenge by using web standards to create a single website that is automatically optimized for all devices. Compared to the alternative, it's easy to understand why enthusiasm surrounds this topic. However, most of this attention is focused on the high-level benefits or the underlying technologies (CSS3 Media Queries). What isn't addressed is how responsive design will be incorporated into the day-to-day content management process.

Responsive design is hard to mix with the content management process

Today, most web content is authored by people who do not have a strong understanding of the underlying web technologies. By interacting with content management systems and rich text (WYSIWYG) editors, content authors can compose web content without being bogged down in technical details -- and that's a good thing. It enables more people to create content and shortens the distance between ideas and execution.

However, responsive design requires careful use of HTML and CSS3 and is easily "broken" if best practices aren't adhered to. For example, tables are often innocently used to create ad-hoc columns on a page. But on a smartphone, there might not be room to display a four-column table. And when tables are used for layouts, it becomes impossible to use responsive design to optimize the page.

These examples are a few out of many that show how CMSs often allow (or even encourage) unsuspecting content authors to break a responsive website. And because the website adapts uniquely to each device, content authors are often unaware anything has happened. This situation results in websites that quickly degrade and forces a return to the days of the "webmaster," when all content changes went through a programmer.



Peter Marino
Peter Marino November 16, 2012 at 12:32 AM

There are WordPress templates available that have responsive tables so its not really a problem if planned well.