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 valueMain taskPractical effect
noopenerseparates the new tab from the original pageprotects against access through window.opener
noreferrersuppresses referrer informationthe target page does not receive the source URL
noopener noreferrercombines both behaviorsstronger 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 noreferrer remains a normal link unless nofollow, sponsored or ugc is 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:

ValueAreaTypical use
noopenersecurityexternal links with target="_blank"
noreferrerprivacy and referrer handlinglinks where the source URL should not be sent
nofollowSEO link evaluationlinks that should not be treated as a recommendation
sponsoredSEO link labelingads, paid placements and affiliate links
ugcSEO link labelinglinks 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 noopener is useful.
  • Should the target page not receive referrer information? Then noreferrer fits.
  • Is the link paid, promotional or affiliate-based? Then sponsored is relevant.
  • Does the link come from user-generated content? Then ugc may be appropriate.
  • Should the link not be treated as an editorial recommendation? Then nofollow can 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.

Discuss a project

Do you want to apply this topic to your project?

We help you decide which technical, editorial or strategic steps make sense for your website - and what truly has priority.