Bajorat Media
What does the rel="noopener noreferrer" tag mean?
Learn what rel="noopener noreferrer" means, when external links need it and whether it has an effect on SEO.
rel="noopener noreferrer" is a combination of two values in the HTML rel attribute. It is usually used on external links that open in a new browser tab with target="_blank". noopener protects the original page from access through window.opener; noreferrer additionally prevents the destination page from receiving referrer information. For SEO, this combination is normally harmless: it is not the same as nofollow, sponsored or ugc.
Strictly speaking, rel="noopener noreferrer" is not a separate HTML tag. It is a value combination inside the rel attribute of a link. Many people still search for it as a “tag”, which is why the phrase appears in practice.
What does rel=“noopener noreferrer” mean?
The rel attribute describes the relationship between the current page and the linked resource. A typical external link can look like this:
<a href="https://example.com" target="_blank" rel="noopener noreferrer">External source</a>
The two values have different tasks:
| Attribute value | Main task | Practical effect |
|---|---|---|
noopener | separates the new tab from the original page | protects against access through window.opener |
noreferrer | suppresses referrer information | the target page does not receive the source URL |
noopener noreferrer | combines both behaviors | stronger default for security and privacy |
This does not change the visible link text, the destination URL or the fact that users can click the link. It only changes how the browser handles the relationship between the two pages.
Why noopener matters for target=“_blank”
target="_blank" opens a link in a new tab or window. Historically, the newly opened page could use JavaScript to access the page that opened it. That connection runs through the window.opener property.
This can be risky when the destination page is compromised, unknown or not fully trusted. In the worst case, the opened page can try to manipulate the original page or redirect it to another URL. This attack pattern is often discussed under the term reverse tabnabbing.
noopener prevents that connection. The destination page no longer gets a usable reference to the opener page. MDN describes rel="noopener" as a browser instruction to navigate to the target resource without granting the new browsing context access to the document that opened it.
Modern browsers often treat target="_blank" as if noopener were present. Even so, writing the attribute explicitly is still useful: it makes the intention clear in the HTML, covers older or unusual environments better and avoids relying only on browser defaults.
What noreferrer changes in addition
noreferrer goes further than noopener. It tells the browser not to send the Referer HTTP header when the user follows the link. In other words, the destination page should not see the exact URL from which the visitor came. According to MDN on rel="noreferrer", noreferrer also behaves as if noopener were specified.
That can be useful for privacy, but it has practical side effects:
- External websites see less referral data in their analytics.
- Partners, publishers or tool providers may not recognize visits as referrals from the original website.
- Analytics on the original website can still record the click if the local tracking setup captures outbound link events.
The distinction matters: noopener is primarily about security. noreferrer additionally affects referral data. If you want the security benefit but still want the target website to see referral information, noopener alone can be enough. Many websites still use both values together for external links because it is a defensive default.
Does rel=“noopener noreferrer” affect SEO?
rel="noopener noreferrer" is not an SEO link qualification in the sense of link evaluation. It does not tell search engines to ignore, devalue or avoid crawling the linked page. Those jobs belong to other rel values, mainly nofollow, sponsored and ugc.
For search engine optimization, this means:
- A link with
noopener noreferrerremains a normal link unlessnofollow,sponsoredorugcis also present. - The attribute does not block crawling.
- It does not act as a noindex signal.
- Search engines can still read the link target and anchor text from the HTML.
- The missing referrer mainly affects analytics and attribution, not the technical discoverability of the link.
Google’s documentation on qualifying outbound links explains the rel values intended for paid links, user-generated links and links that should not be treated as a normal recommendation. noopener and noreferrer are not part of that SEO qualification group.
Difference from nofollow, sponsored and ugc
The confusion usually happens because all values can appear in the same HTML attribute. Their meaning is still different:
| Value | Area | Typical use |
|---|---|---|
noopener | security | external links with target="_blank" |
noreferrer | privacy and referrer handling | links where the source URL should not be sent |
nofollow | SEO link evaluation | links that should not be treated as a recommendation |
sponsored | SEO link labeling | ads, paid placements and affiliate links |
ugc | SEO link labeling | links in user-generated content such as comments or forum posts |
Several values can be combined. A paid external link that opens in a new tab could use rel="sponsored noopener noreferrer". A normal editorial source link, however, does not need nofollow simply because it is external.
For more context on link evaluation, see the glossary entry What is a nofollow link?. If you want the HTML basics first, What is an HTML tag? is a useful starting point.
When should website owners use it?
As a practical rule, external links that open in a new tab should have at least rel="noopener". If the destination should not receive referrer information, or if the website follows a strict privacy-first default for outbound links, noreferrer can be added.
rel="noopener noreferrer" is especially useful for:
- external source links in blog and FAQ content,
- links to documentation, tools, downloads or third-party services,
- external buttons that open in a new tab,
- user-generated or editorially less controlled link targets,
- older CMS templates where
target="_blank"may have been added manually over time.
For internal links, opening a new tab is usually unnecessary. Internal navigation should normally stay in the same tab so users can follow a consistent website journey. In professional web design and concept work, link behavior is therefore part of the user experience, not just a technical detail. In search engine optimization, internal and external links should also be evaluated by context and intent rather than treated as ranking switches.
Practical recommendations
The best approach is to define link handling in the template, component or content renderer. Editors should not have to manually remember security attributes for every external link.
For each link type, decide separately:
- Does the link open in a new tab? Then
noopeneris useful. - Should the target page not receive referrer information? Then
noreferrerfits. - Is the link paid, promotional or affiliate-based? Then
sponsoredis relevant. - Does the link come from user-generated content? Then
ugcmay be appropriate. - Should the link not be treated as an editorial recommendation? Then
nofollowcan be considered.
In short: rel="noopener noreferrer" improves security and privacy for external links, but it is not a negative SEO signal. It should be part of a broader link standard that also covers meaningful anchor text, clear internal links and correct handling of paid or user-generated links.