HTML attributes that begin with “no” aren’t always what you want affiliated with your posts. But in the case of the rel = “noreferrer noopener,” these are necessary for increasing your site’s security.
This article breaks down the codes, why you want them attached to your links, and how they impact your SEO ranking.
Defining the Code
Each of these attributes has a unique job. You need the results of both of the tags to optimize your website’s online presence in Google.
The rel = noreferrer tag’s job takes out the referring source. The information from the referrer is taken out of the HTTP header so that Google’s analytics see the traffic as a direct source.
When this happens, the links with the rel = noreferrer tag (<a>) fall into the category of Direct Traffic, not Referrals.
Breaking it down a little more:
Rel is the tag that shows how the current page and the linked page are related.
Noreferrer is exactly what it sounds like. The code is telling Google’s analytics that the site is directly linked to yours, with no referring third party in the middle.
Noopener is for your security. It tells the browser to open the link in a new tab. This can be used without the Noreferrer, but you get the same results with the rel = noreferrer noopener attribute.
When you link a noreferrer tag, it shows up like this in the HTTP header:
<a href=”https://www.targetsite.com” rel=”noreferrer”>Link to Targetsite.com</a>
These attributes are used when you’ve got an outgoing link but don’t want the source link to know you’ve used it. Note that they are only used on outgoing links.
The rel = no referrer attribute on an anchor tab increases the security level, particularly with JavaScript. Java has a window.opener feature that lets the newly opened tab be controlled by its linking counterpart. This is great in theory but leaves the site open for more security breaches.
Using the noreferrer link prevents these breaches. If you link your Site A to Site B and B is infected with a malicious code, dropping the referrer aspect ensures that that code can’t then infect Site A and all of your audience.
Whatever your external target link is, be sure you add the rel = noreferrer noopener or noopener attribute.
So, in a nutshell:
- rel = “noopener” keeps your new page from being a victim of malicious codes taken advantage of by the window.opener JavaScript feature by ensuring the processes are separated, and
- rel = “noreferrer noopener” also separates the process but then stops the referrer information from being sourced to the new page, making your links directly correlated
SEO and These Attributes
When you use the “noreferrer” tag, there’s no direct impact on your SEO. But there will be indirect results over time.
It’s a gradual process that improves your link building. When a webmaster sees your page on their Google analytics, the typical course of action is to reciprocate. They may link back to your site, follow you, or share your content.
This effect is what does impact your SEO rankings. When your site is secure because you used the rel noopener noreferrer tag, you become a valid source of information to others. You’re protecting your audience and reducing the spread of malicious code through your links.
But some site builders confuse these tags with the rel=nofollow tag, which does impact your SEO directly.
Nofollow vs Noopener
When you use a rel=noopener, you’re preventing hacking from crossing from one site to another. This is purely for security reasons, not for SEO ranking.
Choosing to add the “nofollow” to your external links means that you are telling the search engines to not pass a PageRank between sites. SEO optimization includes linking to other pages, so using this tag can have an impact on your SEO.
In a “noreferrer” linking, the link is followed by the referral information isn’t passed on to the new browser.
With the “nofollow” tag, your site’s info isn’t passed on to the website you’re linking to. Since it’s not creating a relationship with another site, it’s ignored by the search engine crawlers.
So when would you use which tags?
They’re pretty self-explanatory: Use “nofollow” on sites you don’t trust. You don’t want them following you in the background. Use “noreferrer” on sites if you want to lowkey use their links without them knowing.
Affiliate Linking with rel = noreferrer and noopener Tags
Adding the “noreferrer” tag prevents the source link from knowing where the new link came from. But it doesn’t change the affiliate programs associated.
This is because the affiliate links usually have a URL that is connected to your own personal affiliate ID. When your link is used, it passes the affiliate ID and all of its parameters back to the other website.
It’s common for affiliate marketers to use a link cloaking technique, where your website URL masks the actual target URL. Clicking on your link redirects users to the actual destination link.
Following Up on Your Noreferrer Tags
If you’re still not sold on using these tags on your links, follow your ratings for a short time. You shouldn’t see an SEO drop, but if you do, try these action steps:
1. Undo the “open in a new tab” tag. When you don’t have your affiliate links open in a new tab, you are ensuring that all of the earnings from your links go directly to you.
2. Change the link tag. For security purposes, you should keep the rel = noopener tag. This, as explained above, prevents the window.opener in JavaScript from cross-site scripting. But you can remove the “noreferrer no opener” tag.
Doing this in WordPress isn’t that easy. Once it’s integrated into the source code, that’s where it wants to stay. Every time you remove it from the HTML code, it’s just going to come right back.
Instead of changing the code, you’re best off negating it by adding a new code into the functions.php file of your theme.
This code:
add_filter(‘tiny_mce_before_init’,’wpb_disable_noopener’); function wpb_disable_noopener( $mceInit ) {
$mceInit[‘allow_unsafe_link_target’]=true; return $mceInit;}
tells the site to stop adding the tag attribute in your links in the future. Once you’ve put this in your site, you can go back and manually remove the tags from any preexisting content.
To Use or Not Use?
It’s not going to have a significant effect on your SEO right away. It’s not going to ramp up your traffic. But the noopener and noreferrer tags are going to significantly impact the security of your links, and that is something that is invaluable.