Rotating Navigation Mechanism

Seems like the rotating navigation mechanism has been steadily gaining popularity over the last few years, paritcularly for news sites, but also for ecommerce sites. With this device, you can highlight multiple stories or products within the same space on the page.

Most have a very limited number of items–between 2 and 5. There are two ways to navigate though them:

1. Automatically: The stories generally rotate through a cycle automatically–usually after about 5 seconds each. This can be paused in some cases.

2. Manually: Users can manually scroll through the stories or products either with a step navigation or by direct access. This resembles paging navigation very closely.

NPR.org has one of these, for instance:

So does Dell.de for product highlights:

The rotating items tend to fade in and out subtly, so even with the automatic rotation there isn’t a strong sense of animation on the page. It’s generally not too distracting. The advantage is that you can get more content on the page with less scrolling and fewer content boxes.

The rotating navigation mechanism seems fairly intuitive to me, and as we see this more often I suspect web users may even grow to expect it. It certainly beats a ticker, which just seems both clumsy and old fashion these days.

About Jim Kalbach

Head of Customer Success at MURAL

2 comments

  1. Pingback: Rotating Navigation - Examples « Experiencing Information

  2. Mia

    This design pattern is widely referred to as a carousel: http://developer.yahoo.com/ypatterns/pattern.php?pattern=carousel

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 )

Twitter picture

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

Facebook photo

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

Google+ photo

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

Connecting to %s

%d bloggers like this: