In the previous article, we’ve discussed what link juice is.
However, there’s more to links than being “nofollow” or “dofollow”.
Besides those two, the most common rel attributes you’ll see are noopener noreferrer.
In this article, we’ll demystify what rel=”noopener noreferrer” means, how it affects external links, and whether it has any impact on your SEO.
Key Takeaways
- “rel=noopener” and “rel=noreferrer” are HTML link attributes that improve security and privacy
- These rel tags do not directly impact SEO or search engine rankings
- “rel=noopener” prevents the linked page from accessing your site’s window object
- “rel=noreferrer” hides referrer data and adds an extra layer of security
- Unlike “nofollow,” these tags are not used to control link equity or search engine behavior
- Using these attributes helps create a safer browsing experience for users
Link building cheat sheet
What are Rel Tags?
Rel tags are attributes used in HTML to specify the relationship between the current document and the linked document or resource. Found within “<a>”, “<link>”, and “<area>” tags, these attributes serve multiple purposes.
Rel tags are used within a link to define how that link should behave for search engines, browsers, and users.
Primarily, they help search engines understand the nature of links and how link equity should be handled.
They are especially important for external links, affiliate links, and any link that opens in a new tab.
For example, the `rel=canonical` tag helps identify the original source of content, thus preventing duplicate content issues.
Additionally, rel tags enhance security.
Tags like `rel=noopener` and `rel=noreferrer` prevent potential security risks by ensuring that the linked page cannot access the originating page’s window object or HTTP referrer information.
Rel tags also contribute to improving the user experience and site performance.
Tags such as “rel=dns-prefetch” and “rel=modulepreload” enable prefetching and preloading of resources, which can speed up page load times.
Furthermore, they facilitate navigation by guiding users through series or paginated content, such as with “rel=next” and “rel=prev”.
In summary, rel tags help optimize search engine visibility, enhance security, improve performance, and ensure a better user experience.
Here is the list of top 15 most used rel tags:
- alternate: Specifies an alternate version of the document, such as a different language or format.
- author: Points to the author’s webpage for the document.
- bookmark: Marks a permalink that other applications can bookmark.
- canonical: Indicates the “canonical” URL of a document, helping to avoid duplicate content issues.
- dns-prefetch: Instructs the browser to prefetch the DNS for the specified domain, improving performance.
- external: Indicates an external resource.
- help: Links to a help document.
- icon: Specifies an icon for the document, commonly used for website favicons.
- license: Points to the license of the linked document.
- manifest: Points to the web app manifest, necessary for Progressive Web Apps.
- modulepreload: Preloads JavaScript modules in advance to speed up execution.
- next: Indicates that the next document in a series is linked.
- nofollow: Instructs search engines not to follow the link.
- noopener: Prevents the new page from being able to access the `
- noreferrer: Prevents the browser from sending the HTTP referrer header, adding a layer of privacy.
What is “rel=noopener”?
The rel=”noopener” attribute is an HTML attribute used within anchor tags to improve security when opening a link in a new tab or new window.
Specifically, it prevents the newly opened page from being able to access or manipulate the originating page’s “window” object via JavaScript.
Without the noopener attribute, the new page can access the original page through the window.opener property, which creates a potential security vulnerability.
It is most commonly used alongside target=”_blank” (also called target blank).
When a link uses “target=”_blank” to open in a new tab or window, the new page can potentially exploit the inherited “window.opener” property to redirect the original page to a malicious site or perform other harmful actions.
By adding “rel=noopener”, you close this security loophole, ensuring that the newly opened page operates in isolation from the originating page.
This is why rel noopener is considered a best practice in web development.
What is “rel=noreferrer”?
The rel=”noreferrer” attribute is another HTML attribute that improves both security and user privacy when linking to an external site.
It prevents referrer information from being passed to the destination website. This means the external website will not receive referral data about where the traffic came from.
When a link includes “rel=noreferrer”, the browser refrains from sending the HTTP referrer header to the destination site. This prevents the destination site from knowing which page the user came from, thereby protecting the privacy of the originating page.
Additionally, “rel=noreferrer” has a security benefit similar to “rel=noopener”; it prevents the newly opened page from accessing the originating page’s “window” object.
This prevents the destination site from knowing which page the user came from, protecting user privacy and limiting access to analytics data such as Google Analytics referral tracking.
Because of this, traffic from such links may appear as direct traffic instead of referral traffic.
In essence, “rel=noreferrer” is used to safeguard user privacy by not sharing referrer information and to enhance security by isolating the new page from the context of the originating page.
In many cases, both attributes are used together as rel=”noopener noreferrer” or relnoopener noreferrer, especially when working with external links that open in a new tab.
This combination ensures both security and privacy while maintaining safe behavior across modern browsers and older browsers.
Is “noopener” the same as “nofolow”?
No, “rel=noopener” and “rel=nofollow” are not the same and serve different purposes.
`rel=noopener` is primarily used for security.
The nofollow attribute is part of SEO and link building, while noopener and noreferrer are focused on browser security.
When a link with “rel=noopener” is opened in a new tab (“target=”_blank”), it prevents the new page from accessing the originating page’s “window” object. This reduces the risk of certain types of security vulnerabilities, such as cross-site scripting (XSS) attacks.
“rel=nofollow” is used for SEO purposes.
When added to a link, nofollow instructs search engines not to pass link equity to the linked page.
This can help in managing the distribution of ranking authority and in reducing spammy link practices.In short, `rel=noopener` is about improving security, while `rel=nofollow` deals with how search engines should treat the link for ranking purposes.
Does it Affect SEO?
The rel=”noopener noreferrer” attributes do not directly impact search engine rankings or how search engines treat links.
They do not affect link equity, crawling, or indexing like the nofollow attribute does. However, they still play an indirect role by improving website security and maintaining trust signals for search engines.
Both attributes are best used to protect user data and enhance the security of web interactions. Their primary benefits lie in safeguarding privacy and preventing potential security vulnerabilities, without influencing search engine optimization directly.
However, security is one of the most important search engine factors, and by ensuring it on your site, you’ll be one step closer to the #1 spot.
It’s important to note that these attributes are mainly used for external links.
For internal links, they are generally unnecessary, since both pages belong to the same website.
Link building cheat sheet
Now Over to You
In summary, noopener noreferrer attributes do not directly affect SEO or link equity.
However, they play an important role in improving security, protecting user privacy, and ensuring safe behavior when linking to external websites.
While attributes like nofollow impact search engine behavior, noopener and noreferrer are focused on making your website safer and more reliable.
If you want to improve your SEO beyond technical attributes, link building is what actually moves the needle.Our done-for-you link building helps you secure high-quality placements on relevant websites, improving your rankings, traffic, and overall visibility without handling outreach yourself.
Frequently Asked Questions (FAQ)
What is the main difference between “rel=noopener” and “rel=noreferrer”?
“rel=noopener” focuses solely on security by preventing the new page from accessing the originating page’s “window” object while noreferrer also hides referrer information and impacts analytics tracking.
Do “rel=noopener” and “rel=noreferrer” affect how search engines crawl links?
They do not influence how search engines process external links or internal links.
These attributes are designed to enhance security and privacy, not to influence search engine behavior.
Can I use “rel=noopener” and “rel=noreferrer” together?
Yes, you can use both together in a link like this:
<a href=”example.com” target=”_blank” rel=”noopener noreferrer”>
This combination ensures both security and privacy by preventing the linked page from accessing the originating page’s window object and stopping the referrer header from being sent.
Is “rel=noopener” necessary if I’m not using “target=”_blank”`?
No, “rel=noopener” is specifically meant for links that open in a new tab or window using “target=”_blank”. If you are not using “target=”_blank”, there is no need to use “rel=noopener”.
Will using “rel=noreferrer” affect tracking analytics on the destination site?
Yes, using the noreferrer attribute will affect analytics because it removes referral data.
As a result, traffic from these links may show as direct traffic instead of referral traffic in tools like Google Analytics.
