O'Reilly logo

Designing Web Interfaces by Theresa Neil, Bill Scott

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Inline Paging

What if instead of scrolling through content we just wanted to make pagination feel less like a page switch? By only switching the content in and leaving the rest of the page stable, we can create an Inline Paging experience. This is what Amazon's Endless.com site does with its search results (Figure 7-6).

image with no caption
Endless uses Inline Paging to create a seamless experience moving through search results

Figure 7-6. Endless uses Inline Paging to create a seamless experience moving through search results

Considerations

There are some issues to consider with Inline Paging.

In-page update

Endless.com provides the normal pagination controls. But instead of the whole page refreshing, only the results area is updated. Keeping the context stable creates a better flow experience. With Inline Paging it feels like the user never leaves the page even though new virtual pages of results are being brought into view.

Tip

Paging is sometimes the most convenient and natural way to break up information.

Natural chunking

Inline Paging can also be useful when reading news content online. The International Herald Tribune applied this as a way to page through an article while keeping the surrounding context visible at all times (Figure 7-7).

The International Herald Tribune uses Inline Paging to seamlessly move through a story without losing context

Figure 7-7. The International Herald Tribune uses Inline Paging ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required