Should my online store be Responsive or Adaptive?
The way people browse the web today is rapidly changing, more and more people are using their phones exclusively as their computers, foregoing the traditional laptop or desktop computer. For these people and many other who browse the web on their mobile device, a traditional web site designed for the desktop will no longer make the cut. In fact, Google recently made an algorithm change in their mobile search results penalizing website that aren’t designed for mobile devices and promoting mobile ready sites. The trend from desktop to mobile computing shows no signs of slowing down, if anything, the trend of moving towards mobile is speeding up.
You can check the mobile readiness of your site by visiting Google’s Mobile-Friendly test site. If your site fails the test you may be losing valuable visitors and potential clients from your site. A professional web agency can help you interpret the results of a test like this and determine what can be done to improve your scores.
Now is the time to update your site, make it mobile friendly, and win back those lost visitors. There are two different types of mobile friendly design: Responsive or Adaptive.
With responsive design the web site is designed to expand and shrink depending on the size of the screen the user has the design itself is fluid. Adaptive design also called progressive enhancement is more like having two completely separate web sites, one that is designed for mobile screens and on for laptops or desktops. There is a debate among designers and developers over which method is better for building your site, and both methods have their positives and negatives. See below for the advantages an disadvantages along with examples of mobile web design we’ve done for clients.
Responsive Design
With responsive design the layout of your page grows or shrinks based on the resolution of the screen the user has. Images will grow and shrink to fit the space and text and other elements will flow to fit as the space either grows or shrinks.
Advantages
- Faster development times: You only need to develop one site that will fit multiple devices, this cuts down on development time.
- Less maintenance: By their nature responsive sites are less complex than adaptive. If you need to make a change to the site, you only need to make one change. In adaptive you might need to make changes in more than one spot to make sure they design changes carries over to mobile.
- Google currently recommends a responsive design pattern.
- Future proof: Okay, nothing is really future proof, but by their nature, the flexibility of responsive sites will fit more screen resolutions. Most adaptive sites are designed to fit a desktop device and a mobile device, many leave out tablets serving a tablet either a mobile version of the site or a desktop version. With responsive web design the site will look good in a tablet such as an iPad.
Disdvantages
- Responsive redesigns are more expensive than Adaptive because they require additional work. But once complete, Responsive requires less maintenance than an Adaptive site, producing a long term overall savings in web development fees.
- When you choose to make your site Responsive, you will need to redesign your entire site and not just add a mobile template. This is usually a benefit, as your mobile and desktop sites will both match and look great, creating a consistent user experience.
Adaptive Design
Adaptive web design is like having two completely different web sites, one designed to fit on your phone the other designed to fit on your desktop. Using JavaScript and other elements different version of you site are served to the user depending on what type of device they are on.
Advantages
- Since you are basically building a separate site from your desktop site images, logos, and other bandwidth and resource intensive processes can be left out of the mobile version of your site or better optimized for mobile, leaving you with a faster and leaner site. You only need to use the assets you think are most important to your user.
- No need to redesign your current desktop site. If you are happy with your current desktop site, you can leave it as is and develop a second mobile version.
- You can provide a link to the desktop version of the site to let the user choose what version of the site they will see.
- The design can be specifically tailored to mobile devices. With responsive design, one design needs to work with all devices, with adaptive design you can design specifically for mobile phones.
Disadvantages
- Longer development times: You have to develop for both the desktop and mobile. In some cases, depending on the platform, they may have completely separate templates for the desktop and mobile, so in essence you are developing two different sites.
- More maintenance: If you want to update the desktop site you may also need to make changes to mobile site as well. Adaptive sites are generally more complex than responsive sites.
- Many adaptive designs are desktop or mobile only, leaving out the users on tablets, who usually will either see the mobile site or the desktop version.
Ready to go Mobile Friendly?
With so many people using mobile devices to browse the web and Google’s algorithm changes, not having a mobile friendly site will hurt your business. Want a free consultation to discuss your website and discuss how to make it more mobile friendly?