Responsive vs Mobile Friendly Design
There’s no question about it – we live in a MOBILE world. Nearly everyone these days has a mobile device of some kind (phone, tablet) and uses it online. In fact, the majority of website visitors (72%) are using a mobile device.
It’s not surprising, then, that one of the biggest issues clients have with their website – and one of the most common questions we receive – is HOW DO I ENSURE MY SITE WORKS ON A MOBILE DEVICE?
There are two common terms that are used when talking about mobile websites: Â MOBILE FRIENDLY and RESPONSIVE. Â So, just what do these mean, and how do you know if your site falls into one of these categories?
A responsive website IS mobile friendly - however, a mobile friendly website is NOT necessarily responsive.
We design sites that are RESPONSIVE.
Responsive websites act just as their name sounds – they “respond” to theÂ screen size of the device being used. Â A responsive website will automatically adjust as needed in order to make the best use of the screen. Â The text, images, and site menu all shift to create the most user-friendly experience with easy navigation.
To be truly 'mobile friendly', a site should be RESPONSIVE.
- Have you ever visited a website using a mobile device and had to scroll left and right to see the entire site, or had any part of the menu or page go off the screen?
- Have you ever had to zoom in on your device in order to read the text or click a link?
- Have you ever had an image that did not fit on the screen and you had to scroll or adjust your screen in order to view the image or to see the rest of the site content?
If you answered yes to anyÂ of the above questions, you know how frustrating it can be to try to navigate a website that is NOT responsive.
Your site should adjust to the needs of your customer … your customer shouldn’t have to adjust to the limitations of your website.
So, how do you know if your site is responsive?Â
There are a couple ways you can test your site. Â Try viewing your site using any mobile device (phone, tablet, etc.). Â See if your site layout and menu shift and adjust to fit the screen size. Â You can also run a test using your desktop computer. Â Simply reduce your browser window size – dragging it smaller and smaller to approximately the size of a cell phone screen. Â If the content of your site adjustsÂ as you drag the window smaller, your site is responsive. Â If you end up with horizontal scroll bars and have to zoom or scroll to see your site content, it is NOT responsive.
So … then what is “mobile friendly”? Â AÂ mobile friendly design does NOT adjust based on device, but insteadÂ is designed to be as friendly as possible across all devices. Â Some of the features used in a mobile friendly site include: larger font sizes for small screens, simple navigation buttonsÂ without drop-down menus, and small image sizes that load quickly.
Mobile-friendly is aÂ bare minimum or “good enough” design strategy. Â While itÂ may “work” on mobile devices, it isÂ still designed primarily for desktop users.
Just say NO to the horizontal scroll!
Be responsive. Your site will look good on any device, your customer will not get frustrated trying to navigate your site, and you will stay ahead of the technology curve.