Recently, we walked you through 7 essential design features all great business websites must have. Today, we want to go a little more in-depth on a key component— mobile website usability. One extremely important factor that contributes to your search engine ranking is website usability. Creating a a website that is easy to use in various formats is crucial to the look and feel of a brand and its revenue stream. The usability of a company’s mobile site is equally or more important than its desktop counterpart. Smart Insights posted a study in Mobile Marketing Statistics Compilation, stating that, as of 2015, 51% of internet usage is done through mobile devices compared to 42% on desktops/laptops. As it’s already 2017, you can imagine that number has only increased. Therefore, you’re going to want to know the best possible way to optimize your company’s mobile website usability so that you can create a seamless experience for your customer. Below, we’ve put together 3 ways to make your website user-friendly.
Optimize Images and Videos
A picture is worth a thousand words and even more so when it comes to SEO. Including images on your site enhances your content and increases your ranking, but it can also slow down the speed of your mobile site. No one likes to wait for a video or image to load. In fact, most people get frustrated after a short period of time and simply just X out once they’re fed up. To prevent this from happening, scale your images to the smallest file size possible. If you’re using Adobe Photoshop, there is an option to “Save for Web,” which will automatically reduce the size of your image while keeping the quality intact. If you have multiple images on your page, it’s better to create a gallery rather than a long scroll of various photos. One way of doing this is to add a horizontal scrolling element; it gives your reader the option to view the photos as they please, or move on to read other content.
Avoid Faulty Mobile Redirects
There’s only one thing worse than waiting for a page to load, and that’s being routed to the wrong page. This is something called a faulty mobile redirect. It occurs when a URL for a desktop page is different from its mobile page. The result is that the desktop page may redirect a mobile user to an irrelevant mobile page. Let’s say you search “Village Print & Media Blog” on your phone. Google will then display the direct link to “Village Print & Media Blog,” but when you click on the link, there’s a chance the server will most likely redirect you to Village Print & Media’s mobile homepage rather than directly to the mobile blog page. A great way to resolve this issue is to create a mobile equivalent to every URL, and ensure that your desktop website is mobile responsive.
Increase Clickable Touch Range
Okay, we lied. There is one other thing more frustrating than being directed to the wrong page, or having to wait a long period of time for a photo or video to upload. This is something known as a weak clickable touch range, and you know this all too well. Imagine yourself shopping on a mobile website. You’re scrolling through various images and below each of the images are clickable options to choose your “size,” “color,” and “add to cart.” Although you’re attempting to choose a correct size you accidentally click the “add the cart” option. This occurs because the clickable touch range of links is too close together. Now, you have to reroute back to the main page, zoom into the button option you meant to click in the first place, and the entire process becomes extremely annoying and frustrating. The solution? First things first, limit the amount of clickable elements you have on your mobile page. Once that is fixed, increase the clickable touch range of each link. According to Google’s Usability Guideline, the clickable touch range should be at least 48x 48 dpi, which is a physical size of about 9mm.