Responsive and Adaptive Web Design

Adaptive mesh refinement illustration

Should your website be adaptive or responsive in its design? The takeaway from a post by Veronica Raducan on that questions is that while responsive and adaptive aren’t superior to one another, they are different designer tools.

I would disagree somewhat and lean much more to responsive as I see few reasons to use adaptive design. Currently, adaptive is the less common choice.

Responsive designs work by creating a single version of a web page, which then “responds” to the resolution and screen size of the visitor’s device and rearranges elements of the page so they comfortably fit the dimensions of the device.

Adaptive web design, on the other hand, requires the creation of multiple versions of a web page, usually desktop, mobile or tablet. Once the site identifies the visitors’ type of device, it then displays the version optimized for it.

Responsive has wider support and adoption, and is certainly less work for the web designer.

Responsive is also more flexible in that there are many existing screen resolutions used across all devices, and new ones are always appearing as screens on smartphones and monitors continue to evolve.

So, why would anyone choose adaptive?

One reason is if you want to target certain users or devices. If you are building a site for iPhone users, a responsive design will adapt the best it can, but you could design specifically for the iPhone X at 2436 X 1125 pixels.

Also, an eCommerce site may use adaptive design because they rely heavily on conversion optimization and apparently responsive designs aren’t as well suited for this because what works on Android, might not work on an iPhone and what works on Macs may differ on PCs.