By Jennifer Frazier/The Creative Stable

Back when I was a budding young reporter at the University of Missouri’s Journalism School, the highest honor you could get was a front page story placed “above the fold.”  Even though that was, dare I say, over 30 years ago, the term stuck in design circles and even attached itself to websites in the late 1990s.  I can remember looking at a website that “scrolled to China” and think how clunky it looked to my trained eye.

But the times, they are a’changing.  Above the fold is irrelevant in web design today.  Why?  Because of social media and the explosion of tablet and smartphone use.  It has changed the way people consume information on their computer screens and mobile devices.  “Scrolling to China” is not only expected, but anticipated, as each swipe of the finger leads us to more and more engaging and welcome content on our Facebook pages, Pinterest boards and Twitter feeds.  Sixty percent of us, according to The Pew Research Foundation, would rather read our news via a tablet or smart phone app than on our computer screens.  Time was, the PC market dictated the need for a website that contained itself on the screen.  Today, confining a website in a box is a missed opportunity.

Consider this – for the first time since 2001, PC sales are projected to be lower than they were in the previous year.  Instead, tablet sales area expected to exceed 100 million in 2013.  According to Nielsen, the majority of U.S. mobile phone subscribers now own smart phones instead of feature phones.  The shift to mobile is happening at light speed, leaving many companies scrambling to create websites that can be viewed in any environment.

The solution to this new challenge is responsive web design.  A million new screens have bloomed over the past few years, making it essential to design websites that are equally impressive on any of the more than 2,500 different devices available today.  It’s called responsive because the website automatically resizes itself for optimum viewing on the device it’s been accessed on.

Here’s how it works.  A responsive web design uses media queries to figure out what the device’s resolution is that it’s being served on.  Flexible images and fluid grids then size correctly to fit the screen.  The benefit are obvious – build a website once, and it works seamlessly across thousands of different screens.

As Ethan Marcotte, the author of Responsive Web Design, explains “Now more than ever, we’re designing work meant to be viewed along a gradient of different experiences. Responsive web design offers us a way forward, finally allowing us to ‘design for the ebb and flow of things.'”

The largest responsive web design project to date can be found at The Boston Globe, http://www.bostonglobe.com.  Try this, log onto this site, and then adjust your browser window’s size.  Notice how the site automatically reconfigures itself to the new size without sacrificing any visual quality.   Despite your politics, Barack Obama’s campaign was on the leading edge of responsive web design technology; an advantage some feel had a big hand in his re-election because his messages were consistent and digestible on any platform.

So here’s my advice.  Stop thinking in terms of pages, and start thinking in terms of systems – sites that are developed with functionality in mind first and page layout second.   Responsive Web Design is modular in nature and scalable overall.

While Above The Fold was nice while it lasted, long live responsive web design.  It will soon be the way companies are judged for their ability to communicate well in any environment.