Responsive Web Design and your Enterprise

"You can have any color as long as it's black." - Henry Ford. The trouble is, on the web we are not content to just have a black Model T.

The evolution of web, and the web access mechanisms means that websites are no longer just about detecting a screen resolution, and figuring out whether the browser is IE or something else (and use / ignore appropriate IE hacks). More importantly, mobile user experience has become key to serving customers and prospects more effectively.

It means that now our websites need to have the web in other colors, shapes and sizes, and to support and correctly deliver a usable experience to the plethora of screen sizes, resolutions, behaviors (tap, double tap, orientation change) that mobile devices have added.

Offering a consistent web user experience on different form factors is the problem that responsive web design is trying to solve.

At a higher level though, one can think about Responsive Web Design as a philosophy that is about caring for your site visitors, and making the overall site user experience more usable.

From a technology perspective, the general set of articles on the web typically refer to inclusion of elements such as fluid grids, CSS3 and media queries to determine viewport sizes, orientation detection etc. often combined with usage of JavaScript libraries such as backbone.js

All of this enables a smart website that can be downloaded to your browser, and based on the browser size, resolution etc. modify its appearance and fit in correctly. It is a cool experience and you can see the webpages automatically add / remove images, change image size and text layout etc. It's...magical ;-)

While all of this is great, the RWD solution may pose some limitations for the Enterprise space, especially when a business is using vendor software that typically uses its own CSS etc. 

An alternative way to approach the responsive web design user experience (may not be the purist idea of RWD which is more specific to the Fluid grid + Fluid Images + CSS3 / Media Queries ) is to consider a server side user agent detection (If your website / web application has a server side capability e.g., JSP or Visualforce / Apex based).


In this case, you can choose to do a Server side user agent detection and navigate to a different version of the website (so a mobile or a desktop version). 

This can certainly reduce the amount of CSS3 wizardry that a pure RWD site would need. Also, by making that redirection, features that are key to different devices can be enabled / disabled, but it comes with its own set of baggage, notably reliability. 

Yet another alternate can be to introduce a Client side JavaScript based detection (assuming one can inject custom JS in the vendor generated webpage), that either redirects the user to appropriate page, or prompts user with a link to the appropriate version of the website for an on-click navigation. This comes with its own set of limitations.


So, where does that leave us...As always, "it depends". There are certainly more than one approach to consider, and there is no one size fits all especially when it comes to Enterprise websites. However, RWD is a step in the right direction and if you are not thinking about it, this may be a good time.