Posted On: November 14, 2024
If you’ve been in the SEO or website design space for a moment, you may have come across the attribute rel="noopener noreferrer" attached to outbound links.
It looks like this:
<a href="https://www.lennysnewsletter.com/p/what-is-a-good-free-to-paid-conversion" target="_blank" rel="noopener noreferrer">
But what exactly does the attribute do? And, more importantly, how does it impact SEO?
That’s what you will learn in this article! I will show you how these attributes work and how to use them effectively on your site.
The rel="noopener noreferrer" attribute in HTML is in fact, two attributes that control how linked pages interact with your website by blocking certain access and data-sharing capabilities:
Their purpose?
To protect your site’s security and data privacy.
How do you find out if the link has the attribute attached?
You have two options:
1) Using browser tools
In your browser, right-click on the page, select “Inspect,” and use Ctrl+F to search the source code for “noopener noreferrer”. This lets you view the HTML structure of links.
2) In WordPress editor
Open the code editor and search for “noopener noreferrer” to find links that include these tags.
The rel="noreferrer" attribute in HTML has one primary function: to hide referral information from the destination page.
When you apply this tag, it blocks the transfer of the HTML referrer header so that the target website doesn’t know where the user originated. Any traffic from such links will appear as direct traffic rather than referral traffic in Google Analytics.
Use this when you want to reference content from a competitor without alerting them or when linking to an external site you’re unsure about in terms of trustworthiness or privacy.
Bear in mind, though, that if you add this rel attribute to your internal links, you won’t be able to track user paths on your website. For example, to attribute your conversions to a specific landing page or blog post.
The rel="noopener" attribute is an important security measure. It stops the target page from hijacking the referring page.
Let me explain:
When you set your link to open in a new browser tab or window (target=’_blank’), for example, to prevent your visitors from navigating away from your website, it becomes vulnerable to a practice known as reverse tabnapping. That’s when the target page modifies your site, for example, by inserting malicious code or redirecting it to another site.
The tactic is often used in phishing attacks.
The visitor clicks on a link, which opens in a new window. While they’re focusing on the new page, the original is replaced with a phishing site. As they were on the legit site initially, they have no reason to suspect anything untoward and might hand over their login or credit card payments.
The noopener attribute addresses such security vulnerabilities by blocking external sites from accessing the window.opener property.
For any websites with outbound links opening in a new tab, the rel=noopener attribute is a must-have for security. It’s particularly important if you’re linking to external websites that may not have strong security measures.
This doesn’t mean you’re automatically exposed to security risks if you don’t enable them.
That’s because all major browsers, including Safari, Opera, and Google Chrome, add the “noopener” tag implicitly, even if you don’t. They don’t change the website code but act as if the tag was there.
Committed to website security, WordPress automatically adds the “noopener noreferrer” attribute to any external links set to open in a new tab.
In other content management systems or website builders, like Joomla or Wix, you have to add them manually.
Can you remove rel="noopener noreferrer" in WordPress?
Yes. By unchecking the “Open in new tab” box.
However, this can negatively affect the user experience and direct the visitors away from your website. Which often has a negative impact on SEO performance. Google may interpret it as a signal that your page is irrelevant or of poor quality.
The alternative is manually editing the code in the Code editor.
That’s how you can remove the “norefferer” attribute but not the “noopener” one. If you leave the target=’_blank’ attribute attached to the link, WordPress will automatically add it when you hit “Update.”
There might be other ways to remove it, for example, via plugins. But why would you voluntarily compromise the security of your website?
Do the noopener and noreferrer attributes have any impact on your search engine optimization efforts?
The short answer is no.
They are purely about website security and privacy. They don’t prevent search engine crawlers from following links or link juice transfers from the referring site. Consequently, they have no influence on your search engine rankings.
Reportedly, this was once confirmed by Google’s John Mueller on Reddit, but the thread must have been altered since then because I can’t see his comment anymore.
Why the concerns, then?
Rel=”noopener” and rel=”noreferrer” are often mentioned together with the nofollow attribute.
The latter tag signals to search engines that you don’t endorse the target page.
Consequently, such backlinks don’t pass the link equity. As explained, that’s not the case with “noopener” or “noreferrer”.
However, the ‘noreferrer’ attribute can affect your link acquisition efforts indirectly. If the website owner doesn’t know you’re linking to their content, they won’t have a chance to reciprocate with a link to your page.
On the flip side, “noreferrer” doesn’t disrupt the tracking for affiliate programs. That’s because they use unique affiliate IDs rather than referral traffic data to award conversions.
Here’s an example:
https://shortform.com/offer/nischa/?utm_source=nischa&utm_medium= partner
So, affiliate marketers have nothing to worry about.
Contrary to what some might believe, the rel="noopener noreferrer" attributes have no negative impact from the SEO perspective. They protect your website visitors from phishing scams and malicious software and give you control over how your site data is shared.
However, it doesn’t mean that your website's security is compromised if you don’t add them to outgoing links. WordPress adds a “noopener” automatically to links that open in a new tab, while modern browsers have features that imply the tag even if it isn’t there.
