September 10, 2015

Adaptive or Responsive Website Design?

responsive website design

As you have already noticed, everyone has been talking about responsive website design lately. In the past few years, responsive has become “a must” framework for web designers. But what would be the right concept to consider when creating for the modern user – responsive or adaptive?

What is adaptive?

The ideas behind adaptive and responsive website design are similar, but not the same. They differ in the HTML and CSS, as well as in the way of serving the information to users. The phrase “adaptive web design” was invented by Aaron Gustafson. It utilizes “many of the components of progressive enhancement as the way to define the set of design methods that focus on the user and not on the browser”. The idea is to create adaptable experiences that shape themselves to the particular device. The adaptive design will change (adapt) to fit predetermined screens and sizes of a device. Call us to learn more.

What is responsive?

The phrase “responsive website design” was the invention of Ethan Marcotte. The idea of responsive design is that design should respond to user’s behaviour depending on different screen sizes. It should benefit users with the same layout when switching their laptop to a tablet or smartphone. The website should adjust automatically to accommodate for resolution, image and content size. That eliminates the need for designing different concept for each gadget. Responsive website design allows the site to change fluidly and respond to fit any screen or device size. At Eggs Media Toronto Web Design Company, we always strive to follow recent design and technology trends.

responsive website design laptop

Adaptive and responsive website design differences

The biggest similarity is that both of the concepts allow websites to be compatible with every device so that we can be able to view websites on various screens and resolutions, laptops, tablets or smartphones.

Responsive website design allows the whole page to delivered to the device browser. The browser then changes the way the page appears, so it fits into the dimension of the browser window.

Adaptive relates to the server itself and allows the server to detect the attributes of a device before the page delivery. The server can load a version of the site that is optimized for a device – its dimensions and features. For adaptive, the server performs it’s best to deliver an optimized page. For responsive, the device carries all the hard work.


As a conclusion, both methods have the same idea – to serve the user better providing the best experience, as well as aiming to deliver compatibility while using different devices.

The two differ in their delivery: adaptive web design is based on predefined screen sizes, and responsive website design is based on flexible grids. Also, responsive might take more code and implementation strategies with the flexible frames, while adaptive has a streamlined, layered approach.

If you are thinking between the two, there is no universal answer. You should always focus on a client and make sure to create a common experience for them. Both methods are the right ones as long as they provide the experience for the particular project/customer and their needs.
Find more about designing the best web experiences, check out the free e-book Web UI Design Best Practices.

Check out our other blogs below:
1. Web Design Mistakes You Might Be Making.
2. Mobile Web Design: What You Need to Know.

Print Friendly, PDF & Email