rel=noopener noreferrer: Security Practice for External Links
Many WordPress users may notice mysterious code snippets appearing in their external links upon examining their site’s HTML. The code “rel=”noopener noreferrer”” frequently appears without any direct action from the site owner, raising questions about its purpose and potential SEO implications.
These automatically added tags are nothing to worry about from an SEO perspective. WordPress implements these attributes on external links in certain circumstances as a standard practice. Search engines fully understand these attributes and they don’t negatively affect how your site is indexed or ranked in search results.
What Is rel="noopener noreferrer"?
The rel="noopener noreferrer" is an HTML attribute specifically designed for external links on your website. This attribute actually consists of two separate components that work independently:
- rel="noopener"
- rel="noreferrer"
These components influence how external websites interact with your site, though each serves a distinct purpose.
When implementing this attribute, it appears in your HTML code as follows:
<a href="https://externalsite.com" target="_blank" rel="noopener noreferrer">
Checking whether your links contain this code is straightforward. You can either open your website’s code editor and use the browser’s “Find” function to search for rel="noopener noreferrer", or view any webpage, right-click, select “Inspect,” and search for the code in the developer console.
The second method proves particularly useful for examining websites you don’t own or manage. This allows developers and site owners to verify proper implementation of security attributes on external links throughout their web pages.
What Is rel="noreferrer"?
The rel=”noreferrer” attribute serves as a privacy mechanism in HTML links, preventing transmission of referrer information when visitors navigate from your site to another. When implemented, this HTML attribute conceals your website as the traffic source in the destination site’s analytics tools.
Normally, when someone clicks a link on your website, the destination site can identify your domain as the traffic source. With rel=”noreferrer” added to your link, this identification is blocked. Instead of appearing as referral traffic in analytics platforms like Google Analytics, these visitors register as direct traffic.
The attribute can be implemented in two ways:
<a href="https://examplesite.com" target="_blank" rel="noreferrer">
Or without opening in a new tab:
<a href="https://examplesite.com" rel="noreferrer">
This hidden referrer information might explain mysterious spikes in direct traffic some website owners notice in their analytics.
When to Use rel=”noreferrer” on External Links
There are several strategic reasons to implement the rel=”noreferrer” attribute on your outbound links:
- Competitor links: When linking to competitors while preferring to keep your referral data private
- Untrusted websites: When linking to sites you don’t fully trust
- Privacy concerns: When you want to maintain user privacy by not sharing traffic source information
Adding this attribute is straightforward—simply include rel=”noreferrer” in your link HTML as shown above. If you’re already opening external links in new tabs, incorporating this code requires minimal additional effort.
What Is rel="noopener"?
The rel=”noopener” attribute serves as a critical security measure for websites that use external links. This HTML attribute helps protect your site from a sophisticated attack vector that targets users through linked pages. When implemented correctly, it prevents malicious websites from gaining access to your page through the window.opener JavaScript property.
Protecting Your Site From Reverse Tabnapping
Reverse tabnapping represents a significant security threat that occurs when links open in new tabs. Without proper protection, attackers can exploit the window.opener relationship to redirect your original page to a fraudulent site designed to steal information.
This attack is particularly dangerous because users often trust pages they’ve already visited. When they return to what they believe is your legitimate site, they may unknowingly provide sensitive information to attackers.
How the attack works:
- User clicks an external link on your site that opens in a new tab
- The new tab's content includes malicious code
- This code uses window.opener to redirect your original page
- When users return to the original tab, they find a phishing site instead
Fortunately, adding rel=”noopener” to external links breaks this connection, preventing the new page from manipulating your original page.
When to Use rel=”noopener” With Internal Links
For links to pages within your own domain, rel=”noopener” is generally unnecessary. Internal links pose minimal security risk since you control both the source and destination pages.
Important considerations:
- WordPress automatically adds rel=”noopener” to external links that open in new tabs
- Manual implementation is necessary on non-WordPress platforms
- The rel=”noreferrer” attribute serves a different purpose and can affect analytics tracking
Remember that internal links don’t require these security attributes because they navigate within your controlled environment. Focus on applying rel=”noopener” to external links, especially those pointing to sites you don’t fully trust or control.
Using rel="noopener noreferrer" in WordPress
WordPress automatically adds security attributes to external links when you set them to open in new tabs. This behavior helps protect your website while maintaining a good user experience. When visitors click these links, they remain on your site while the new content loads separately.
The code difference is significant. A standard external link looks like:
<a href="https://examplesite.com">Example Link</a>
But when you enable the “open in new tab” option, WordPress changes it to:
<a href="https://examplesite.com" target="_blank" rel="noopener noreferrer">Example Link</a>
The target="_blank" instruction opens the new tab, while the rel attributes provide important security benefits. You can verify these attributes by inspecting any external link’s HTML on your published pages.
Can You Remove It?
Removing these attributes is straightforward if you don’t mind links opening in the same tab. Simply uncheck the “open in new tab” option in the WordPress editor, and WordPress will generate a standard link without the additional attributes.
However, removing only part of the code while keeping links opening in new tabs is more challenging. WordPress adds these attributes automatically for security reasons, with no built-in toggle.
You can attempt to manually remove the noreferrer portion through the code editor, which would allow the destination site to see your site as the referrer in their analytics. The process involves:
- Opening the WordPress code editor
- Locating the specific link HTML
- Editing the attributes directly
The noopener attribute, however, is much more difficult to remove permanently. Even after manual deletion, WordPress typically re-adds it when you publish or update the page. This persistence exists because noopener provides critical protection against potential security exploits.
WordPress prioritizes security over complete customization in this case.
For those determined to modify this behavior, advanced solutions involve custom code in your theme or specialized plugins, though this approach isn’t recommended for most users due to security implications.
Most Browsers Now Include Automatic Noopener Protection
As of 2025, the majority of popular web browsers have implemented automatic “noopener” protection for external links, reducing the urgency for manual implementation by developers. This security evolution began with Safari in 2018, setting a precedent for other browsers to follow.
Firefox joined this security initiative in July 2020, adding automatic protection against potential window manipulation attacks. The most significant shift occurred in early 2021, when all Chromium-based browsers—including Chrome, Edge, and Brave—incorporated this feature into their standard security protocols.
Browser Timeline for Automatic Noopener:
- Safari: 2018
- Firefox: July 2020
- Chromium browsers (Chrome, Edge, Brave): Early 2021
This browser-level protection creates an important safety net, preventing malicious sites from manipulating the original page through the window.opener property. Despite this advancement, web developers should continue implementing rel="noopener" manually for two key reasons:
- To protect users of less common browsers
- To maintain defense-in-depth security practices
The small percentage of internet users on alternative browsers remain vulnerable without explicit protection in your code.
Let's Talk Success 🏆
Give us a call today at 1800 840 999 to get started.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.