Link relations: rel=""

Link relations is a way to explain why a resource is be linked to as well as build an understanding of the relationship between data. Common uses of link relations in web design are linking to a stylesheet, image or a javascript file. HTML5 expands the concept of link relations even further by adding more categories to the vocabulary.  By categorizing a link ( rel="" ), a web designer is able to tell the program interpreting the code how to process it.

There are two types of link relations:

1. Hyperlinks
2. External resources

Example of the most common uses of HTML link relationships:

• Stylesheets: Declaring that the resource is a stylesheet:  rel="stylesheet"
• Icons: rel="icon"
• Nofollow: rel="nofollow" - Tells Google not to assign PageRank to the referenced website--a very important tool for SEO and web designers.
• Canonical: rel="canonical" - This indicates that there is another alternate link to access the referenced information and that search engines should favor the other link.

<link href="main.css" type="text/css" rel="stylesheet" />

There are quite a number of classifications for links. From specifying a usage to creating an understanding of directional navigation, the REL component of a link can provide helpful meta data for a browser or an application.

Navigational relationships:

• End: rel="end"
• Next rel="next"
• Previous rel="prev" or rel="previous"
• Begin rel="begin"

Other examples:

• Alternate media: rel="alternate"
• Citation: rel="citation"
• Footnote: rel="footnote"
• Copyright: rel="copyright"
• Returning navigation back to homepage: rel="start"

You can also use such meta data (or microformats) to provide an understanding of a relationship between people as well:

• Me rel="me" - Used commonly in social media to indicate that the linked person (or website) is one's self.
• Colleague, co-worker, neighbor, aquantance, friend or more...