Most web developers use the <link> tag and the rel attribute just twice per page: to bring in an external style sheet and load a favicon. But rel actually has many uses. In previous articles I’ve talked about using the tag to indicate the next and previous logical pages, and to preload content, but rel can be used for far more. Some examples:
- rel="archives"
- Indicates the location of an archive page: for example, a page that lists all of the articles in a blog. It may also be attached to a hyperlink:
<a rel="archives" href="archives.php">Articles</a> - rel=external
- Used almost exclusively for links in the body to indicate that a linked resource is outside the current domain. It is useful for adding to comments (as you can set up robots.txt file to have search engine spiders ignore external links, avoiding any reward to comment spammers;
rel=nofollowmight be used for the same reason), and for presenting external links differently in CSS or JavaScript by using an attribute selector. - rel="license"
- Indicates the conditions of a license governing the uses and permissions of site content. Associated with Creative Commons but supported by other license systems. May be used in the
<head>as<link />, or an<a>element in the<body>. - rel="search"
- Links to a search document that follows the OpenSearch.org format.
- rel=first,last,up
- In addition to the
nextandprevvalues mentioned above,first,lastandupdefine appropriate resources in a sequence that could be appreciated linearly. (Think first and last articles and in blog). “up" is perhaps best understood as a shortcut for “home”, but could also be used to indicate “go up a level” in a site organized on a hierarchical model. - rel="me"
- Used to verify identity on web pages, or linked sites; for example, linking from your site to your Google+ URL:
<a rel="me" href="https://plus.google.com/115433388220321744732"> Dudley Storey</a>
Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.
