Difference Between Responsive Web Design and Adaptive Web Design
The above blog well describing the difference between responsive and adaptive web design factors.
I disagree. Who says that the term "responsive" limited to client-side techniques? I think that the distinction responsive/adaptive is spurious and does not reflect actual usage of the term.
Responsive Web Design aims to provide optimal viewing experience, that is reading and navigation with minimum of resizing and scrolling, by the use of fluid, proportion-based grids, flexible images and CSS3 media queries. Each responsive web page resizes and rescales its layout and navigation structure according to the screen size of the clients viewing device. Here all the changes for new display are made in the client side.
But in Adaptive Web Design these changes are made in the server side to respond and adapt to different screen sizes.
"Distinct templates are optimizing for each device." that's for Adaptive Web Design, with so many devices that are out there one would end up with a boat load of "Distinct Templates". In my opinion it would be better off not worrying about a particular device, besides there's a reason people call cellphones "Smart".
Says who??? What purpose does inventing different terms serve??? Responsive design is responsive design, irrespective of how it is implemented. Lets get our heads out of our a...s!
Originally Posted by florasmith
yeah its true that responsive sites are automatically adjust according to the screen size but the adoptive are based on the server side..
Adaptive design is when distinct templates are optimizing for each device where as responsive design are optimizing for all screen sizes.
Who today (apart perhaps from maintaining legacy sites) uses templates for each device???
Originally Posted by mehrishaly
True responsive design is fluid, using CSS3 media queries to respond to any screen sizes. With the use of this CSS3 module, you can create a flexible grid where text can wrap and images can shrink to adjust along with your browser. Adaptive design uses a series of static layouts based on breakpoints. For example, you may design a webpage at three different sizes: 320 for mobile phones, 760 pixels for tablets, and 960 for desktop browsers.
Have you not heard of media-specific style sheets? E.g.
Originally Posted by anirban09P
This example uses:
<link rel="stylesheet" href="style.css" title="styles" type="text/css">
<link rel="stylesheet" media="screen and (min-width:480px) and (max-width:799px)" href="mobile.css" title="styles" type="text/css">
<link rel="stylesheet" media="screen and (max-width:479px)" href="handheld.css" title="styles" type="text/css">
<link rel="stylesheet" media="handheld" href="handheld.css" title="styles" type="text/css">
a) A default style sheet for all devices, (including browsers that do not understand media-specifics e.g. IE8 and below).
b) An intermediate style sheet for mobiles with 480px to 799px displays.
c) A minimalist style sheet for handhelds and mobiles with screen widths 479px and below.
I.e. Good responsive design uses breakpoints, not just fluid layouts, because they accommodate a wide range of display sizes with minimal shuffling about of the content (which can look naff).
Last edited by jedaisoul; 04-18-2014 at 05:16 AM.
I'm listing 5 main differences here:
1. The very first difference between Adaptive Web Design and Responsive Web Design is that the former one will thoroughly change to fit the screen and device dimensions whereas the latter one will fluidly change and respond to fit a set of devices and screen sizes.
4. Adaptive web designs are implemented on a pre-existing site whereas in case of a responsive web design, you need to rebuild the site from scratch.
5. Websites designed using AWD have images that are optimized for specific device screen resolutions whereas the ones designed using RWD contain images that are first downloaded and then re-sized to fit the respective device.
Convert PSD to Responsive web design is fluid, with the help of CSS3 media queries to respond to any screen sizes. where as Adaptive web design is using a series of static layouts and it completely based on breakpoints.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Tags for this Thread