Building a Mobile Site Guide

Here’s How To Make A Great Mobile Site

With Google switching to mobile first indexing and mobile page speed being the speed factor its more than important to have a great mobile site. Not to mention more people search via mobile vs desktop these days. Below are 25, yes twenty five, main principles on what you have to do to make sure your site is easy to use.

1.    Call To Action Placement

A call to action is your money maker. It’s what gets a user on your site to convert from being simply a window shopper to a customer.

Have you ever heard someone shout something from the back row of a stadium towards the players on the field? What are the chances of them a. hearing the advice. And b. actually deciding to use that information?

Odds are its pretty small. Making sure to put what you want your client wants to see and what your client is looking for front and center will not only make your site more effective in converting but will increase the user experience as well.

Two phones comparing mobile friendly site vs not mobile friendly

Two phones, one showing proper mobile site, other broken site[/caption] 

The above picture shows how two different companies present their information. One is eye level right in the middle of the screen. Another is at the very bottom of the screen and takes you away to another page. Which one would you consider to be more user friendly/would you want to use?

2.    Keep It Simple When It Comes To Menus

Menus shouldn’t be hard to navigate or to read. It should have every major category neatly displayed. When someone wants to go further they should be able to click each category that will open up into products. Making sure your menu isn’t overly complex or detailed is the way to go. Sell clothes? Men’s Women’s and Children should be your categories. When one is clicked it should populate a dropdown that has a standard list that displays across all three categories. Shirts, Sweaters, Pants, and Shorts.

 

Make it easy for your client to find what they are looking for. Test your Menu’s out on employees or if you’re a small business ask your friends and family to see if its easily navigable.

3.    The Top Left Corner

Finding your way home is always important. Especially on a mobile site. The top left corner of every screen has become the standard way to get home. Make sure the button is big, it’s easy, and that its your logo. If this doesn’t work you’re just wasting your time.

4.    Interstitials

You know those rather large pop ups you always get when you go to a website giving you a coupon or asking you to sign up for their newsletter? Things that annoy you also annoy everyone else. Make sure to never have any full page interstitials on your mobile site. Not only are you better off not having them at all, but google has announced they will negatively effect rank in 2018 and on.

5.    Where To Put Your Search Bar

Make It visibile, make it easy to find, and make it large enough to be easily clickable. Always make it on the actual page and not on the menu where it would be hard to find. If the user is looking for something the last thing they want to do is hunt for the search bar to look for an item.

6.    Does Your Search Work Properly?

When you type in a search query you expect the auto-complete to match up to what you are looking for as quickly as possible. Make sure this the search box is user friendly. Does it auto complete words? Does it correct grammar errors? Does it show related searches? Because it should do all three! (See Google Custom Search Tool)

7.    Just Like Snapchat, Mobile Has Filters

Human beings can only handle so many options at once. How do we make it easier for human beings to make choices? Filtering of course! Adding a filter function to your site allows users to get to the products they want more quickly.

As with the search box, don’t hide filtering abilities. They should be available on the search results page for your user.

8.    Have A Lot Of Products? Guide Your User!

Guiding your user by a 2 or 3 question search will help them find what they are looking for and possibly something they didn’t know that they wanted. Example: A 20 something female goes to your site to browse your clothes. You ask her a few simple questions, is she looking for (insert your categories here), Is she looking for men, women, or child sizes, and what size?

By having three tabs for dropdowns you can help a user narrow their search to show only what they are looking for immediately.

9.    Know Your Conversion Path

Don’t push a sale on someone allow them to search and add naturally. By adding tracking through GA when can see where people add all the way until checkout. If we see a high % of cart bounces at a certain step we can then go and trouble shoot any problems as well as make the step more user friendly!

Never ask for someone’s information immediately upon arrival. Allow this to be towards the end of the process.

10. Purchase As Guest, The Holy Grail

Saying I DISLIKE giving out my information would be an understatement. Nobody wants to feel like your next question is going to be “and the last 4 digits to your social?”

Allowing users to checkout as a guest gives them back their freedom in making their own choices. Which feels a lot better than feeling like your going to be getting spam for the next 7 years. Especially when they see no benefit of signing up.

Make sure you have both options, to login/create a profile. As well as purchase as a guest.

11. Remember Their Information

If they do sign up make sure to have the ability to pre fill their information. Making the process easy for a user to purchase your product is good for the customer as well as your business.

12. Click To Call Is The Future

Everything is instant, the last thing a user wants to do is go search for your phone number online. Everyone hates looking up phone numbers for customer support! Having a click to call button is great in two ways. The user doesn’t have to search and has easy access to you for questions about your product. Click to call also has the ability to be used for tracking!  (call rail) to see how you are meeting your goals.

13. Make The Process Easy For A User To Buy On Another Device

We get caught up in a rush sometimes and forget to do things. Wouldn’t it be great if we had a quick little reminder for those small things during the day? Social Sharing Buttons allow just that! Whether it be facebook, twitter, or a quick email of the link of the product your user wants to come back to. Having social share is critical.

Not only does it allow a user to purchase from a different device, it is a great way to spread your product organically.

14. Forms

Simple enough, it doesn’t need to be 15 questions long, the shorter the better actually. What do you NEED from a client? Name, Email, and? This will depend but we know you don’t need their pets middle name, or that they are a wizard who lives in a cupboard under the stairs.

15. Auto Advance, The True Passive Luxury

When I finish a field in a form it pushes me down to the next one. Instead of having to click. It’s simple effective and if you do it no one will thank you but if you don’t people will drag their feet, bounce from your site, and never return. It’s the small things that keep people around in real life and on the internet.

16. Simplify Your Form Further

Give them a dropdown with a few options vs them having to think and pick something, decide it’s a good idea, write it, make sure it’s a good description of x, then click to the next tab.

17. What Day Is it? (Use A Calendar)

No really, calendars are a great way for users to know when an event, subscription, starts and ends.

18. Label your inputs properly (see 16)

Not only do you need to have the correct labels but you need to make sure that if someone puts in a wrong input it lets them know immediately. Remember that 15 question form we told you not to do but you did it anyway? When your user gets to the bottom clicks submit, and then gets pushed back up to the top of the page and has to redo half the form because one thing was wrong they are going to lose it.

Make sure if an error occurs to show it real time so they can fix it on the fly vs having to redo the form over again. Also, if you have the ability to prepopulate information that a user has already given (they’ve registered on your site) make sure to pre fill that info.

19. Autofill Is King/Queen

Again, Mobile usage is all about making your site friendly and easy to use. What’s more friendly than a mobile site built to autofill your info?

20. Responsive and Dynamic Layouts

If you have the time, effort, and money to go dynamic it’s a great way to make sure your site always stays perfect. If you have no idea what the difference is between the two don’t try and be a hero.

Go Responsive, the majority of the time this is what most people will do. Responsive layouts take your desktop and changes the layout to fit every type of mobile screen size perfectly (not always but 98%+)

21. Don’t Pinch Me And I Wont Pinch You

Pinch and zoom is wrong. Period. If they have to zoom into something it is too small. No one likes zooming in on desktop either. Pinch/Zooming effectively means you have an issue that needs to be fixed on desktop or mobile.

22. But What About Images?

Images are always being zoomed in on to see the detail! Making images a clickable action that opens up to a larger image is a great way of showing off detail of the product in a larger image. If your user can’t see what they are buying in a high resolution fashion they wont buy it. Would you buy a car from a dealership that only let you see it through a foggy mirror? No way.

Clickable products that turn into larger high resolution images.

23. Landscape or Portrait?

This has fallen more to the wayside but if for some reason your site or product functions better in landscape let the user know. More than likely this won’t be something you will be doing as it’s become the norm to expect portrait.

24. Stay Inside One Browser

You know what happens when you stay and load on one browser? Your site loads quicker, your site is easier to navigate, and your site will have a lower bounce rate.

25. Don’t Offer Full Site Options

This was an option before CSS styling was compatible with mobile phones back in the early 2000’s (think pre touch screen). Plus it prompts the user to believe they are missing something on the “full” site when they actually aren’t. Then they go and the desktop version isn’t as compatible with their mobile phone. Bad for everyone.

26. BONUS: Location

Never ask for a users location until you have to. Even if you are a travel site, let them provide that information when they are ready to.

Make Your Site Fun To Be On

If your site is easy to navigate, loads quickly, and doesn’t get in the way of the users experience you’ll have an amazing site to use. Make sure you stick to these 25, core ideas and you’ll be on the right track to a more happy client and a higher revenue business.