10 Basic Design Elements to Consider When Optimizing for Mobile

More of us are designing for mobile. There are few tips we have come across when advising clients.
  1. Less is better. It  may seem obvious but  it can be the hardest part of a mobile design. The space you have to work with is precious and you have to be exact about what you want the visitor to see and do.
  2. Use bigger touch targets. The entire story needs to be tappable do not expect users to be precision tappers – research generally shows that the smaller the area to tap the more you are likely to loose the visitor.
  3. Use full headlines – do not truncate headlines. This will give the biggest design improvement, because the full headline provides substantially stronger information trail than  few words.
  4. Enhanced scannability by highlighting key words in the headlines.
  5. Always show a short story summary. Show it under each headline to increase the strength of the information trail and encourage the user to move to the next step.
  6. Using unique thumbnail photos wherever possible. This adds visual interest, enhances scannability and information trail. A picture says a thousand words and the visitor recognizes a picture faster than they can read a headline.
  7. Use your space very carefully. It is OK to use tighter spacing to get more information onto in first mobile page. Users do scroll down but the more they can view in less space means that they work less for each new story.
  8. Try and cut out repeated information. Information redundancy is a poor use of screen space – this is true for any web design. Consider whether certain information is really needed – categories, tags, dates etc.
  9. Ensure sufficient spacing between the navigation options. There is nothing more frustrating than touching the wrong option.
  10. Label your drop-down menus instead of using just a triangle to denote options.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s