It’s clear that more people depend on their phones for functions formerly reserved for desktops and laptops. But why have different web designs for mobile users than for desktop visitors?
It’s important to remember that while people on a mobile device may access the same website as someone on a laptop, their search experiences may look totally different. Someone on a phone is more likely to browse at a frantic, rushed pace. It’s not easy to move quickly on a small touch screen, however.
You have to keep the mobile user’s experience in mind when planning your mobile designs. The aspects of your website that appeal to desktop visitors may deter those on a smartphone or tablet. Mobile design exists because one cannot translate a website made for a 13-inch screen to a 4-inch screen.
As one design service explains, the key to mobile design is to remember, “There’s a premium attached to screen space on mobile devices. Keep it minimal and focus on the key message you want the user to take away.”
How to know if you need a mobile redesign
Even if your business isn’t currently experiencing a high volume of mobile visitors, it’s time to invest in mobile design. Without further ado, then, let’s dive into the three different types of mobile design and their diverse features.
Mobile Friendly
These sites are not very friendly at all, actually. A mobile friendly site mirrors the layout of a desktop site for the most part but it might have some added bonuses like:
Email addresses, phone numbers, or directions that can trigger an action on your phone
Slideshows that don’t need Adobe Flash (which isn’t supported on Apple and other mobile devices)
Smaller image files that allow for quicker loading times on mobile connections
Despite having a chipper-sounding name, mobile friendly sites like this one don’t pass Google’s Mobilegeddon test. These sites don’t work because they fail to consider how hard it is for someone’s thumbs to navigate all these small links. Anyone that visits this site from a phone or tablet will suffer through a lot of “screen-pinching” if she wants to get anywhere.
This layout is only acceptable if you don’t attract a significant mobile audience to your site.
(Adding confusion, of course, is the fact that Google calls its Mobilegeddon test the “Mobile-Friendly Test.” Sites that pass the test will fall into the next two categories of mobile design. If you’re having a hard time keeping all the names straight, just try to focus on the characteristics of each design type.)
Mobile Optimized
This is what customers (and Google) will expect when they come to your site from their phones.
The difference between optimized and friendly sites is that on the former, the content is laid out uniquely for a mobile screen. The most noticeable advantage of a mobile optimized site is having larger buttons.
But notice that in addition to making the information more accessible than a mobile friendly site, optimizing your site gives you the freedom to pick and choose what you want to display on a phone.
A mobile friendly site takes everything from your desktop-designed website and dumps it onto a mobile device. With an optimized site, however, an aerial park could remove certain pages or images to streamline the experience on a phone.
Consider this: if you know that people that mobile visitors want to find contact information and tour offerings, you could take out extraneous pages that don’t help these aims. In doing so, you’ll make it easier for the mobile user to navigate on her small screen and also help your site load faster.
Having a mobile optimized site is almost like having two separate websites. It will be your job to maintain your mobile and your desktop sites in tandem. The up front costs of an optimized site can vary widely, but the general consensus is that these costs could add up over time as you make updates to your desktop and mobile sites separately.
Responsive Design
This is the final option in mobile design and many consider think they’re killing several birds with one stone if they opt for a responsive site. As the name implies, responsive sites dynamically adjust to the device and the size of the screen.
Mobile design and responsive design look very similar to the end user, the difference lies in how you manage these layouts. Unlike a mobile optimized site, which exists separately from your desktop website, you don’t have to duplicate your site for mobile to make it responsive. This is why many businesses opt to pursue this type of design. While the budget may be steeper up front, you only have to manage one website. Any updates you make automatically apply to visitors across mobile and desktop devices.
The best way to understand responsive design is to see it in action. Mint Julep Tours nails it on all fronts—from your phone to your desktop. Test what happens when you shrink your window so that it’s long and skinny. The layout adjusts as the width narrows more and more, but everything still remains easy to read.
Your 3 Next Steps Toward a Better Mobile Website
With all this in mind, here’s how to properly invest in a mobile site that will boost your business:
Make sure it’s responsive: Do not make your customers pinch their mobile screens to book a tour. Implement designs that make it easy for visitors to navigate from their phones.
Remember that technology changes: Even if you already have a mobile optimized site, your work is not yet over. At the rate that technology and design are changing, it’s important to update your website every 1½ – 2 years.
Measure, measure, measure: Data should be at the core of every decision you make. How else will you know if your money is being spent wisely? Don’t do 90% of the work only to never make it to the finish line. By analyzing your website’s mobile usage metrics, you can fully analyze the return on your investment.
