Web Dictionary: What Is The Difference Between Responsive, Adaptive and Mobile?

April 22, 2016

With nearly half of internet traffic coming from mobile devices, it may be time to upgrade your website to accommodate this movement to mobile. Now you need to make a choice, should you choose to develop a responsive, adaptive or standalone mobile site. It's important to understand the differences between responsive and adaptive design to make the right choice for your website. 

Key Difference Between Responsive and Adaptive Design

Simply put, a responsive web design (RWD) is fluid and adapts to the size of the screen to look good on all devices—desktops, tablets, and phones. This is done using CSS media queries, proportion-based grids and flexible images that change the layout, hide, reduce, enlarge or move the content of the site to best fit the device. The grids and images are sized by relative units, typically percentages, rather than absolute units like pixels. Media queries change the CSS style based on the width of the device browser being used.

An adaptive web design (AWD) uses static layouts that break at set points. The screen size is detected and the appropriate layout is loaded. Generally, there are six common screen widths: 320, 480, 760, 960, 1200 and 1500 pixels that are accounted for. The result is a website that is custom made for the user’s device. AWD is highly useful for retrofitting an existing static site design without having to completely redevelop your site from scratch.

How do RWD and AWD differ from a standalone mobile website.

 A standalone mobile website is a completely separate website from its desktop version. This website is placed on a separate domain or sub-domain. When someone visits the desktop website version on a device they are redirected to the standalone mobile website that is specifically designed for smaller devices. Having two separate websites usually doubles the work in updating and adding new content, whereas RWD and AWD are single sites.

So, which method is best for you? It comes down to what is the best tool for the project. If your target is a particular device, say iPhone 6, you may want an AWD site that focuses on that device. You may have an older static site that you love, but just needs a mobile version that provides basic content and contact info, a standalone site may be your best option. If you’re starting from scratch, a responsive site is likely your best option for versatility for all devices present and future. The only real wrong choice would be to not have a mobile website and miss out on potential customers.

fatrabbit CREATIVE creates custom responsive mobile sites that incorporate industry best practices and distinctive designs to help you succeed with your business growth and development. If you are unsure of where to go with your mobile responsive site, contact fatrabbit CREATIVE today!

Share this Article

Sign up for our newsletter.

get in touch.