web designdefinitions of responsive and adaptive
This article was written in 2013. It might or it might not be outdated. And it could be that the layout breaks. If that’s the case please let me know.
Yesterday I wrote a little post about the exact definition of the terms responsive and adaptive, in which I asked for comments. And I got some comments, and all of them were excellent. It’s clear that my hypothesis at the end of my post —
it could be that I haven’t thought about it long enough — turned out to be true.
But first this: When I reread the article I noticed that one remark I made may sound a bit harsh. I wrote that I think that
Ethan’s definition is a little outdated and unnecessarily restrictive. This is unnecessarily rude. His definition made perfect sense back when he introduced it, and back then it was not restrictive at all. On the contrary, the term responsive design changed the way our industry looks at the web. Finally. For this he has my eternal gratitude.
As Ethan mentioned in his comment, he currently uses a broader definition. Which is logical, we’ve been only designing responsive sites for a little over two years, we’re still learning. And one of the things we learned is that there are more features you can optimise for than just screen size. So, with this out of the way, let’s see if we can come up with a definition of the terms responsive web design and adaptive web design.
There were three different attitudes towards my question. The first one considers these terms to be somewhat the same. I used to have that attitude. Another one considers these terms to be jargon, and as such to be confusing an sich. These terms should simply be replaced with a sentence like making the best possible product. And then there’s the third attitude which considers a clear definition to be valuable and which thinks a distinction between these terms actually makes sense.
Attitude one: it’s all the same
This attitude exists because everybody has his own definition of the words responsive and adaptive, often meaning completely different things, and often meaning the exact opposite of their original definition. This is a clever solution for large agencies with many clients, I think. Instead of using clear, distinct meanings for these terms, we use them as a catch-all definition for a set of web design best-practices. In this case, I use them as a synonym for progressive enhancement and accessible design. Most commenters did not agree with this attitude, and I think I agree with them. But I do think that within a large organisation this might actually be a clever idea.
Attitude two: kill jargon
This attitude doesn’t care about these terms and considers it a waste of our time to discuss in length about them. It should really only be about
providing an experience which takes advantage of all the features of the platform people are using […] whether it is based on web standards or technologies provided by the vendor, like Cyriel wrote. In other words: Stop wasting time about trivial matters, and start making good stuff. I definitely like this sentiment, but it’s not going to end the confusing use of these terms.
Attitude three: we need a clear definition.
There are some excellent reasons for using clear, distinct definitions. For example, David reminds us that
our clients are starting to use that jargon, and we need to be sure that we are talking about the same thing with our clients. Or as Aaron puts it:
I feel nomenclature is incredibly important to ensure accuracy in our communications. They both mention the confusion around the term HTML5 which has a different meaning for marketers and developers, which makes things unnecessarily complicated.
A few commenters tried to come up with clear definitions. Simon came up with some fantastic, short definitions.
Responsive web design is about browser (viewport) sizes and Adaptive web design is about browser (use) context
I like that. Even though the term context is equally confusing as these two definitions. Maybe we could use features instead of context here.
And I think Aaron came up with a nice description of responsive:
it’s concerned with layout, hierarchy, and creating an optimal reading experience regardless of device.
Responsive web design is about browser (viewport) sizes. It’s concerned with layout, hierarchy, and creating an optimal reading experience regardless of device.
Adaptive web design is about browser (use) features. It’s concerned with responsive web design and with creating an optimal user experience depending on different devices.
I need your help with this one, especially with the definition of adaptive. I don’t think it’s good enough yet.
There is a difference between the terms responsive and adaptive and we have to be able to make a clear distinction. To prevent confusion with clients we should make sure that we are talking about the same thing when we use these terms. There are practical approaches possible, where the exact term used doesn’t really matter as long as we know we mean the same thing, but a more thorough solution is probably to use the right terms in the right moment.
Thanks all for your fantastic feedback. If you have some time left maybe you could help me out with finding the definite definition for both terms. Comments are open again.