BACKGROUND IMAGE: iSTOCK/GETTY IMAGES
When Brooke Becker began developing plans to modernize her company's website, responsive and mobile-first Web design principles moved to the forefront.
The trend toward responsive design is inevitable.
principal analyst, Forrester Research Inc.
Becker, an interactive designer at SpringCM, a cloud-based content management software company in Chicago, realized in 2012 that the job of modernizing the site's look and feel opened the door for a different initiative: the development of SpringCM's mobile website strategy.
That's when the company decided to modernize its site while working to better accommodate mobile devices and multiple browsers. At the time, SpringCM's policy dictated that the website be coded first for desktop-based users, then for mobile devices, Becker recalled. But those practices were "totally insane" and required IT workers to create a second, shadow site and plenty of duplicate manual work that was outdated and confusing.
"There was so much minutiae about sizes and pixels and so on -- and that is just for iOS," she said. "Then you would have to do it again for Android. So it could be very time-consuming for each different environment."
SpringCM solved those problems by adopting a mobile-first Web design strategy.
Website modernization paves way for responsive Web design
Redundant coding work can be a death knell to productivity. So SpringCM -- which makes a software platform that allows clients like Facebook to store and manage documents and associated workflows -- turned to responsive Web design and used the MagicLogix platform and responsive Web design principles reduce the time sink of coding separately for desktop and mobile sites.
The responsive Web design motto is 'Create once, and publish everywhere.'
interactive designer, SpringCM
Responsive Web design is a methodology that enables easy reading and navigation, and automatically adjusts site display to fit a wide range of devices, from mobile phones to tablets to PCs. Technologies like MagicLogix help companies integrate their mobile-first strategy with other design best practices, such as search engine optimization, cleaner code and better load website load times for end users.
"The ability to make changes once and -- wherever our content is -- to have it appear nicely in whatever device someone is looking at, and have content transition and transform to whatever device you're on is huge," Becker emphasized.
According to industry experts like Peter Sheldon -- a principal analyst who focuses on e-commerce technologies at Forrester Research Inc. in Cambridge, Mass. -- website modernization often goes hand in hand with a responsive design approach.
"The trend toward responsive design is inevitable," Sheldon said. "Responsive is not a fad; it's here to stay."
A perfect storm for responsive Web development
A perfect storm is brewing and forcing companies to modernize the website experience, according to Sheldon.
The ability to make changes once and -- wherever our content is -- is huge.
interactive designer, SpringCM
A key component of that perfect storm is the mobile device trend. Predictions are that mobile Web browsing could overtake the desktop equivalent by 2015 -- or sooner. Further, 90% of consumers use multiple screens to access the Web, according to MobiThinking's Global Mobile Statistics 2012 research. As a result, designing websites to accommodate the many ways users want to access them is becoming increasingly important.
The growing popularity of tablets is one of the major factors driving the mobile-first, responsive design revolution, according to Forrester's Sheldon. Tablets now account for 20% to 30% of traffic on websites and "that has finally broken the camel's back," he said.
The proliferation of smartphones worldwide is also creating a tipping point for responsive Web design. "Organizations now say, 'Let's look at responsive [and] build a single site,'" Sheldon said. "It's one code base."
Many companies are moving down a path similar to that of SpringCM and making a shift toward responsive, mobile-first Web design strategies. Hendrix College in Conway, Ark., for example, began using Ektron as its Web content management system in 2005 --- principally to create cohesion among many diverse Web pages.
"We had a massive site that had as disparate design styles as could possibly be," noted Jay Burling, director of Web applications at Hendrix. "We wanted to use the opportunity of moving to a content management system to democratize site editing so that editors didn't have to know a bunch of HTML code, and we wanted it to look like one Hendrix site."
Ektron helped the college modernize, unify and create brand cohesion. By 2011, however, another redesign effort sparked the need to accommodate mobile.
"We were looking at redesigning the site and wanted to make sure that mobile-friendly was a tenet of the redesign," said Josh Daugherty, lead designer at Hendrix.
Using Ektron and homegrown Web design tools, Hendrix created various page templates that enable content to dynamically shift according to the device or browser that will read it. "It is up to our imagination how Ektron's content and tools are displayed. They provide a sandbox for how we want content to display," Daugherty noted.
End users, end users, end users
For Becker and the technology pros at Hendrix, however, the common denominator is end users. When the people who browse their sites are happy, that is a sure sign of success.
According to Becker, responsive Web design is ultimately all about making her workflow more efficient in the service of a better user experience.
"The responsive Web design motto is 'Create once, and publish everywhere, for every type of device,'" she said. "If Apple comes out with a new device, our site will be responsive to that device."