What experts say about Responsive Web Design and why?

Benny Alexander June 23, 2014 0 comments

“Now is the time to prioritize responsive design in your budget” – Forbes.com
“With a 55% increase in smartphone subscriptions in 2012 alone, responsive web design is the future of online marketing….” – Moz.com
“We shouldn’t be designing for mobile (specifically). Those experiences should work on all devices…”  Larry Page, Co-Founder, Google.

When I wrote a blog on RWD during November 2012, I mentioned that it would be a long term solution in which companies need to invest on it. When Ethan Marcotte of A List Apart coined the work Responsive Web Design (RWD), he also mentioned that the Mobile browsing was expected to outpace desktop-based access within three to five years based on the study from Morgan Stanley and Mediapost. Ever since its inception in 2010, Responsive Web Design has turned out to be an epiphany of sorts. It has heralded the new mobile-first era that is the dominant trend currently.

The RWD philosophy and practices are increasingly being embraced by businesses who want to target the growing mobile and tablet segment. Here we look at some perspectives from design/development experts and their take on what Responsive Web Design holds for the future of web design.

Brandon Downing at Adage Technologies believes that RWD works wonders when applied correctly. It renders uniform code base that works well across any user or any medium of consumption. Also future changes, updates or revisions become cost efficient. Designers need to worry about just one program/set of code rather than a bunch of codes separately developed for different devices. As for the question of when to go responsive or when to go mobile-only, he advocates progressing as per client needs. If the client requires short-term and cheaper solution, then a mobile-optimized website is a good fit. Responsive design is more for a long term yet more expensive proposition and hence needs careful consideration to ensure that the efforts align to the business need.

 Luke Wroblewski, a digital product leader, believes that designers and end clients need to know when responsive design would serve their needs and when separate sites for separate devices would be a feasible option. He puts forward a few guidelines towards this decision-making process.

Responsive web design is a slightly challenging process that optimizes all content and third-party links across a multitude of device and screen sizes. It provides long-term benefits – one that adheres to the current pack of devices as well as future ones. Go for this approach if –

1. There is minimal access to server-side solutions
2. Layout adjustments need to be carried out across different screen sizes
3. Complete optimization to a particular device is not needed

Device-driven experience comes in when separate interfaces are designed for a separate class of devices. They usually require a distinct front-end design and device detection. Use this approach if

1. Enhanced server-side device detection is needed
2. Separate user experience is needed from different class of devices
3. Complete and maximum optimization to a particular device is essential

Brad Frost and Tim Kadlec of CreativeBloq have an interesting take on keeping RWD as the de-facto design option by web designers.  Brad Frost propagates going responsive by default. However, designers need to ensure that clients clearly understand the difference between responsive and mobile optimized design. This way they can have a factual understanding and help make a better decision about which approach to looking  for. Looking at the current context, a vast majority of sites would perform well with the responsive design and a minuscule number of businesses will need a separate mobile optimized website.

On the other hand, Tim Kadlec feels that growing device diversity is the chief reason to go responsive in today’s times. He believes that server-side scripting too can be handled with responsive elements within a website, albeit with careful planning.

Jay Schwartz of IdeaWorks Studios Inc. supports using responsive design in websites. It works well with grid-based templates. He also advises thinking out of the box with designs that look amazing both on the desktop and on mobile. This is a key challenge that his company looks to address with clients. He advises injecting mobile-centric experience within RWD with options such as –

1. Call-to-actions designed specifically for mobile
2. Do away with load inducing images
3. Hide non-critical text elements.
4. Eliminate long form filling through mobile

Guardian UK – A Real-life Scenario Now that we have had a look at the views different experts hold about Responsive Web Design, let’s examine a real life scenario where a business moved from desktop website to responsive website. Amidst declining sales of print newspapers, the Guardian UK decided to go responsive. Matt Andrews the web developer at Guardian takes us through the steps and the results Guardian achieved with this transition.  

The problem statement the UK news websites received a steady increase in web traffic since May 2011. This meant that most of the readers were moving from print medium to digital medium. While they initially launched a mobile version of the traditional website, this led to problems and prompted Matt and his team to go explore the path of responsive. Some of the problems that led to this shift was –

1. Challenges stemming from dependency on external support for periodic updates
2. Maintenance work on numerous templates and elements became a hassle
3. With around 25% of the Guardian’s subscribers now using mobile for content consumption the reality was too evident to ignore – go responsive or lose customer base

The solution construct

1. The mix of old browsers (25%) and modern browsers (75%) makes it necessary to go the responsive way without burdening the users to download polyfills or JS codes
2. The design team started off by determining what was absolutely essential on mobile while non-critical elements bootstrapped using AJAX
3. They also considered limited resources of mobile by enabled local storage in the form of base-64 encoded strings of web font for future use. They embedded navigation timing API for modern browsers to render pages and content as per the network speed of the user.
4. In a refreshing move, they focused on personalizing based on user preference rather than on device or hardware configuration
5. All external dependencies too were brought in line to their mobile strategy. They also enforced ‘one blocking call per page’ functionality so that the rest of the content / navigation remains undisturbed in case of problems with one image or gallery
6. Since the ability of the site depends on user preference and technology (both of which undergo constant change), the newspaper did not work towards releasing all updates at one go, as they feel that this is an evolving endeavor and will keep undergoing updates in the near future.
7. Also, before actual publishing, a comprehensive and meticulous beta testing was done to gauge server loads and user experience feedback. This means that the go-live day was smooth and free from glitches or nasty surprises.

The result Constant monitoring has reported a boost in a number of page views and visits to the responsive site that were launched in December 2012.  Since this period, it has regularly breached the 15+ million hits in terms of page views. Enough said. If you own one of those websites, which still needed responsiveness or mobile friendliness this is the right time for investing in making it screen friendly. Leave your feedback if you have your opinion on why or why not RWD. We at Macronimous, have started designing Responsive Web Design from our Indian office since late 2012, and delivered over 80 Responsive websites using Custom CSS frameworks, and popular frameworks like Bootstrap, Less, Zurb etc. If you are interested in our services, Or if you like to build your website responsive, contact us for a reasonable quote and continuous support.