Responsive Website Design Vs Standalone Adaptive Web Design

As more and more people are using their smartphones and tablets to access websites, it’s becoming imperative for website owners to make their websites mobile-friendly, that is, to display properly according to the screen it is being viewed on.

To that end, there are two routes to take. Either website owners create a responsive website or a standalone adaptive mobile website. We discussed the advantages of both options with Portland website design company, Starfire Web Design Portland, in order to get a web developer’s professional opinion on the pros and cons of each so you can properly decide on which route to take.

This image is a vector file representing a responsive design concept on various media devices.Responsive Website Design Advantages

A responsive website uses media queries to adjust the size of the website to the screen. When a user accesses a website from his mobile phone, the website responds by detecting the size of the screen and adjusting the elements to display the website properly.

The good thing about responsive websites is that you only need to create a website once and you will never again have to make adjustments to the coding. And if you are using a CMS platform like WordPress, you do not need to do any coding at all. You just need to use a mobile-responsive theme.

The bad thing about it is that websites take a longer time to load, especially if there are many elements like pictures and videos. There are also issues of websites improperly displaying – remember that a code on a website only re-arranges the elements and downsizes the pages to display on a mobile device.

Also, since the website is built both for desktop and for mobile, there is a limit on what you can offer on your website. A plugin that works on mobile will not work the desktop version and vice-versa.

There is a great post in the Team Treehouse community answering “what is responsive web design” and how to code it properly, along with several good reference links and definitions. This would be a good starting point for a beginner.

Standalone Adaptive Mobile Website Design

A standalone adaptive mobile website uses the subdomain http://mobile.xxx.com or http://m.xxx.com when responding to a user’s query. Whenever the domain is accessed, the website responds by determining the size of the screen and then pulling up the layout that fits it.

Unlike responsive mobile sites, you do not need to worry about site speed or of certain elements not displaying properly. This is because you need to create several layouts for different viewpoints, for example, you will need to create a separate layout for tablets, large phablets, and the smaller regular iPhones and Androids. But this does not mean you need to create from scratch. You can take a template and customize it for different screens.

Web developers who develop adaptive mobile sites often need to create six versions. However, if you are smart, you would look at the analytics of your website, see which devices your website is being accessed on, and create only versions for those devices. You can add to the layouts as needed.

Within the last few years, there has been a surge of website owners who use responsive websites. This is understandable considering the ease with which users can implement a responsive site. However, as we have said earlier, responsiveness is something you pay for with site speed and sometimes, proper display of the website.

Danny Ericsen is the owner of Starfire Web Design, a website design company and web developer, offering web development, SEO, and graphic design.