Home » News » Adaptive Web Design – Do you know it?

Adaptive Web Design – Do you know it?

adaptive-design

Nowadays, a website will not be considered “completed” if it does not support mobile devices. There is amazing fact that at the end of 2011, mobile traffic just accounted for nearly 8% of all observed internet traffic in the United States. But the mobile traffic was up to over 50% in 2014 – a staggering growth!

Before, optimized for mobile is a “consider” option, but now it’s MUST. User needs have changed and now users want to use a website to be able to bring the best experience on any device, from desktop to mobile. So, Adaptive Design becomes a great solution for web developers/designers. In this article, we are going to talk more about adaptive web design; here are some of the benefits from my perspective.

RESPONSIVE DESIGN

Responsive Design – perhaps this is no longer a concept so stranger to us. Responsive Web Design (RWD) has emerged and developed from 5-6 years ago and now it’s very important to web design. Simply, responsive design is a design that can stretch and rearrange itself based on the width of the browser rendering the site. In the past, to optimizing for mobile devices, we need to create the different version of website and the servers would serve up whole different websites after detecting the devices that visitors use. So we have desktop version and mobile version separately, mobile version is just a simplified versions of their parent sites with limited functionality to increase page speeds over a slow connection.

When tablets became popular, there was a need for websites that sat between smartphone and desktop. While smartphones also become smarter, there are many more resolution that website need to serve. So, it will take much effort and resources if you create individual sites for each device.

The problem has been resolved with RWD by resizing and arranging elements on the screen to fit the user’s device. Responsive design brings an advanced solution which very easy to implement and maintain as websites evolve with more functionality.

PROGRESSIVE ENHANCEMENT

Progressive enhancement is a strategy for web design which uses web technologies in a layered fashion that allows everyone to access the basic content and functionality of a web page based on a user’s capabilities. It also provides an enhanced version of the page to those with more advanced browser software or greater bandwidth.

responsive-vs-adaptive

RESPONSIVE DESIGN + PROGRESSIVE ENHANCEMENT = ADAPTIVE DESIGN

Now, we combine concepts of Responsive Design with concept of Progressive Enhancement, and then we have the new concept: Adaptive Design. There is still some debate over the use of “adaptive design” vs “adaptive layout” but it isn’t important.

The important thing is we know that with adaptive design, we can create a better user experience based on a user’s capabilities. By using responsive layout and progressive enhancement together, we can create more awesome functionality like multi-touch, geo-location and native smartphone integration.

You can learn more about responsive/adaptive design with A List Apart article about Responsive Design or Smashing Magazine article about Responsive Design.

DON’T FIGHT THE FUTURE

We started building websites with crazy flash intros and entire websites stuffed into tables. And now, we need to create websites that more accessibility and meet different use cases. It is not just a trend; it’s a requirement of the future. You can ignore it if you want to get left behind.

If you’re prepared for that, start to test your own site on your phone and ask your friends to access your website on their own phone and give you feedback.

Moreover, you can make sure by using some online tools to help with testing such as: W3C MobileOK Checker, iPad Peek, Google Mobile View

Content Protection by DMCA.com

Check Also

Distinguishing between Web design and UX design

A lot of people still feel confused when they differentiate web designer from UX designer. …

CLOSE
CLOSE