Rel attributes: everything you need to know

Robin Fry

27 September 2023

If you’re the sort of person that likes to look at the source code of web pages, you may have noticed an attribute that pops up in link tags, rel=, with whatever it equals having a different value. This is the rel attribute. Even if you don’t like looking at the source code of web pages (good for you), if you have a website then the rel attribute is worth knowing about.

“Rel” is simply short for relationship, which is what the attribute is for – defining the relationship between the page the link is on and the page it is linking to. Some rel attributes can provide context to search engines that helps them to build a picture of whether that page being linked to is a valuable one for users to find in search results, or not.

Rel attributes can be useful when linking between pages on your website, or when linking to other sites. It can also be helpful to know when some of these attributes are being used on links to your website from others, and what potential impact to your SEO they might have.

What is a rel attribute? The basics

We’ll take a look at the important, and not-so-important, rel attributes shortly. First, let’s go through the basics of what a rel attribute is, and how to find them in links to or from your website.

The rel attribute can be added to the HTML code for a hyperlink. A link in a site’s code will normally look something like this:

<a href=”https://www.website.com”>website</a>

The <a> tag is used to define a hyperlink. As with the majority of HTML tags, there is an opening part (<a … >) and a closing part </a>, placed before and after whatever text or image is to be used as a clickable link. In this case, that’s the text “website”. The href attribute is used to determine where the link will take people – in this case the URL https://www.website.com. Without the href attribute, the link won’t do anything.

There are other attributes that can be added to an HTML link tag, but we’re just going to look at the rel attribute and what can be added to it. Adding a rel attribute in the HTML code for a link is a simple case of adding it to the tag, for example:

<a href=”https://www.website.com” rel=”nofollow”>website</a>

This will tell search engine crawlers not to “follow” that link by visiting the URL in the href attribute (more on that shortly).

A rel attribute can contain multiple values, separated by a space, e.g.:

<a href=”https://www.website.com” rel=”nofollow noopener noreferrer”>website</a>

So, what are all the different values and what do they mean?

The canonical tag

This is the rel attribute we talk about most often in SEO, as it’s by far the most crucial. In fact, not using canonical tags on your web pages can really drag your pages down when it comes to how well they rank in organic results for even the most relevant search queries.

Different versions of pages, with slightly (or even wildly) different URLs, can exist for all kinds of reasons. Internal search parameters may be added to a URL if your search functionality is set up that way, for example:

https://www.website.com/search

https://www.website.com/search?product=socks

https://www.website.com/search?product=socks&colour=blue

All of the above URLs would show you the same page with a slight variation, but search engines could view them as three distinct pages if there’s nothing to indicate they aren’t.

The same page can be accessed with very slight variations on the page, for example:

https://www.website.com/example

https://www.website.com/example/

https://www.website.com/Example

All the above URLs would take you to the exact same page, but again could be seen as different pages by a search engine due to the slight differences between each.

There are other ways different URLs could exist for the same, or very similar, pages. However it happens, it can lead to duplicate versions of pages being indexed. When this happens and you have multiple pages that could potentially appear in search results for the exact same queries, it dilutes how well any of them can perform in search. You really just want one default version of each page to be indexed so it can rank as well as possible without competing with other pages on your own site. This is exactly what the canonical tag is for.

In the website.com example above, if we add this tag to the <head> section of the HTML code of the page:

Note this is a self-contained link; as it is in the <head> section, has no anchor and the closing / character is contained within the opening tag, it won’t generate a link anywhere on the page. This is for bots’ eyes only (and for those people who like to look at source code).

The tag will let search engines know that this is the default version of the URL that you want to be indexed. It can still crawl the other variations, and users will still get to the page if they type those variations into a browser, but search engines will treat the whole group of URLs with that tag as one single entity with a single URL.

You can use the canonical tag on single pages that might generate multiple URLs as above, in fact I recommend that you do. But you can also use the canonical tag on distinct and separate pages that have the same, or extremely similar content, in order to group them together and make sure that they aren’t fighting with each other for attention in search results.

Canonical tags can also be used across different websites, if they are sharing duplicated content. This is really useful when publishing syndicated content across multiple websites. A canonical tag can be added to every version of an article to point to the “original” version of the piece. In that way, rather than have all those pages competing for ranking and never knowing which might win, you have just one page that won’t be held back by its duplicate versions on other sites and has a much better chance of ranking well for the relevant queries.

The nofollow value

The nofollow value is one of the most commonly used in links between web pages. It’s also the rel attribute that has the greatest impact on SEO. A nofollow tag can be used to prevent search engines from establishing any relationship between the site doing the linking and the one it’s linking to – basically a way of saying “this link is not an endorsement”.

Normally, when crawlers are able to follow a link, search engines will use that to establish a relationship between the two sites. That’s been a key element in SEO since its earliest days, although the way this works now is far more complex than it was back then. But basically, a link from a well-regarded source will bestow some of its “authority” onto the page it is linking to. That’s a massive oversimplification, but a helpful way of seeing why links are important for SEO. The more links you have from well-established sites with a strong reputation, the more this will rub off on your own site.

However, a nofollowed link impacts this. Again, things used to be simpler; once upon a time having a nofollow tag on a link meant that absolutely no authority was passed from one site to another, and for SEO purposes the link may as well not exist. At least that’s what most SEOs thought. But in 2019, Google announced that they were treating nofollow attributes as a “hint” only and that their crawlers may ignore a nofollow attribute and follow the link regardless. Bing quickly claimed that they had always treated nofollow tags this way. It’s fair to assume that most search engines have a similar viewpoint at this stage.

Still. the intention of a nofollow link is to show that the website doing the linking doesn’t necessarily endorse the site it’s linking to. Our experience shows that nofollow tags do seem to prevent authority from being passed from one site to another, without any significant change in 2019 or at any other time. While all links to your site have the potential to bring new visitors, we still think it’s fair to view nofollowed links as at least somewhat less valuable from an SEO standpoint than those without a nofollow attribute.

Our advice for assessing your backlink profile would be to look at the ratio of nofollow to “followed” links you have. If there’s a high proportion of nofollow links (as a rule of thumb, under 30% is fine, over 50% is a problem), then the benefit your site is getting from those links will be diluted and you need to try to increase the proportion of backlinks without a nofollow tag.

A nofollow value could also be added to an internal link, to ask crawlers not to go to certain pages and potentially save crawl budget. There are more efficient and effective ways of doing this, though, for example using your robots.txt file to block crawling of specific pages or folders.

rel=”alternate”

I’ve talked about (arguably) the most important and most commonly used version of this type of link attribute in a previous post on hreflang tags. So I won’t go on about the alternate tag too much again here. The main thing to understand is that it indicates when there is another version of a page for some reason, for example in a different language or serving a different geographical region. It’s similar to the “next” and “prev” values, in that it shows search engines that there are closely related but different versions of a page. However, it doesn’t direct them to view one URL as the “default” version of the page – you should use a canonical tag to do that.

The noreferrer value

The noreferrer tag doesn’t have a direct impact on SEO, but it will affect your analytics if other sites are using it when linking to your pages. Adding the tag means that no referrer header will be included when a user clicks on the link. That means that it will be logged as a direct visit (i.e., as if someone typed the URL into their browser to visit), rather than a referral from another site, in your web analytics.

There’s not much you can do about this, but it’s certainly something to be aware of when checking your website traffic. If you were expecting to see an influx of traffic from a particular site in your analytics, but it’s just not there, it’s worth checking the link(s) from that site to see whether they’ve had a noreferrer tag added. If so, you should hopefully see an increase in direct traffic to your site, although unfortunately you won’t be able to see exactly how much of that, if any, came from that specific site.

This probably won’t happen that often, but it’s worth noting that WordPress sites will automatically add the noreferrer and noopener (see below) values to any links that are set to open in a new tab (i.e., with the target=”_blank” attribute).

You may want to use the noreferrer attribute on your own links to other sites, if for some reason you don’t want to alert site owners that you’re linking to them. It is definitely not a good idea to use the noreferrer tag on internal links in your site, as it will really mess up your analytics, causing it to report users simply moving from one page to another as a new direct visit instead.

Pagination tags

Pagination tags are useful for indicating that you have sets of pages with similar content on them. These attributes come as a pair – the “next” and “prev” tags. They help to signpost where a page fits with the others and which is the first or last page in the set. This helps you to avoid duplicate content issues, as often sets of pages can look very similar to each other, particularly if they are listings of some kind with similar or sparse text content.

How useful these tags are for SEO depends on the search engine. Google have publicly stated that they don’t pay any attention to them; however Bing still uses them for page discovery and other search engines may still view them as important.

It should be fairly obvious from the names what each attribute does, but I’m going to explain it anyway as that’s the entire point of this post. The “next” value indicates which URL comes next in the sequence, while the “prev” value points to the previous one. If you’re on the first page in the set, you don’t include a “prev” tag, and you don’t include a “next” attribute on the final page.

Using our own blog as an example, the first page has this tag in the HTML:

The fifth page has these tags:

And the last page in the sequence (page 10 at time of writing this post) has this one:

This makes it clear not just how many pages are in the set, but also where to start and where to end.

A quick note on using pagination tags in conjunction with the canonical tag: I’ve often seen people adding a canonical tag to all pages in a consecutive set that indicates the first page should be treated as the default URL for all subsequent pages. This is not good for SEO, as it means only the content and/or links on that first page will appear in search results. If you have good content on those other pages that you want people to find in search (and you should), don’t do this. Set a canonical URL that sets the page itself as default, regardless of where it appears in the hierarchy. Search engines can then decide for themselves which page, or pages, in the list are the most relevant one to appear in a particular search result.

Other rel attribute values

Those are the main rel attribute values that are likely to have some impact on your SEO, either directly or indirectly. There are a few others; these ones are very unlikely to impact how well your website fares in search results, but they can be useful for web development in general. It’s never a bad idea to use tags and markup to signpost areas that both users and search engines might find useful. The easier it is for people and crawlers to get around your site and find valuable content, the more likely it is your pages will perform well in search results.

These are the other rel attribute values you may want to use on your website:

author – use this when linking to the content author’s own page, either on your site or externally.
bookmark – a link to a permanent URL used for bookmarking. Useful if a piece of content may be moved or archived, causing its URL to change.
external – for links to pages or documents on other websites.
help – indicates that the link will send users to a help article or guide.
license – for links to any document licensing information.
search – use this when linking to the main page for your website’s search tool, if it has one.
tag – a link to keyword tag(s) for the current document*.

*I’m telling you this last one exists in the interest of being thorough. My SEO advice would be to definitely not use this, in fact not to have pages of keyword tags on your site at all, as it looks spammy and search engines will either ignore them anyway or, worse, get all grumpy about them being there. If you have a CMS that generates those types of pages, use your robots.txt file to ask search engines not to crawl them.

So, those are the different types of values that can impact links. There are others that don’t, but we don’t need to talk about those here. If you know of any others that I haven’t mentioned here that could be useful for SEO or for web development in general, get in touch!