Chapter 4: Why Mobile UX Matters

Posted on October 28, 2019 | Updated on January 25, 2021

Mobile UX is design that keeps mobile device users in mind and considers what kind of experience they have with your brand assets, such as a website or social media page. The experience of the user makes a difference in how long they interact with your company and the impression you leave. More people own smartphones today than ever before. The average person spends about three hours and 35 minutes a day on their phone.

Your site visitors and online fans are much more likely to use a mobile phone to look you up, making your UX one of the most critical factors in growth. If you don’t optimize your site for mobile, you’re missing out on a significant marketing segment. Google indicates plans to use mobile versions of websites for indexing and ranking rather than the model of the desktop version it’s used in the past. Even though your desktop site will appear to those on home computers, the shift in which one they look at first shows the importance of a mobile UX approach.

Fortunately, there are some things you can do to ensure your website is ready for future growth in mobile use and focus without harming the user experience.

1. Use Hamburger Menus

The hamburger menu received a bad rap in recent years, and it can be frustrating for desktop users. However, as more people have gotten into using their smartphones for web browsing, it’s becoming more accepted as a form of navigation.

The hamburger menu takes up very little space on a smaller screen but is recognizable as a point of reference. Even if you don’t use a hamburger menu on your desktop site, make sure you shrink navigation for your mobile users. Think about how the user’s hands sit on the device as they’re using it. What is a natural location for your navigation? Is the button big enough for a person to touch with their fingers versus a much smaller cursor? Even the size of buttons plays into a positive mobile UX.

Sites such as Taco Bell feature a two-line hamburger icon with the word “menu” serving as the base of the symbol. Using actual words makes it clear to users where they should click for navigation.

2. Focus on Aesthetics

The overall look of your site is the first impression a user has. Aesthetics matter, and they include elements such as plenty of white space, a pleasing color palette and crisp images. The design of your mobile site isn’t a place to skimp on cost. Hire a professional designer who specializes in mobile designs to ensure everything comes together and matches your brand style. Seek someone with experience in designing with mobile UX in mind. Brands such as Apple have a visually pleasing layout that works well on mobile devices. Images are high resolution but load quickly. There is a delicate balance of negative and positive space.

3. Reduce Cognitive Overload

The more tasks a user must complete, the more overloaded they feel. Have you ever opened an app and not even known where to start — or wanted to buy something but the ordering process was too complicated? Poor UX often results from bad planning. When your buyer lands on your website, there is a journey they go through to get from information to consideration to making a purchase. Map out the different paths the user might take toward conversion and ensure each step is as simple as possible. Dropbox does a good job of talking new users through the setup process one step at a time. The mobile site works as well as the desktop version in onboarding new users.

4. Simplify Everything

When it comes to creating the best mobile UX possible, simplicity is key. You have less space, which means you must cut anything not vital. Declutter your designs, removing anything that doesn’t directly point the user to the next step in the buyer’s journey. Any element that requires an action from the user, such as uploading data, needs a second look. Find alternatives whenever possible, such as grabbing an image from a Facebook account. Consider sites such as the Weighted Blanket Co. and how simplified its design is. When you land on its page via a smartphone, you’ll see an image of one of its blankets, a hamburger menu and a shopping cart. Scroll down, and you see an option to add the most popular product to your cart or to buy with Apple Pay. The process is made as easy as possible.

5. Lose Bulky Forms

Have you ever clicked on a call to action (CTA) button on your phone and gone to a page that is impossible to read on a small screen? Get rid of bulky forms. These are cumbersome to mobile users even when optimized for smartphones. Instead, look into options such as SMS messaging automated support or live chat features. In one study of using text messages for sales, researchers found the average open rates for text messages was 98 percent rather than the 15 to 20 percent most email promotions receive. Start a conversation with your mobile site visitors and up your chances of selling to them.

SweetFrog is one brand utilizing SMS to drive sales. It offers a signup form, which is similar for mobile and desktop, where the user provides their phone number and a password. The company then sends SMS messages to confirm they’ve joined the loyalty program and sends regular discount offers and news about current yogurt flavors available in nearby shops.

6. Speed up Your Site

The average website takes 22 seconds to load, but load times impact mobile drastically, with 53 percent of people bouncing away from a site that takes longer than three seconds to load. Google’s reports on page load speeds indicate this is an essential factor in how it ranks websites, and that developers should focus on getting their page load speeds as fast as possible. Speed up your mobile site by checking how fast your servers are, reducing file sizes and the number of scripts on the page. Think about some of the fastest mobile sites you’ve visited, such as Amazon. From the second you pull the site up on your mobile device, it seems as though every element on the page loads almost automatically. You want the delay between the moment a user lands on your site and when it fully loads to be so minimal, it is virtually imperceptible. 

Leave Users with a Positive Impression

Mobile UX matters because it is the overall impression you leave with site visitors. They may have never heard of your brand before, so you want that first experience to be as customer-centered as possible. Keep in mind that advances in technology mean designing for mobile is an ongoing process. The design tactics that work today won’t work as well tomorrow. Stay up on industry trends, such as augmented reality, and focus on creating a better experience each time you revamp your site. Designing with a mobile-first approach ensures everyone who visits your site walks away with good thoughts about your company.

CHAPTER 3: The Laws of UX  CHAPTER 5: What Is the UX Process?

The UX Design Guide for All Levels: Introduction

Chapter 1: The Top Front End Technologies for UX Designers
Chapter 2: What is the Difference Between UX and UI?
Chapter 3: The Laws of UX
Chapter 4: Why Mobile UX Matters
Chapter 5: What Is the UX Process?
Chapter 6: Why User Experience Design Is Essential to Everything
Chapter 7: What Is Lean UX?
Chapter 8: The Top UX Design Principles
Chapter 9: The Best UX Tools and Techniques
Chapter 10: How to Become a UX Designer
Chapter 11: Top Mobile UX Design Principles to Remember
Chapter 12: Dark Patterns: The Trickery Behind These Poor UI Tactics
Chapter 13: What Does Good Customer Experience Look Like?
Chapter 14: The Different Types of User Interface
Chapter 15: The Top UX Design Courses
Chapter 16: Skills Needed to Become a Great UI Developer

About The Author

Eleanor Hecks is the Editor-in-Chief of Designerly Magazine, an online publication dedicated to providing in-depth content from the design and marketing industries. When she's not designing or writing code, you can find her exploring the outdoors with her husband and dog in their RV, burning calories at a local Zumba class, or curled up with a good book with her cats Gem and Cali.

You can find more of Eleanor's work at www.eleanorhecks.com.

Related Posts