Safe External Links: target="_blank" and rel="noopener"
Opening another site in a new tab is common: partner logos, social profiles, sources in an
article. The target="_blank" attribute does that. Without rel="noopener", the new tab gets a
handle back to your page through window.opener.
Why it matters
Reverse tabnabbing. A page opened this way can run window.opener.location = '…' and quietly
replace your tab with a look-alike login page. The visitor comes back to what looks like your site
and types a password. Modern browsers now treat target="_blank" as noopener by default, but
older browsers and some in-app browsers don’t.
Performance. Without noopener, the new page may share a process with yours, so a heavy
external page can slow your tab down.
Privacy. rel="noreferrer" also removes the referrer, so the other site doesn’t see which of
your pages the visitor came from. It implies noopener.
What we check
We list links on the page that point to another site, open in a new tab (target="_blank") and
have neither noopener nor noreferrer in their rel attribute. Links to your own site are left
out.
How to fix it
Add rel="noopener" to those links:
<a href="https://partner.example/" target="_blank" rel="noopener">Our partner</a>
Use rel="noopener noreferrer" when you don’t want to pass the referrer. If the link is also
paid or user-generated, combine the values: rel="noopener sponsored" or rel="noopener ugc".
Where to change it:
- WordPress: the block editor adds
rel="noopener"when you tick “Open in new tab”. Older posts, widgets and theme files may not have it; edit them or use a filter in your theme. - Shopify, Wix, Squarespace: check custom HTML blocks and theme code; the built-in link options usually add it.
- React and other frameworks: add
rel="noopener"wherever you settarget="_blank"; lint rules such asreact/jsx-no-target-blankcatch new ones.
Related checks
- Links on the page are followed and Descriptive link text look at the same links from a search engine’s side.