When you create links (e.g. a partner link), you shouldn’t just think about how convenient it will be for the user. You also need to think about safety and confidentiality along with SEO. This is particularly concerning for links that open in a new tab.
If no additional security measures are taken, such links can be risky. For example, an attacker may get access to the original page or trace where the user came from for his own malicious purposes.
To protect users and optimize website performance, we recommend you to use the the following attributes:
- noopener that prevents the new tab from controlling the original page. This protects the website from hijacking and unexpected changes.
- noreferrer that hides the referral source that helps prevent the destination site from knowing where the user came from.
HTML Code Example:
<a href=”https://example.com” target=”_blank” rel=”noopener noreferrer”>Go to the website</a>
In the code above, the mentioned attributes serve different functions:
- target=”_blank” is responsible for opening the link in a new tab.
- rel=”noopener” protects the original page from attacks.
- rel=”noreferrer” blocks information transfer about the referrer (i.e., the website the user came from).
In this article, we’ll talk about the differences between these attributes, how they work, why they should be used, and how they impact SEO.
What Are the Differences noopener vs. noreferrer?
Although noopener and noreferrer are often used together within one link, they serve different functions, so it’s important to understand how they work.
The noopener attribute blocks the new tab from accessing the window.opener object. Without this protection, the newly opened page could interact with the original page — potentially modifying its content or even redirecting users elsewhere.
The noreferrer attribute hides the source of the referral. This means the destination site won’t know where the user came from. Additionally, noreferrer automatically includes the noopener functionality that provides extra protection against attacks.
Why Use “noopener noreferrer”?
These attributes help protect your site when links open in a new tab with target=”_blank”. Without them, the new page can manipulate the original one, e.g. attackers might change its content or redirect users to phishing websites.
The noopener attribute blocks this access, keeping your page secure, while noreferrer hides referrer information to protect user privacy and prevent data leaks.
What Happens if You Use These Attributes Incorrectly?
- Inability to track traffic
Using noreferrer causes you to lose referrer information that means that you won’t be able to see which website the user came from. This makes traffic source analysis in Google Analytics difficult.
Example: If you use noreferrer in a link from your blog to a partner site, you won’t know if that the traffic came from your blog.
- Incorrect use with internal links
You don’t need to use noopener and noreferrer for internal links, since it can impact your analytics and SEO. For example, if you add these attributes to internal links, you’ll lose valuable data about how users move between pages on your site, which can affect your SEO. - Loss of referrer data
Using noreferrer can hide data about where traffic is coming from that makes it difficult to analyze traffic sources. This is important if you want to track user behavior.
Example: Clicks from advertising campaigns or social media may become “direct” in analytics, and you won’t be able to accurately determine where the traffic came from.
When should you use rel=”noreferrer noopener”?
While adding the noreferrer and noopener attributes is a good security and privacy measure, the cases when they should be applied depend on the type of links. We will look at the cases when they must be used and when they can be optional.
When the Attributes Must Be Used
- Guest Posts and Partner Links
If you publish guest posts or place partner links, these links often lead to external sites. That’s why it’s important to protect your website from possible attacks adding the attributes into the link. - Links to External Sites Opened in a New Tab
When using a link with the target=”_blank” attribute that opens a page on an external site, you should always use noopener noreferrer. This will prevent attackers from taking control of your page and hide the referrer information.
When the Attributes Are Recommended, But Not Essential
- Internal Links on Your Site
For links that redirect to other pages within your own website, using noopener and noreferrer isn’t required. However, if you want to add extra security and privacy, it’s a good idea to include them. - Links to Trusted Sites Where Manipulation Protection Isn’t Needed
If the link directs to a website you trust or if there is no risk of manipulation (e.g., if it’s not an external source and you’re sure of its safety), using noopener noreferrer is not required. However, for better security, it’s still a good practice to use them.
How it Affects SEO?
The rel=”noopener noreferrer”attributes do not directly impact SEO rankings but can influence analytics and link tracking.
- No Effect on PageRank Transfer: These attributes don’t block link equity transfer. If a link is do-follow, it will still pass SEO value.
- Impact on Referral Traffic Tracking: The noreferrer attribute prevents the destination site from seeing the referrer that causes traffic to appear as “Direct” in Google Analytics instead of “Referral.” This can affect tracking in guest posts and affiliate marketing.
- Internal Links Considerations: It’s not necessary to use these attributes on internal links since it may interfere with tracking user behavior and analytics.
- Security Benefit: The noopener attribute improves the website security by preventing potential attacks. Eventually it indirectly makes the website more reputable and trustworthy.
Conclusion
The use of the rel=”noopener noreferrer” attribute in your links plays an important role in improving security, protecting privacy, and gaining better control over your website’s analytics. This attribute helps protect users from attacks, hide their referral sources, and prevent unwanted changes to your pages.
Despite their clear benefits, it’s essential to use them wisely, considering the context and maintaining a balance between security, analytics, and SEO optimization.
