Opening links in a new tab with target="_blank" is common, but it historically came with a security weakness. The rel values noopener and noreferrer exist to close it, and they are often confused with nofollow. This guide separates them clearly.
We explain what the rel attribute and target="_blank" are, what noopener, window.opener and reverse tabnabbing mean, what noreferrer and the referrer are, how the two differ from each other and from nofollow, their effects on SEO and analytics, when to use each, internal links, WordPress and Elementor, HTML and JavaScript examples, the downsides and how to check them.
What Is the rel Attribute?
An HTML attribute describing the relationship between the current page and the linked one. See what is HTML rel.
What Is target=“_blank”?
An attribute that makes a link open in a new tab or window.
What Is noopener?
A rel value that stops the newly opened page from accessing the page that opened it.
What Is window.opener?
A JavaScript reference that a page opened with a link can use to access and even navigate the page that opened it.
What Is Reverse Tabnabbing?
An attack in which the newly opened page uses window.opener to silently redirect the original tab to a fake page, for example a phishing login screen. noopener prevents it.
What Is noreferrer?
A rel value that stops the browser from sending referrer information to the linked site (and also implies noopener behavior).
What Is the Referrer?
The information telling the destination site which page the visitor came from.
noopener vs. noreferrer
| noopener | noreferrer | |
|---|---|---|
| Purpose | Security | Privacy / hiding the source |
| Blocks window.opener | Yes | Yes |
| Hides the referrer | No | Yes |
noopener, noreferrer and nofollow
- noopener / noreferrer: browser behavior.
- nofollow: how search engines treat the link.
They are independent and can be combined.
Does noreferrer Mean nofollow?
No.
Does noopener Affect SEO?
No. It is a security feature and doesn’t make a link nofollow.
Does noreferrer Affect SEO?
Not directly.
Does noreferrer Affect Google Analytics Data?
It can: the destination site may see the visit as direct traffic instead of referral traffic. See Google Analytics.
When to Use noopener
On any link with target="_blank". Modern browsers apply it by default, but it’s still common to state it.
When to Use noreferrer
When you don’t want to reveal the source page to the destination site.
Should They Be Used Together?
Often yes: rel="noopener noreferrer".
| Scenario | Suggested rel |
|---|---|
| New tab to a trusted site | noopener |
| New tab, hide the source | noopener noreferrer |
| New tab, don’t endorse | noopener nofollow |
| Paid link | noopener sponsored |
| User content link | noopener ugc nofollow |
Are They Needed on Internal Links?
Not for security, since you trust your own site. See anchor text.
Should External Links Open in a New Tab?
Only when it helps the user.
How to Add Them in WordPress
- Block editor: the link settings let you open in a new tab; WordPress usually adds
noopenerautomatically. - Classic editor: use the link dialog.
- Why WordPress adds rel automatically: to protect users when links open in a new tab.
- Elementor: the link options offer “open in new tab” and custom attributes.
See what is WordPress.
HTML Examples
<a href="https://example.com" target="_blank" rel="noopener">Only noopener</a>
<a href="https://example.com" target="_blank" rel="noopener noreferrer">Noopener and noreferrer</a>
<a href="https://example.com" target="_blank" rel="noopener nofollow">Noopener and nofollow</a>
<a href="https://example.com" target="_blank" rel="noopener sponsored">Sponsored link</a>
<a href="https://example.com" target="_blank" rel="noopener ugc nofollow">User content link</a>Using noopener with JavaScript window.open
window.open('https://example.com', '_blank', 'noopener');Downsides of noreferrer
- Referral traffic can disappear from reports.
- Affiliate reports can be affected.
- Analytics data can be distorted.
- Referrer-based systems may fail.
- Source verification gets harder.
Does noopener Have Downsides?
Rarely. You lose the ability for the new page to control the opener, which you seldom want.
noopener vs. Referrer-Policy
Referrer-Policy is a broader setting that controls how much referrer information is sent, per page or per link; noreferrer is the blunt, link-level version.
How to Check Them
- View the page source.
- Use developer tools.
- Test window.opener.
- Check the referrer header.
- Crawl the site, for example with Screaming Frog.
Common Mistakes
- Confusing noreferrer with nofollow: noreferrer removes referrer info; nofollow tells search engines about the link relationship.
- Adding noreferrer to every external link: it can make all referral traffic lose its source.
- Thinking noopener hurts SEO.
- Adding noopener without target=“_blank”: if the link opens in the same tab, there is no opener relationship.
- Using only noopener on a paid link: noopener doesn’t mark a link as commercial; use
sponsored. - Not checking analytics after adding noreferrer.
- Repeating the same rel value:
rel="noopener noopener noreferrer"is redundant. - Not telling users a link opens in a new tab.
- Opening unnecessary windows with JavaScript:
window.open()where a normal link would do can cause accessibility and pop-up blocker problems.
Related: what is SEO, Google Tag Manager, technical SEO and our SEO consulting.
Frequently Asked Questions
What does noopener do?
It stops a page opened in a new tab from accessing the opening page through window.opener.
What does noreferrer do?
It stops the browser from sending the referrer to the destination site.
Are noopener and noreferrer used together?
Often, as rel="noopener noreferrer".
Is noreferrer the same as nofollow?
No.
Do they affect SEO?
Not directly.
Are they needed without target=“_blank”?
Usually not.
