Responsive Web Design

Responsive Web Design

As someone who's not into Web Design, What probably comes to your mind when you hear the word Responsive is "Answering or Responding", Correct! that's exactly what it means literally but it means a whole different thing when it comes to Web Design.

A little bit of history:

Websites before were designed to be accessed and displayed on a desktop or laptop so users would have to zoom in on a small screen to make text readable, then had to scroll around endlessly to see the whole page. You wonder how exhausting that could be.

This all changed in 2010 when the term “Responsive Web Design” was coined by Ethan Marcotte in his paper “A List Apart”.

As we proceed can we do a simple task together, as you're reading this your mobile phone screen is currently in portrait by default, now can you put it on auto-rotate and change the screen to landscape, Good! you can see how the content adjust itself to the changed size of the screen, have you ever wondered how the same page could re-orientate itself to a bigger laptop screen and small mobile screen whether portrait or landscape at the same time? it's nothing new right? and you very familiar with this you just might not know what mechanism is responsible for it, and that's simply what Responsive means in Web Design.

Responsive web design is a "design approach that addresses the range of devices and device sizes, enabling automatic adaption to the screen, whether the content is viewed on a tablet, phone, television, or watch".

Web Responsiveness made it possible to access Web pages on any device type, small or big while maintaining it's resolution. that's beautiful, right!

According to History, Ethan idea paved the way for websites with a single URL(Uniform Resource Location), that would automatically recognize whether the user was on a phone, tablet or desktop, and re-adjust the page to display it in the best way suitable for the screen.

A responsive Web page is to a device screen what water is to its container.

In summary, Responsive web design is about creating web pages that look good on all devices!