Responsive vs. Adaptive Web Design

There are many ways to convey information. Even within the medium of websites, there are different technologies and methodologies to present the same content to the person visiting your website.

One topic that can be confusing for business owners is knowing whether their website should be adaptive or responsive, and what the difference between the two is.

What is responsive web design?

Responsive web design describes websites that are built to display on a variety of devices. In the mid-90s, websites needed to display on mostly large CRT monitors on desktop computers — that’s what was available for accessing websites (through a 56k modem). However, since then, the web has evolved to be accessible on laptops, tablets, smartphones, and other mobile devices such as the iPod Touch and even wristwatches. In turn, to make these websites easy to see, read, and understand; responsive design shows the same information but with an intuitive layout, with text and image sizes that change to fit based on the device used to access that website.

What is adaptive web design?

Adaptive design is similar to responsive design in that the web page reacts to the device being used to view it. Adaptive web design is synonymous with the concept of progressive enhancement — showing a basic website for smaller and simpler devices, and showing more elaborate or complex designs or features on machines such as laptop and desktop computers. When a website is built for desktop devices only, implementing adaptive design techniques is a good way to allow thecontent on a site to be accessible on different devices.

What’s the difference between responsive and adaptive web design?

A responsive website shows the same content in different layouts based on the device used.  Adaptive web design does the same thing, but the process of displaying the content is less flexible.  With adaptive web design, there are fixed layouts at specific breakpoints, rather than fluid layouts that change with different screens. Adaptive design allows web designers and developers to tailor the website experience of a site to have the bare minimum in terms of mobile and tablet device access.  Responsive design is a more thorough and smoother approach to website accessbility across devices and screen sizes. Site visitors might not know if the site is adaptive or responsive. What matters most, of course, regardless of the approach taken to designing the website, is what’s on the website.

Tags: Questions & Answers • Web Design