What is rel=”noreferrer noopener” Attribute and its Effects on SEO

In this article,

I’ll explain the distinctions between the noreferrer and noopener tags, how they differ from the nofollow tag, and how they affect the SEO of your website.

• • What exactly is rel=”noreferrer”?
  • Use of rel= “noreferrer”?
  • rel= “noreferrer” and its effect on SEO
  • WordPress and Noreferrer
  • Affiliate links and Noreferrer 
  • Nofollow vs Noreferrer
  • What is rel= “noopener”?
  • rel= “noopener” and its effect on SEO

Let us begin with a few definitions.

What exactly is rel=”noreferrer”?

The rel= “noreferrer” tag is one of HTML’s special attributes, which is used in a link tag (< a >) to prevent the referrer information from being passed to the target website by removal of the referral info from the HTTP header.

If rel= “noreferrer” attribute is used in the link, Google Analytics shows the traffic coming from that link as “Direct Traffic” instead of “Referral”.

In HTML View, the noreferrer attribute looks like this:

< a href= "https://www.website.com "rel=" noreferrer "> Link to website.com </a>

Here’s an example to help you understand it better:

Let’s say,

You are not using the “noreferrer” tag while linking from your website to the target website.

When the webmaster of the target website views the Google Analytics report, he will see that the traffic is coming from your website under the “Referrals” section.

Now,

You have used the “noreferrer” tag while linking from your website to the target website.

This time, the traffic going from your website will appear as “Direct Traffic” in Google Analytics and not a referral.

Use of rel= “noreferrer”?

When you don’t want other websites to know that you’re linking to them, you should use the rel= “noreferrer” attribute on outgoing links.

I can’t think of a good reason why you’d want to do this, but it is what it is.

Internal links should never have the rel= “noreferrer” attribute because it can cause problems with your Google analytics results.

rel= “noreferrer” and its effect on SEO

There is no direct impact of the rel= “referrer” tag on the SEO. You can use it without being worried about anything.

However,

It has an indirect impact on your link-building and promotion activities for the following reasons:

Linking to other webmasters’ sites is one way to attract their attention.

Every day, webmasters check their Google Analytics, especially the ‘Referral traffic’ section.

When they see that traffic is coming from a referral source, they will probably check it out and share the page on social media, follow the author, or even give a link back as a favor.

If you use the noreferrer tag on your links, nothing will happen because traffic from your website will not appear as a ‘Referral’ in Google analytics, and other webmasters will not be aware that you have linked to them.

You’re probably wondering why we’re even talking about it; no one uses them, and I’m not going to use the noreferrer tag at all.

The reason why rel= “noreferrer” is the big topic of discussion is that WordPress adds the ‘noreferrer’ tag by default to all the outgoing links, which are set to open in the new tab.

WordPress and Noreferrer

So,

if you have created your website with WordPress and you add external links to your blog and set them to open in the ‘new tab’, WordPress will automatically add the noreferrer tag to the link.

Here is an example:

< a href= "https://www.website.com/" target= "_blank" rel= "noopener noreferrer" > my website link </a>

How do I get rid of the rel= “noreferrer” attribute from WordPress links? 

The only way to stop WordPress from adding the noreferrer tag to the links is to avoid opening the links in a new tab.

This means that you can choose to open links in the same tab – The easiest solution to this problem.

But many people are concerned about the fact that users once clicked on the link will be redirected to the other website and leave their website.

Which will result in an increasing bounce rate and decreasing the time on the website.

However,

Because mobile devices now account for the majority of traffic, you shouldn’t be too concerned about users leaving your website, as the behavior of the ‘new tab’ on the smartphones makes it tough for the users to return to the previous tab.

A plugin might help here a bit to prevent WordPress from adding a noreferrer tag to external links, but those plugins only function when the TinyMCE editor is used and not the Gutenberg editor.

My advice is not to mess with it; simply stop opening external links in new tabs and you’ll be fine.

Affiliate links and Noreferrer

Noreferrer has no effect on affiliate links.

The explanation of that would be -Most of the affiliate programs award conversions based on the affiliate ID included in the link, instead of relying on ‘referral traffic’. Look at the below example:

< a href= "//www.shopify.com/sem/? ref=14572612 "rel=" noreferrer noopener "target=" _blank "> Affiliate link </a>

So, no need to worry about that.

Nofollow vs Noreferrer

When you use rel= “nofollow” for an external link, you’re telling the search engine to not pass the PageRank from one page to another. In other words, you’re telling them to not consider the link for SEO purposes.

The major difference between nofollow and noreferrer is that noreferrer does restrict the forwarding of any referral information to the browser, but the link contains a “dofollow” attribute by default, which means it is followed.

While in Nofollow, the link is not followed but it does allow passing the referral information to the browser.

Now,

You know that those two attributes are not the same.

If you don’t trust the target site, use a nofollow link, and use noreferrer in links if you don’t want the webmaster to know you linked to them.

What is rel= “noopener”?

Another HTML special attribute that can be added to external links is rel= “noopener.” It basically prevents the opening page from accessing the original page in any way.

Let’s look at one example of the rel= “noopener” tag:

< a href= "https://www.website.com "rel=" noopener "> Link to website.com </a>

For security purposes,

WordPress automatically adds this to all external links that open in a new tab, and it is recommended that you keep it that way.

If you do not use WordPress, you should add the rel= “noopener” attribute to all external links on your website that open in a new tab.

rel= “noopener” and its effect on SEO

Since Noopener has no effect on your SEO, you can use it to improve the protection of your website with confidence.

Takeaways

Many people face confusion when dealing with HTML tags and attributes. This is not the case for noreferrer and noopener.

Both of the attributes are safe from the perspective of SEO, so you can use them without being worried.

In WordPress, these tags will be automatically added to the links that open in the new tab.

Many people are unaware of the advantages of the noopener tag.Use of which prevents other websites from gaining access to your page.

The Noreferrer tag prevents referral information from being passed to an open website and hides the source of traffic in Google Analytics by showing it as direct traffic.

If you want other website owners to know that you are linking to their sources, simply do not open external links in the new tab.

By doing this,

WordPress will not add the attribute to the links automatically.

Do not mix up nofollow and noreferrer; they are not the same thing.Nofollow prevents search engines from passing link juice to other websites, whereas noreferrer does not.