What Does Mobile Optimized Mean
What Does Mobile Optimized Mean
I get a lot of questions about the differences between mobile-friendly vs mobile-optimization vs responsive design for websites. These questions include:
- What is a mobile-friendly website?
- What is mobile-optimization?
- What is responsive design?
- What are the differences of all of the above?
- Where does mobile first design fit in?
- What is the best design strategy for my website?
The fact is if you aren't optimized for mobile you're ultimately losing sales. Research shows that 57 percent of mobile users will abandon your website if it takes more than 3 seconds to load and 30 percent will abandon a purchase transaction if the shopping cart isn't optimized for mobile devices. What does the optimized for TREAD mean? By Kong, from TX, United States Asked on April 23, 2019.
My goal is to answer all of these questions, plus a few more along the way. (If you’d like a deeper explanation, or have other questions you’d like answered, just shoot me an email!.)
For clarity’s sake, when I say mobile or mobile device, I am referring to devices that are the approximate size and shape of most smartphones (mobile phones).
Ok, let’s hop to it!
What Does Mobile Optimized Mean Spiritually
Mobile-Friendly Websites
Google’s search rankings now emphasize and reward mobile-friendly websites. Many people may think that having a mobile-friendly website is good enough, and for Google’s robots it is! But this is not necessarily good enough for the visitors coming to your website. In short, mobile-friendly is the bare minimum mobile design strategy you should have for your mobile visitors.
If you aren’t sure if your website is mobile-friendly, then check-out Google’s webmaster tool. A mobile-friendly website is often just a slimmed down version of the website viewed on a desktop.
For example, as a general rule your content should be written in at least 14 or 16 pt font. It seems big, but when it gets shrunk down anything less will be hard to read. Hard to read ≠ mobile-friendly.
Mobile-friendly websites will work for mobile users, but these websites were designed for the desktop users. A smaller version of your desktop website can be functional but may not be as user friendly as it could be… And this is where mobile-optimization starts to enter the fray.
Mobile-Optimized Websites
All mobile-optimized websites are mobile-friendly, but not all mobile-friendly websites are mobile-optimized. Mobile-optimization targets mobile users; these websites are designed for smaller screens.
A mobile-optimized website will reformat itself for mobile users. It is not just a shrunken down version of the desktop website.
Design features of a mobile-optimized website can include:
- Single column layout
- Easy, simple navigation that is “thumb friendly”
- Large graphics with white-space borders for those of us with large or clumsy fingers
- Formatted content for maximum readability
- Limited to no need for typing
- Image file sizes are smaller for the mobile version of the website than those used for the desktop version of the website. (This allows for quicker load times.)
- A fewer number of features overall (minimalist, uncluttered design)
Mobile users are much more likely to be searching for a quick answer compared to their desktop search counterparts. (I tend to search for restaurants, movie reviews, and directions on my phone. I am not doing in-depth searches on my phone on technical topics like mobile-optimized design. I save those types of searches for my laptop.)
The goal of a mobile-optimized website is to make the website as frictionless as possible for the mobile user. Mobile users are seeking the quickest, most efficient way to answer their questions. Mobile-optimization aims to do exactly that.
Websites Created with Responsive Design
Responsively designed websites do exactly as phrase suggest. They “respond” to the screen size of the device being used. In a sense, responsive design picks up where mobile-optimization leaves off.
Responsive design reformats and restructures websites for any device—regardless of screen size. Mobile-optimization only does this for mobile devices. With responsive design, the layout of the website will scale from the smaller screens of mobile, tablets, and small laptops, to the standard desktop screen and even larger widescreen monitors.
Responsive design offers flexibility and great usability on all devices for users. It’s really the only way to guarantee that your website will look good and have optimized usability on any device.
If you are curious, Torspark is a responsively designed website. (Try looking at the homepage, or any other part of our website on different devices. When you do, you’ll see a different, scaled version for each device type. Or, just resize your browser and see how everything balances out on the page.)
Mobile-First Design Strategy
Mobile-first is a design strategy in which the mobile version of the website is designed first over the traditional desktop version. This design strategy can also apply to products designed for and marketed to mobile users first, ahead of “traditional” internet users.
A lot of design issues come from trying to stuff too many features into a single page. When designing with mobile-first in mind, you tend to get a simpler, cleaner design structure. This works well as a base, because it’s easier to add relevant features into the desktop view as needed, rather than trying to stuff every bell and whistle into a mobile view.
2014 was the breakout year for mobile usage—the first year mobile use surpassed daily desktop use. (Adults spent on average 2 hours and 51 minutes on mobile devices daily, but only 2 hours and 12 minutes daily on desktops.) Mobile first and responsive design strategies are becoming more in demand as the trend of increased mobile use continues. If you aren’t sure about jumping into the deep end of responsive design, a mobile first design strategy can be the first step as part of a larger responsive design strategy.
What type of design is best for my business and my website?
The not very helpful answer is “it depends”. Honestly, the answer depends on the answers to the following questions:
- What is the purpose of your website?
- What do you want your website to do for visitors?
- What devices are you expecting your visitors to be accessing your site from?
Websites are meant to take visitors on a digital journey. That journey is supposed to be as smooth and frictionless as possible. The easier you can make navigating your website, the more likely you are to increase conversions.
Also, what is the budget for your website? Mobile-optimized and responsively designed websites are often a little more expensive than mobile-friendly websites. Why? In short, they take longer to develop and build.
In the long run, the extra optimization to functionality and usability offered by a responsively designed or mobile-optimized site will provide you with a higher ROI than a site that is just mobile-friendly. Now, whether or not the expense is justified will have to be evaluated on a business-by-business basis.
On a side note, have you tried to use your business’s website as if you were a customer? What about as a mobile user? Do you know what your mobile site looks like? If you are drawing a blank, or have a panicky uncertain feeling right now, that’s probably not a good indicator.
Consider The Following for Mobile-Friendly vs Mobile-Optimized vs Responsive Design
Is your main customer base cruising your website on a desktop? Then maybe a mobile-friendly website is good enough for you. Google doesn’t penalize you in the search rankings, and you don’t spend extra money on a mobile-optimized or responsively designed website.
On the other hand…
Do you have any kind of e-commerce, blogs, or a customer base that actively uses mobile devices? If this is the case, then you may want to invest in a mobile-optimized or responsively designed website.
Mobile-Optimized and Responsively Designed Websites Can Offer a Creative User Experience
Just because visitors are viewing your website on a smaller screen, doesn’t mean your site has to be boring. Remember mobile users have the ability to take pictures and videos, make phone calls, use GPS for finding things near their location, and so much more!
And this is the beauty of stepping beyond just a mobile-friendly website. There are so many new and different user interface options for visitors NOT using a desktop. Some businesses even have completely different website versions for desktop users versus mobile users.
Think about your visitors. What type of experience do you want them to have using your website? Optimize your website for that experience! Given the possibilities with the internet, saying the sky’s the limit seems almost diminutive.
Weird fact about me – while I am of average height, I have tiny, below-average hands. Because of my tiny hands I was super reluctant to upgrade my tiny phone, so until the last few weeks I was still living my best life with my 4” screen iPhone 5. When your phone is that tiny it becomes really clear really fast when websites aren’t optimizing well for mobile.
Which brings up a good question: what does it really mean to “optimize” for mobile? For a lot of websites it simply means nothing breaks when viewed on a phone. You would think “not breaking” should be the bare minimum, but I have been on plenty of websites where everything from the hero image to a form fill is in fact “broken” and either cannot be viewed or cannot be used on my mobile phone.
Of course, “not breaking” is still a pretty low standard to set for such a large chunk of your audience. While the percentage of mobile visitors will always vary by site, in 2019 we’re seeing an average of 64% of travel & tourism website visitors using mobile devices.
Mobile Optimized Email
If you want to create the best mobile experience for your visitors, why not use personalization? Here are 5 examples of ways you can use personalization to create a better website for mobile visitors without having to recreate the entire website wheel.
Changing the Copy
A giant block of text on mobile? Ain’t nobody got time for that! A lot of times mobile optimizing means that the text technically fits on the screen. And that’s it. But we can do better than that! You can create a better experience overall by shortening the copy for mobile.
What Is Mobile Optimized Streaming
Think about your homepage hero, for example. If you overlay copy over an image, it will always take up a large portion of the image space, even when using smaller text. If you try and make it much smaller you run the risk of no one being able to read your copy. Create a cleaner mobile version by shortening or removing an element such as the subhead text, so that mobile visitors can still get the full effect of the image. Or, consider setting up a different template on mobile where the text moves below the image instead of appearing over it.
Changing the copy can also mean changing the call to action text. Mobile visitors are more likely to click on a visitor guide “view” call to action over one that says “download.”
Changing the Content
Wide, sweeping landscape images are beautiful. On desktop.
On mobile, wide images can get tricky. If you keep the same image ratio on mobile your image can become very, very small. If your website automatically crops the image to create a taller version, you might end up with a completely different point of view:
Instead of a mobile-optimized version of the image, use personalization to show a completely different image that better fits the story you want to tell on mobile.
Prioritizing the Right Content
That big, long intro text is really nice for your desktop visitors since they can still see other elements further down on the screen, but maybe you have articles or user generated images you think would appeal more to your mobile visitors. Using personalization to make sure the best mobile content is visible before scrolling can keep mobile visitors better engaged. This could mean rearranging content or using an overlay campaign to grab your mobile visitors attention right away.
Using Different Forms
Think about your formfill pages for a minute. How you would feel trying to fill them out on a phone. Are there 10 required fields before they can sign up for your newsletter? Are there several dropdowns they need to try and scroll through? Are there tiny checkboxes close together that might make it hard for them to indicate the right interest?
These are all issues that can easily dissuade a mobile visitor from completing a form. If you have a shorter, mobile-friendly form, you can use personalization to promote it strictly to mobile visitors who abandoned the original form page. Alternatively, you can direct them to the short form when they first click your call to action instead of showing them the long form at all.
Using Different Overlay Content
With mobile visitors making up over half of your website sessions, of course you still want to target them to promote your key goals. However, even when sized for a mobile screen, a fly-in can still create a larger than desired impact, more akin to using a modal. If you want to create a less disruptive experience on mobile, considering using banner campaigns instead. Mobile visitors can easily choose to either interact with a banner or ignore and continue scrolling.
Personalization is all about creating the best website experience for a group of visitors, and at the end of the day your mobile visitors are just another one of those groups! Looking for more ideas of how to better personalize for mobile? Contact your designated Customer Success Manager or reach out to here to discuss more!
What Does Mobile Optimized Mean