Responsive Web Design and Responsive Frameworks

In this session, we will learn about Responsive Design and will check out some of the popular frameworks related to it. So, without much further ado, let’s begin:

What is Responsive Design?

“Responsive web design (RWD) is an approach to web design aimed at crafting sites to provide an optimal viewing experience—easy reading and navigation with a minimum of resizing, panning, and scrolling—across a wide range of devices (from desktop computer monitors to mobile phones).” 


– Wikipedia


In other words, a RWD is a design which ‘responds’ or ‘adjusts itself’ to the device rendering it. This is achieved by using:
    • Fluid grids or Proportion based grids: Use relative units instead of absolute ones to size page elements. E.g. A page element measured in x% of the screen-size would be more flexible and adaptive than the one measured in fixed pixels or inches.
    • Flexible images: The above relativity principle applies to images as well.
    • CSS3 media queries: This allows one to use different CSS rules to configure the page according to the device.

What is a RWD Framework?

As one can imagine, the emergence of smart-phones and tablets as the primarily used devices for web browsing has necessitated the new (also the old) websites to adopt RWD in a big way. This necessity in turn, has given rise to a lot of techniques, which again by virtue of being similar (they have a common goal!), have lead to many RWD Frameworks. These frameworks are nothing but ready-made packages made up of a structure of files and folders of standardized code (HTML, CSS etc). These include pre-defined styles and rules such as the grid width, font sizes, button and form styles etc. which help us to create RWD compliant websites without reinventing the wheel every time!

So which Framework to use ?

Like we discussed above, since RWD has come up in such a big way, a lot of frameworks also have evolved. While the goal of each is to provide RWD compliance, they differ from each other based on the solutions they offer in terms of complexity of the design and the amount of flexibility one is after. Here, I will be providing a list of few popular frameworks with their features:

For more Information, Please visit my full Blog: Responsive Web Design

Responsive Web Design
Responsive Web Design
Advertisements
Responsive Web Design and Responsive Frameworks

2 thoughts on “Responsive Web Design and Responsive Frameworks

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s