Since the publication of Adartive Web Design by Aaron Gustafson and Responsive Web Design by Ethan Marcott (the Russian edition is called Responsive Web Design ), there is a debate in the community of web designers and developers about the differences between these 2 approach. Some believe that these 2 concepts are synonymous, and others that they are completely different concepts. But, as you know, the truth is always somewhere in the middle, so I offer you the translation of the article by the Finnish web designer and developer Viljami Salminen “Adaptive vs. Responsive, what's the difference? " :There seems to be some confusion about these terms and what they mean, so here are my thoughts on this topic and a few links to reinforce them. I, as a rule, are not very passionate when it comes to discussing something, but this time I would like to clarify this matter, because I hear it very often.
“Responsive Web Design” (Responsive Web Design) is part of a broader concept called “Adaptive Web Design”. When it comes to responsive web design, we are referring only to the layout of the web page (Ethan Marcott, “rubber” layout, flexible images and media queries).
')
On the other hand, “Adaptive Web Design” includes much more than just a “rubber” layout. In practice, this is almost the same thing as
progressive enhancement (progressive enhancement). In short, this concept means that we strive to provide the best opportunities for the widest possible audience. Also: do not mix the concepts of “Adaptive web design” and “Adaptive layout” (Adaptive layout), because these are completely different things.
Finally, “Adaptive Layout” means a layout made by combining a set of fixed horizontal dimensions (widths). Now, it seems to me that if everything is done correctly and blocks of fixed width are combined with “rubber” blocks, then the Adaptive layout can be considered one of the forms of responsive web design, and not just its alternative. Zeldman already expressed a slightly similar idea in 2011 in one of
his blog entries .
Translator's note. Unfortunately, it is difficult to understand from the text of William Salminen what an “Adaptive Layout” is, so I will try to explain what this means in my own words. The approach of Ethan Marcott involves the use of a “rubber” layout (width, padding and margins are set in percent), and the adaptive layout assumes that for each screen size we use our own style rules, in which the fixed element sizes (in pixels) are fixed. A more detailed description of this approach can be found in the article "Switchy McLayout: An Adaptive Layout Technique" ( translation ).
Links
Update v1. If my article has made these 2 concepts more difficult to understand than they really are, then I will try to explain everything in two words: responsive web design is part of responsive.
Responsive web design = “rubber” layout , while
responsive web design = “rubber” layout + progressive enhancement .