October 1, 2002, 1:52 PM ET
A clear path to better navigation
Many people -- even seasoned Web designers -- don't know about <link rel="prev"... /> and <link rel="next"... />, which are two lines of HTML code you can put on any Web page in order to give your users easy navigational cues to the "previous" and "next" pages on your site.
With those two pieces of code in a page, modern browsers (such as Mozilla, or Netscape 6 and up, but not Internet Explorer) will automatically provide a way for users to navigate to the previous or next page. In Mozilla and new versions of Netscape, for example, there's something called the Site Navigation Bar, which is a GUI for site navigation. (Turn on the feature by going to the "View" menu, then "Show/Hide," then "Site Navigation Bar," then "Show Always". When you do that, you'll get a small horizontal bar with buttons that include "Previous" and "Next.")
Doing this offers an obvious benefit: a supplemental, consistent way of navigating your site. Plus, it makes your site more accessible. Those two simple lines of code can be a great benefit to users of alternate browsers. See Dive Into Accessibility for more.
So why do I bring this up? Two reasons.
One, I've added this functionality to Holovaty.com.
- From any permalink page, you can access the previous and next blog entry through the Site Navigation Bar.
- From any day archive page, you can access the previous and next day's worth of entries.
- From any month archive page, you can access the previous and next month's archive page.
- And from a year archive page, you can access the previous and next year's archive page. (Of course, I started the blog this year, so that's not possible yet.)
(I've also added textual links to "previous" and "next," under "THIS PAGE," on all the aforementioned archive pages.)
Two, I think every news site should be doing this.
One of the biggest problems with online newspapers is the experience of reading them. There's no clear path through the news -- an advantage print newspapers have had since the get-go.
In a print newspaper, you start at the front page and read until you've reached the end. If you don't feel like reading a story, you skip it and go to the next one. When you reach the end, it's over. Complete. There's a sense of accomplishment and a sense of closure. You can move on with your life.
Not so online. There's so much garbage on news sites that, oftentimes, reading one actually leaves you more frustrated and overwhelmed than enlightened. Each click to a new page brings more headlines. You start forgetting what you've read, what you haven't read, what you don't want to read -- and what you wanted to read but lost track of five clicks ago.
That's why I'm convinced "previous" and "next" links are such a good idea.
More people would read more online news stories if they were given something as simple as a linear navigation. Many sites try to overwhelm users with "Complete coverage!" "Unedited transcripts!" "50 related links!" I'm not advocating the abolition of these features; they're a great help to someone who's interested in a topic. But for the people who just want to catch up on the day's news, there's no clear path. And, importantly, there's no sense of closure.
A few news sites already provide this feature. Some examples:
- Journal-Pioneer (Prince Edward Island, Canada)
- Australian Broadcasting Corporation
- Detroit News (Michigan)
- North County Times (California)
- Los Altos Town Crier (California)
- Wooster Daily Record (Ohio)
- Amarillo Globe-News (Texas)
- ZDNet (U.K.)
- Ottawa Sun (Canada)
It's great to see "previous story" and "next story" links in action, but what these examples lack is consistency. Sometimes the "previous" and "next" links appear at the top of the page; sometimes they're at the bottom. Sometimes they're colored arrow icons; sometimes they're text links. Web users have very little incentive to relearn a convention for every site they visit.
That's where <link rel="prev"... /> and <link rel="next"... /> come in. They're consistent. Those links will always be in the same place -- in your Site Navigation Bar (if you're using Mozilla and NS6+).
Put those links in, tell the public they're there and explain how to use them -- and I'm sure your site will see results.
