Monday, 4 July 2011

Tabs, top or bottom?

In my previous post 5 tips for converting iOS UI to Android tip number one was that Android apps should use top tabs instead of bottom tabs like their iOS counter parts often do. This tip was based on recommendations from Google's Android developer advocates.

The recommendation started a discussion about tab location. There seem to be a lot of opinions on both sides of the argument. I think this topic deserves a new post for focused discusion.

But wait! Why should we care? Why can't all developers just implement what they want? 

The answer is of course platform consistency. We can serve our users much better if all apps on Android behave consistently. That way users won't have to learn to work with each app separately.

Following arguments have been put forth by various people. Special thanks to Mark Murphy (@commonsguy), Adam Lewkovytz and Stefano Forenza for participating in the discussion!


For bottom tabs: On larger screen size phones it is difficult to reach to the tabs if they are located at the top.


For bottom tabs: Default dialer app uses bottom tabs. If they would be a problem arguably the most important application of the phone would not use them.



For top tabs: Phone's physical buttons are located at the edge of the screen and having apps' main navigation right next to them can cause accidental key presses. These can be especially problematic in case of the back button.


For top tabs: Consistency between Android smartphones, Android Honeycomb and web. Web and Tablets always have top navigation.


For top tabs: Android app Action Bar is located on top. It makes sense to locate app's main navigation next to it for convenient access.



For top tabs: On-screen keyboard won't interfere with tabs on top but it will with bottom tabs.




What arguments are missing? Please leave a comment!


My opinion
I still find myself leaning towards top tabs. I use Sony Ericsson Arc with fairly large screen and personally I don't have any problems reaching the top of the screen for navigation (I'm aware of uselessness of anecdotal evidence and it's just my opinion).

I think that consistency between Honeycomb and web is the most important argument. Consistency between iOS app and Android isn't important. Not many people use Android and iOS but many people use we and Android and in the future probably Android tablets.

I found this heat map from Tobii Technology (Creative Commons). I think it reflects average smartphone usage pretty well. It seems to support the view that top is a ergonomically natural place for app main navigation.

image by Tobii Technology (CC)

Your opinion?
What do you think? Please leave a comment! If possible please include a source link to corresponding studies / articles.


[Update 2011-07-05]
Related twitter discussions

Android developer advocates Nick and Roman reiterated their stance on the tab location


 Nick Butcher 
@ 




 Roman Nurik 
@  



Tom Gibara pointed out an accessibility problem with bottom tabs. Check out his blog post about it.

 Tom Gibara 
@