13 tips to improve your Mobile Site's UX
by Prabhasa kota — Posted on Dec 19, 2017
Let me tell you a rather embarrassing story about my mobile User Experience with a friend.
I was intent on showing an e-commerce site that sold shoes to a friend from work, she was on her way home… “Are you taking out your laptop again!?”, she asked with a frown. “No, just seeing if I put my charger!”, I murmured embarrassed, hoping she didn’t realize she had guessed right.
Changing my course of action, I put my tired laptop to rest and switched to my phone. I opened the site, but alas! The site was not as enticing as it looked on the big screen.
I did not lose heart. I showed her the home page and started my salesman-ly praise. “Look how much information they give about shoes. And also, they have links to the latest shoes by big designers. They also have so many great images!”.
But the frown on friend’s face never eased. “They do sell shoes, right?”
“Then where is that?” she asked.
Now, there was a frown on my face. And a victorious smile on hers.
Needless to say, I never used that site again.
You see my point is, in today’s world, people are not sold by extravagant claims. In fact, they repel them. Our electronics devices get smaller by the day while our expectation from products, bigger.
User Experience defines how people interact with brands today. And UX can make or break a user-product relationship.
UX Design is constantly re-invented. The only way of sure-shot success in User Experience is to design for the user, drawing insights from them.
“Mobile devices are used more than traditional computers for web browsing, as smartphone and tablet use overtook desktop for the first time”
— The Guardian
Mobiles are the most used electronic devices in this digital-frenzy world. Designing an exemplary Mobile User Experience is imperative to capture attention and occupy the mobile’s screen space, as well as people’s mind share.
Much of what I have learned on Mobile UX comes from the experience of being a user. Here are 13 such tips to help you better your Mobile site’s User Experience and keep yourself ahead of the game.
1. Follow the 3-step ‘hook, bait, pull’ approach
Once a user lands on your page, there’s no time to lose. You either hook them or lose them forever. The e-commerce site for shoes is a perfect example of what not to do.
So, what should you do?
Follow a 3-step process for maximum engagement and to retain users.
Impress the user with a clever combination of your value addition and User Interface design.
Express the right thoughts to authenticate your product in the eyes of your user.
Make sure the actionable buttons and Call-To-Actions are easily accessible and in plain sight - to compel the user to tap on it.
2. Have the most optimized User Flow
The good and bad thing about mobile sites is that people crave speed. You can put across your message very quickly and get their focused attention on one thing. But if you don’t hurry, you’ll lose them.
Have an optimized User Flow to lead your user intuitively through the site. Never crowd the site with useless content and make anything useful, readily available.
Leading the user through a well-designed journey makes them appreciate the product. And they will soon get addicted to it.
The flip side of it also holds true. If you are a site that sells eggs, you don’t want to talk about the hen’s life story! You want to show the eggs and the ‘Buy Now’ button, as soon as possible.
If the user flow is even a little faulty, you risk frustrating the user and losing them forever.
3. Keep the design simple and uniform
Keep it simple silly.
This is the only design discipline. While designing User Experiences in this Mobile First world, take a simple and modern approach.
Do not overcomplicate the design or jazz it up unnecessarily. Use simple fonts and font hierarchies, color schemes, and illustrations to convey your content effectively.
Keep the design layout constant and uniform throughout the site and users will get well acquainted with how your product looks. And familiarity is key in the world of User Experience.
4. Enable desktop switching
Mobile sites come with many challenges. It is hard to fit all the valuable information that you offer on your desktop site. However, it is important not to crowd the Mobile site.
You risk extending your loading time, or altogether, boring the user. Hence, avoid using heavy content in the mobile site.
By enabling switching to the desktop site (normally accomplished by a footer button), you entice your user with crisp content while also offering the option to view the complete site.
This will get the interested users to the desktop site, and more importantly, will not intimidate the users at the first glance.
5. Sticky menu always counts
My friend was shopping in an online gift shop. He is one of those fickle ones! He scrolled all the way to the bottom of the chocolate basket section, only to realize he’d rather buy a teddy bear for his girlfriend.
But he was so far down that he had lost the list on top of the site to switch pages. And there was no sticky menu that was constantly accessible.
So, he got mad, quit the site, and bought his girlfriend some flowers from a local florist instead. Poor girlfriend.
A sticky menu does many things. It keeps all the important items always accessible to the users.
The users have the liberty to switch between pages of their choice. Also, it is a great way to push the pages you want your user to see.
Without a sticky menu, users get lost in a page. And since they are used to accessing the items that they want without a split second’s thinking, if they don’t see a menu, well, you will lose them.
Keep the interaction design on its toes and always go for a user-centered design.
Else, you may lose your business to a florist!
6. Have an easily available search option
Many users are looking for particular content on your site. Especially in mobile sites and on the go.
Having a readily available search option makes it much easier for the user to get where they want to go, the fastest. This is the main philosophy of Mobile User Experience!
Normally the search option is a part of the sticky menu. But if users utilize your search option more intensively, it is better to have that search bar in plain sight.
Again, it is all about customizing for the user.
7. Enable less typing and more ‘tapping’
My colleague was filling a form for her favorite magazine’s subscription on her phone.
10 seconds later, she exclaimed, “Chuck it! I don’t need it.”
“They are asking me to type why I want to subscribe. Can’t they have an option there that says- because I find the information interesting?”
I asked, “How do they know you think that?”
To which she replied, without a second’s hesitation, “They are supposed to know! Why am I even subscribing if they don’t give me reasons to subscribe?”
With new products coming in every day, users are becoming increasingly impatient. They groan to type even a single word.
If you have a form intensive site, or if your user interface beckons input from the users, make it as easy as possible.
Give more options, reduce the text bars, and utilize more buttons. The easier, the better. People prefer to select an already available option than think of an answer themselves and type it.
If there was only a way to provide buttons to select a user’s name as well, that would also be a recommended best practice for Mobile user experience… so, wait a minute, what are keyboards for? Are we tapping or typing on a keyboard? Anyways, I digress, but you get the idea – do your users’ work for them.
8. Lay out actionable areas intelligently
The below image shows the most actionable areas on the mobile screen, which are easily accessible with a swift movement of the finger.
Use your screen space smartly and design the user interface to place the actionable areas in the ‘easy and accurate region’.
Don’t burden your users by placing buttons in regions of low finger accessibility. If you make the user even a little uncomfortable, you risk making users dislike your mobile site.
9. Reduce pop-ups
When you user lands on your page, the first thing that frustrates most of them, is the pop-up asking them to sign up with their e-mail ID’s.
Yes. It is very important to get sign-ups. What is more important, is making a great first impression. A user wants to see the value in your site before signing up. And this value reduces when you interrupt them with pop-ups.
Be careful with your interaction design. Use pop-ups sparingly and make the site user-friendly.
10. Simplify and shorten content
The worst thing you can do to a mobile website’s user experience is to make it verbose.
The mobile site is made to be simple to enable quick browsing. You are taking away the user’s attention and worsening the user experience by adding more content.
Shorten copy. Keep only the relevant words enough to put across your main ideas to the user. And whatever assumes even secondary importance, remove it.
Use graphic representations as much as possible to enable the user to understand the whole site in one swipe.
11. Design for all kinds of fingers
A very important factor that often gets missed is the size of your user’s fingers. There are all kinds of sizes. And if the user interface is not designed more intelligently, you might lose out on your stubby-thumbed users.
Fitt’s law suggests that humans find it very hard to hit small targets. And this ends up frustrating them.
Keep the buttons and links big enough to tap on them easily and make font sizes big enough to be easily readable. Font sizes below 16 pixels are not recommended.
12. Test and Test again
Designing an effective user experience is a continuing process. Test your user interface with as big a sample size as you can afford.
Have people of different backgrounds, education, gender, profession, and even phone’s brand in your sample size.
It is very important to note their unbiased behaviors. There is so much to learn here. Some questions get answered at this stage-
- What elements do they prefer to be clickable?
- How far are they ready to scroll?
- Which clickable element do they not seem to use?
- How long do they spend on the landing page?
- Do they enter their details in any pop-ups?
- Do they find different buttons easily?
- Where do they linger most?
- How fast can they get to their desired goal?
- Do they navigate to another page of your site?
- How often do they use the search button/sticky menu?
After a thorough inspection of the user journey, always ask your users for their suggestions. You will come upon insights that never came up during research or design.
Following this, make the necessary changes in the mobile site’s user experience and test again.
13. Inculcate behavioral Gesturization
There is another treasure trove of information that one gets from user testing- the gestures your users use on your site.
Do they pinch, double-tap, scroll easily? Are they intuitively led to do so?
Identify those established gestures that your user use most and design your experience in a way as to solicit these gestures from them.
When one wishes for an apple and find an apple tree in front of them, they are instantly happy.
Identify how they use your product, design the user experience the way they are most likely to use it, and iterate as often as possible to keep up with changing trends and behaviors.
To say the least, User Experience Design is an ongoing process that is perfected over time and designed, keeping the user at the epicenter.
Use these tips and always remember to be malleable. You bend as your user pulls. That’s how an excellent experience design works. That’s how you get your users to fall in love with you.
About the Author
Prabhasa Kota, Co-founder & Director, WinkTales
Prabhasa started his career and entrepreneurial journey with WinkTales, he loves to share his experiences on starting up and sustaining in the volatile start-up industry as a millennial entrepreneur.
Special thanks to Mangala, Senior Copy Writer, for contributing her Research and Inputs.