Deciding how to adapt your company’s digital media for mobile browsing via the mobile web is an important decision that will have a great impact on your business. However, before a decision can be made, a business owner or marketer must understand mobile-friendly, mobile-optimized, responsive design, and their differences.

All options are not created equal. For example, all mobile-optimized websites are mobile-friendly, but not all mobile-friendly websites are mobile-optimized. And responsive design evolves both of these design options into a new method for designing mobile websites. It is important to consider all three approaches in order to choose the best fit for your company.

Mobile-Friendly

Mobile-friendly refers to a website that displays accurately across

Mobile friendly websites:

  • Are effectively copies of their desktop versions and are largely composed of static content.
  • Do not enable Flash or drop-down menu navigations.
  • Display smaller images and text, appearing “scaled down” from or smaller than their desktop counterpart and usually requiring scrolling or zooming.
  • Require no specific HTML/CSS code to adjust content or images across platforms.

Mobile-friendly websites may be adequate if:

  • You have a relatively small mobile audience (20-30%) and do not want to design a separate mobile webpage.
  • You have a fairly simple website design, primarily composed of text with small images and without complex functionality.

With the steady rise of mobile users and Google’s 2015 algorithm update in favor of mobile-friendliness, a mobile-friendly website is considered the minimum mobile requirement for businesses and best practice in order to engage mobile customers.

Test your website’s mobile-friendliness here.

Mobile-Optimized

A mobile-optimized website is a separate version of your website designed specifically for mobile devices, not computers. A mobile-optimized website employs several best practices to create a better mobile UX, including but not limited to: prioritized content, simplified navigation, touch design, push functionality, and selective fonts and graphics. This type of design automatically reformats across mobile devices, improving navigation, engagement, conversions, communication, and decision-making.

Mobile-optimized websites:

  • Are “finger friendly” and designed for touch, not clicks.
  • Reduce the number and/or size of graphics to increase loading time.
  • Enable “push” or mobile-only options, like “Tap to Call.”
  • Reformat across screen size for maximum readability.

Mobile-optimized is a good design option if:

  • You have a consumer-driven or e-commerce business.
  • Your website includes several Call-to-Action buttons that are less functional with a mobile-friendly website.
  • Your audience is more frequently viewing your website from their mobile device versus desktop computer.

Responsive Design

Responsive design “responds” to the device on which it is being viewed, automatically reformatting and restructuring websites across all devices, regardless of screen size. This design is completely flexible and offers the greatest amount of functionality for mobile users. You can test a desktop website for responsive design by dragging its window to different sizes. A responsive design will automatically reformat, showing the same content and theme in a different arrangement.

Responsive websites:

  • Do not need to detect browser type or device.
  • Do not require scrolling or zooming, and include all of the content from its desktop version.
  • Allow dynamic content.

Responsive design may be the best solution for your business if:

  • You seek to provide your large (40%+) mobile audience with a more complex and customized mobile experience.
  • Your website includes features, like Flash and large images, that may make other design options impossible or cause them to run too slowly.
  • You seek a more flexible solution across screen sizes and would like to keep your own domain (mobile-friendly websites require a new domain).

How do you decide on a mobile-website design method?

Every business will have different goals for and expectations of their mobile experience. Generally, mobile-optimized and responsive design websites increase conversions, yielding a higher ROI. And while the common misconception is that these methods are always expensive to implement, mobile website builders can facilitate the process at a greatly reduced price point. However, each business should carefully consider several factors, including those listed below, in making the decision on mobile-friendly vs. mobile-optimized vs. responsive design.

  • Where is your audience doing the majority of its browsing – desktop or mobile? How large is your mobile audience?
  • How long do you expect your mobile website to last? Where do you place your company with regard to current and future mobile trends?
  • What is the overall goal of your website? What are your mobile KPIs?
  • What do you want your mobile website to do for your customers?