Clagnut

Menu

Linkorama

§ Blogging · Web standards · Browsers · Accessibility

Thanks to Mark Pilgrim’s indispensable Dive Into Accessibility [a must read for every web designer with or without a semblance of moral fibre. Remember kids: accessible is the new grey. Or something] I have rediscovered the long-forgotten link tag.

The link tag is used to point at a linked resource and nowadays is pretty much limited to pointing to style sheets, and more recently XML versions. But those of you who learned your HTML a good few years ago may remember link mentioned with examples such as this:

<link rel="Next" href="sect4.html">

And if you were anything like me, you had no idea how this could be applied to the real world; no browser seemed to support it. Well that has now changed. As of version 1.1, Mozilla supports all of the recognized link types in an extremely useful way.

To see how, you’ll first need to turn this feature on with View > Show/Hide > Site Navigation Bar > Show Always. If you then go to a W3C page, most of which use plenty of link tags, you’ll see something like:

Screenshot of Mozilla's implementation of the link tag.

As you can see, this enables you to navigate through multiple file documents very easily with next, previous and table of contents links shown in a browser toolbar. Mozilla is not the only browser to support this feature; iCab and text readers such as Lynx & Links also provide good support. This is important to genuinely improve the accessibility of your web site.

Like most things on the Web, the link tag was designed to aid navigation of conventionally structured documents such as reports, books and W3C Recommendations. And that includes web logs. Consider implementing these recognized link types:

  • rel="start" to link to your home page
  • rel="next" for the next entry in your blog
  • rel="prev" for the previous entry in your blog
  • rel="help" to link to an Accessibility Statement or your About page
  • rel="search" to link to your search page

You can make these even more useful with the addition of title attributes. Check the source of clagnut for examples of real-world implementation.