In Praise Of Mobile Browser Navigation Controls
My recent trial of a Nokia E6 reinforced something I've suspected for a long time. The current fad of removing navigation controls like arrow keys, D-pad, trackball or touchpad from touch screen phones is bad for usability. Designers seem have fallen in love with the idea of a smooth, all-screen front face on their devices, which means removing as many buttons as possible.
But, you may say, navigation controls are redundant on a touch device as you can just tap links and buttons on the screen. Maybe, but I run into some major frustrations trying to use touch screen browsers with mobile and desktop sites that aren't touch aware. My pet peeves about pure touch browsing are:
- Important functions that can only be accessed by tapping a tiny image link with a too fat finger.
- Radio buttons and check boxes that don't toggle reliably when tapped.
- Drop down menus that won't drop down.
- Problems with hidden links and buttons not appearing as they are supposed to when you mouse over them.
- Accidently clicking links when scrolling.
- It's too hard to accurately select text to copy from a Web page.
- Difficulties in positioning the cursor precisely for editing in a text box.
- Problems scrolling through text that's longer than the text box or text area it's displayed in.
You could argue that it's up to web publishers to fix their sites so that they work well in all browsers. But that's not going to happen anytime soon. I believe it's the job of device and browser designers to come up with touch interaction paradigms that work with today's web sites. Some like iOS do a fairly good job. But most do not.
On the other hand, both the Symbian Anna browser and Opera Mobile 11.1 on the E6 implement an on-screen mouse cursor that's controlled by the arrow keys. It's a simple, intuitive solution that works far better than any touch only alternative, particularly on sites that use mouse-overs to un-hide navigational elements.
Don't believe me? Here's a real world example that affects all WordPress blogs that have child categories and use the Twenty Ten or Twenty Eleven themes. Twenty Eleven is the default theme in the current 2.3.1 version of WordPress, so this issue potentially affects millions of sites. Both themes let you assign categories to menu pads. If a menu category has child categories they can be reached by dropping down the menu with a mouse-over. That's easy and intuitive with the E6, just position the mouse cursor over the menu using the arrow keys and the menu drops down, then position the cursor over the desired child menu pad and click. There's an Twenty Eleven demo at twentyelevendemo.wordpress.com. Open that page with a touch only browser and see if you can drop down the "A Parent Page" menu and select one of the child categories. Unless you are using an iPhone, I bet you can't. I had trouble with seven out of eight other mobile browsers that don't have a pointing device. Here's a table showing what happened when I tried:
Page 1 of 2 | Next page
