Tutorial

Rel Attribute for Link Tags in HTML

While this tutorial has content that we believe is of great benefit to our community, we have not yet tested or edited it to ensure you have an error-free learning experience. It's on our list, and we're working on it! You can help us out by using the "report an issue" button at the bottom of the tutorial.

The rel attribute inside link tags (<link>) describes the relation to the resource being linked to. It can take one of these 16 values:

  • alternate: Alternate version of the document.
  • author: Author of the document.
  • dns-prefetch: The DNS lookup and handshake should be prefetched for the linked resource.
  • help: A resource for help on about the whole document.
  • icon: An icon resource.
  • license: License and legal information.
  • manifest: Web App Manifest document.
  • next: Next document in the series.
  • pingback: External resource called for pingbacks in the comments.
  • preconnect: The connection should be opened in advance.
  • prefetch: The resource should be prefetched.
  • preload: The resource should be preloaded.
  • prerender: The resource should be prerendered.
  • prev: Previous document in the series.
  • search: A document meant to perform a search in the current document.
  • stylesheet: The most commonly used value. Linking to an external stylesheet.

Note that dns-prefetch, preconnect, prefetch, preload and prerender are simply hints to the browser and are currently experimental. They are not supported in all browsers, and you can refer to the Can I Use? page for more information about browser support. Here’s also a summary about the difference between the different behaviors for these resource hints.

Here’s the typical scenario where we see rel being used:

<link rel='stylesheet' href='style.css' type='text/css'>

See Also

Creative Commons License