Im trying to make my own iphone style navigation UI for mobile devices, but when I browse it, it’s very small on my iPhone 4 (http://yz.pl/bohner/work/notifications/). I’m guessing it has something to do with the fact that I have set absolute height of the header bar? If, not what other tips do you have on making a all-mobile-browser-friendly website nav?
Thanks.
It is more than likely due to the size. You must remember, the iPhone 4 as a retina display, which is double the pixel density compared to previous iPhones. So, for the bar to look the same on the iPhone4 and 3GS, the images need to be double the size.
I would likely quote coneybeare statement
“Apple says that the avg finger tap is 44x44 (from WWDC). All table rows are recommended to be at least that height. It is common for icons to appear 32x32, but have padding to make the touchable area 44x44. Of course, people can tap a 1x1 if they are very careful, but why make people try harder than they need to in order to use your app?”