Below The Fold

A common usability myth is that users don’t scroll. You need to have everything important above the fold! CX partners has a great article which dispels that myth. They write:

Over the last 6 years we’ve watched over 800 user testing sessions between us and on only 3 occasions have we seen the page fold as a barrier to users getting to the content they want.

One important aspect they point out is that users use the scrollbar to figure out whether they have to scroll:

One of the most common things we see on a heatmap is a strong hotspot over the scrollbar. The scrollbar is used to assess the page length. Users expect to have to scroll.

This becomes a bit of an issue if the device you’re designing for doesn’t have a visible scrollbar. The most common example for such a device is probably the iPhone. If you’re working on UI design for such a device, here are two common ways of showing users that they can scroll.

Temporarily show the scrollbar

If you open your iPhone’s iPod application and switch to the «Vidoes» or «Audiobook» tab, you’ll see that a scrollbar will quickly show up, and then disappear. This serves as a subtle hint which tells users that there are more items than they can currently see.

Make it obvious that the content doesn’t fit on the screen

If the last row of items on the screen is only partially visible, users will recognize that they can scroll. The iPhone’s Photo Library application uses a particularly clever version of this: the button bar at the bottom of the screen isn’t fully opaque; it allows you to see that there’s more content further down.

Photo Library

If you require a short url to link to this article, please use http://ignco.de/196

designed_for_use_small

If you liked this, you'll love my book. It's called Designed for Use: Create Usable Interfaces for Applications and the Web. In it, I cover the whole design process, from user research and sketching to usability tests and A/B testing. But I don't just explain techniques, I also talk about concepts like discoverability, when and how to use animations, what we can learn from video games, and much more.

You can find out more about it (and order it directly, printed or as a DRM-free ebook) on the Pragmatic Programmers website. It's been translated to Chinese and Japanese.