Responsive web design or Adaptive web design

Posted By : Milind Ahuja | 30-Nov-2017

It's a pretty good and common question that you might have seen very often. The responsive website is one of the great concept and it is very important for us to know what makes a "responsive" website and how it is different from an "adaptive" one.

 

Let's have a look at the difference between them:

 

Adaptive Vs. Responsive Design February 21, 2017 by Jenna Erickson 3 Comments Adaptive Vs. Responsive Design

 

Responsive sites and adaptive sites are the same in terms of the appearance, as they both adjust the user Interface of a website, depending on the width of the browser window they are being viewed on. However, It's the way in which they do this, is what makes these two techniques different from each other.

 

Responsive websites respond to the browser's size at any given point. It doesn't matter what the browser width may be, the site adjusts the layout in such a way that it is optimized to the screen. 

 

A responsive website is completely fluid and therefore will respond to the viewport where the size of the browser window doesn't matter. The reason behind this is the percentage based CSS properties, on which the styles are based on.

 

Doesn't matter, if the browser width is 400px or 40000px, the page will always adjust itself to the proportion specified to it, which always looks good

 

On the other hand, Adaptive websites adapt to the width of the browser at a specific points. It is different from responsive design in a way that there is not the layout that always changes. Adaptive design uses a series of static layouts based on breakpoints. Let' say, you design a website at three different sizes: 320 for mobile devices, 760px for tablets and 960 px for desktops.

Unlike responsive design, adaptive design, instead of one flexible design, detects the device and other specifications, and then accordingly provide the layout based on predefined set of viewport sizes and other features.

Responsive design is smooth as the view adjusts fluidly regardless of what device it is being viewed on, while adaptive one, snaps into place.

 

Having differentiating between responsive and adaptive web designs, it can be said that almost any of them has it's own advantages and disadvantages. To choose the proper solution depends more on the requirement of the project.

 

THANKS

About Author

Author Image
Milind Ahuja

Milind is a bright Lead Frontend Developer and have knowledge of HTML, CSS, JavaScript, AngularJS, Angular 2+ Versions and photoshop. His hobbies are learning new computer techniques, fitness and interest in different languages.

Request for Proposal

Name is required

Comment is required

Sending message..