Saturday, March 10, 2007

Improving the User Experience with In-page Navigation

How to design in-page navigation ...

"In-page navigation techniques are used to layout web content on a page. When used properly they improve the user experience. But when misused they just add to the anxiety. This article chalks out the different in-page navigation options available to us and offers some tips on using them effectively.

What is in-page navigation?
In-page navigation is navigation to content that exits within the same page. The table of contents (TOC) links on a Wikipedia article is the most basic example of in-page navigation. The links take you to the relevant text on the same page.

Example: Wikipedia entry for Market Research.

In the example above, the TOC helps the reader to quickly make sense of the article. It aids scanning and encourages satisficing—both of which enhance the reading experience.

I will bring out the relationship between in-page navigation and Ajax a little later, but if you're in a hurry, you can read it now!

Same code, different layouts
The TOC-based navigation is the most primitive form of in-page navigation and is still used extensively and in different variations—a frequently asked questions (FAQs) list and an A-Z index are some common examples.

With the maturing of browsers, web standards and especially JavaScript, different layouts can be built on top of the basic TOC format. Here are some samples that use the same basic TOC markup but are styled and scripted differently."    (Continued via PebbleRoad)    [Usability Resources]

In-page Layouts - Usability, User Interface Design

In-page Layouts


Post a Comment

<< Home

<< Home