After reading an article I just read by Luke Wroblewski, entitled “Mobile First”, I was reminded of a few years back, when I ran a printing company in Pensacola, FL.
I always asked my new clients how they found out about the company and I noticed that a notable amount of new clients were finding us through a google search on their iphones. I once got a call from a client who asked for directions to the shop. When I asked him how he found out about the company, he said that he had just got through doing a google search WHILE DRIVING!
Mobile surfing / browsing is EXPLODING right in front of us. Fact: Smartphone sales will actually pass PC sales in 2011
Simply put, below are some key points to consider when prototyping and designing a mobile web design:
1) Flexible layouts is crucial to accommodate the various mobile screen sizes as well as laptops and various PC monitor sizes
2) ” the main function should be immediately apparent. Minimize the number of controls from which users have to choose.”
-iPhone interface guidelines
3) Button size is important. Too small, and the users can’t touch them with ease on their screens. Too big and you will lose valuable “screen real estate”. Below are some recommended mobile app button sizes:
- iphone: 29px wide by 44px tall
- other sources recommend: touch target of 9mm/34px and a minimum of 7mm/26px
- spacing between elements: 2mm/8px
Also consider using a larger “release size”. This is to ensure that even if a user’s finger or thumb slips before releasing, the button is still pressed.
4) For now*, use the “hover” state sparingly. Think about it, how is hover possible on an iphone?
*patents are in the works for smartphones to utilize a hover state.






Reader Comments
RSS feed for comments on this post. TrackBack URL
Leave a comment