Free Xenon Consulting » Link Element http://www.freexenon.com PSD or Image to Site with Accessibility Built In Mon, 17 May 2010 15:59:18 +0000 http://wordpress.org/?v=2.8.4 en hourly 1 Usage of the Link Element http://www.freexenon.com/2009/10/19/usage-of-the-link-element/?utm_source=rss&utm_medium=rss&utm_campaign=usage-of-the-link-element http://www.freexenon.com/2009/10/19/usage-of-the-link-element/#comments Mon, 19 Oct 2009 14:50:00 +0000 FreeXenon http://www.fx.serenitystudios.com/?p=11 I originally published  this about November 20, 2005 but I think that I will republish it. , I think, and thought I would publish it as it is.

The <link> element provides context by providing links to other pages in the collection and shows how they are related to the current page. Here is a quote fron the HTML 4.01 Spec that is echoed in the other specs and I have emphasized the important part:

This element defines a link. Unlike A, it may only appear in the HEAD section of a document, although it may appear any number of times. Although LINK has no content, it conveys relationship information that may be rendered by user agents in a variety of ways (e.g., a tool-bar with a drop-down menu of links).

There are quite a few options that we can set for a webpage. The one drawback to using the <link> element is that it is not supported by or easily accessible in all browsers. Because of this we cannot count on the <link> tag. Just remember that this is out there and that as standards, development skills, and the semantic web evolve the <link> tag will become much more prevalent and useful for setting the context of a webpage. Some progressive websites do use this and it is a boon to accessibility, but for now just keep this in mind (and use it) Here is a list of some of the commonly used link types that can be set:

Start
Refers to the first document in a collection of documents. This link type tells search engines which document is considered by the author to be the starting point of the collection.
Next
Refers to the next document in a linear sequence of documents. User agents may choose to pre-load the “next” document, to reduce the perceived load time.
Prev
Refers to the previous document in an ordered series of documents. Some user agents also support the synonym “Previous”.
Contents
Refers to a document serving as a table of contents. Some user agents also support the synonym ToC (from “Table of Contents”).
Chapter
Refers to a document serving as a chapter in a collection of documents.
Section
Refers to a document serving as a section in a collection of documents.

By using the Link element there are quite a few ways that you can set the context for a webpage. All are not supported by all user agents and there are more options for links than are listed here. They even go so far as the say that you may create your own values for the rel attribute. A very rich and extensive relationship set can be created for an individual page. A large listing of relationships used can be found on this Tripod Page. Here is a simple example of their use:

<head>
 <title>Types of Flowers - The Flower Guide - www.flowerguide,com</title>
 <link rel="start" src="index.htm"     title= "The Flower Guide Home"  />
 <link rel="next"  src="arranging.htm" title= "Next page: Arranging Flowers" />
 <link rev="prev"  src="arranging.htm" />
 <link rel="prev"  src="buying.htm"    title= "Previous page: Buying Flowers" />
 <link rev="next"  src="buying.htm" />
</head>

By this simple example we can see that the current page’s topic is ‘Types of Flowers’ and the start page is index.htm. It has a page that preceeds and succeeds it and their reverse relationships are also set. With this example we have set how 4 pages in the (topical) collection relate to each other.

Opera, Mozilla, iCab (Mac), and Lynx browsers and some Screen Readers show these link elements for you to use. Internet Explorer and Firefox and Netscape (Mozilla) need an add-on for this to be visible (IE: Link Toolbar; Netscape or Firefox: Link Toolbar or Link Toolbar). Here are list of methods to show a Link Navigation Bar in browsers that natively support it:

  • In the latest release of Mozilla (1.8A1) you can go to View -> Show/Hide -> Site Navigation Bar
  • In the latest release of Opera (8.0) you can go to View -> Tool Bars-> Navigation Bar

Check the following articles:

]]> http://www.freexenon.com/2009/10/19/usage-of-the-link-element/feed/ 0