The easiest way to increase your bounce rate on mobile websites is through poor mobile website navigation techniques. Mobile devices use different methods than laptop or desktop computers to register user events. These methods include user interactions such as touch and swipe. Full scale websites usually make use of interactions suitable for a mouse, but incapable of being reproduced by a finger on a phone or tablet.
CSS Hover
The hover selector in CSS allows web designers to hide website navigation features until a mouse hovers over some location. When the user hovers the mouse over a main navigation link, they are able to view the sub navigation.
Unfortunately, mobile devices can’t recognize when a user hovers a finger over the screen. The result? The user never finds what they were looking for (or simply cannot get to it) and leaves your site.
Small Buttons and Links
A mouse cursor on a computer screen takes up a very small amount of space. As a result, mouse click events can be registered with accuracy down to a single pixel. Touch events registered by a finger are much larger and much less accurate.
Apple’s iPhone Human Interface Guidelines recommends a minimum target size of 44 pixels wide 44 pixels tall. Microsoft’s Windows Phone UI Design and Interaction Guide suggests a touch target size of 34px with a minimum touch target size of 26 pixels.
The average diameter of the human index finger is 4 centimeters. The result? Awkward interfaces. Users end up touching a link to one page while intending to visit another. After a few misses, they leave your site.
Mobile Navigation Recommendations
If using a responsive design, consider placing a text navigation area in the sidebar or elsewhere on the page. While this still leaves the problem of small text links, users will still be able to navigate your site.
Alternatively, offer drop-down navigation. Most mobile phones and tablet devices provide a nice user-friendly popover for form drop-downs. This should eliminate most of your mobile navigation problems.
Also, use larger touch target areas, especially in websites that a designed strictly for mobile.
Summary
Web designers should consider optimizing mobile website navigation for mobile users. To see the impact of you mobile interface, use Google analytics mobile feature to determine your mobile bounce rate. If your website’s bounce rate is substantially higher for mobile devices than for others, you may want to consider some changes, starting with mobile website navigation. The solution could be as simple as the addition of a drop down navigation feature.
