The Root of Mobile First and Responsive Web Design

t was before EthanMarcotte had came up with the revolutionary idea of Responsive Web Design (RWD), LukeWroblewski coined the term that would in essence complete the meaning of responsive web design, Mobile First. Like any great philosophy it guided the right idea to the correct path so it can reach its true destination. It is sad Luke Wroblewski is not as appreciated as Ethan Marcotte when he came up with the term an year before the world would know responsive web design.

It can be argued Luke Wroblewski is only talking about making websites for mobile first and it wasn’t about responsive web design. Though on a closer look what he talks about in the article are now the features of responsive web design. His book Mobile First came out in 2011 which actually included the principles and the philosophy behind this idea and how it was the yin for the yang (responsive web design).

Little can be said about mobile first which haven't already been said before. Surely this idea stems from the need to make websites more adaptive, fast and interactive but what strikes the chord cleanly is progressiveenhancement (PE). This technique came up against the aged gracefuldegradation, a technique used to make a website cross browser compatible even in the lesser advanced versions. It employs making a website for a better version first then slowly dumb down the code according to the version of the browser.

Progressive enhancement emerged from the need to make a code which is useful and less cumbersome. Instead of tearing down the code start from the basic and build on it,thus the debate rages on. The need for mobile first approach in responsive web design reflects the need of progressive enhancement.

They both share uncanny similarities

• The code for a website should be first written for a mobile.
• The layout, design and content should be explicitly for mobile- crisp and informative.
• Code for other platforms is built upon the original adding bit and pieces of everything.
• The initial and final design is same in the functionality (an essential aspect of progressive enhancement).
• The thumb rule of mobile first is to make the base code maximum functional and least extravagance as was in PE. This doesn't mean the website looks bad it simply says to remove unnecessary cluttering from the web page.

Progressive Enhancement, mobile first and responsive web design form a close intricate circle where either rely on the power of other two to work. They are the holy trinity of the most modern, aesthetic and functional web design.