What is Noopener?
Noopener or rel=noopener is an HTML attribute used in the link to instruct the browser not to allow the newly opened browsing context to access the document that opened it.
This attribute is used as a security measure to prevent a malicious website from gaining access to the original website's data, which could include sensitive information such as login credentials or personal data.
By adding rel=noopener to a link, the browser will ensure that the new browsing context cannot access the original website's data.
It looks like this:
<a href="https://yourwebsite.com" target="_blank" rel="noopener">Link Text</a>In this example, the target="_blank" attribute is used to open the link in a new window or tab, and the rel="noopener" attribute is added to prevent the new window or tab from accessing the original browsing context.
Note that it's important to include the rel="noopener" attribute when using target="_blank", as omitting it can potentially introduce security risks.
Why is Noopener important?
The noopener attribute prevents a serious security risk called a "backdoor hack." This is where a linked site takes over the page that links to it.
Hackers can use this backdoor access to redirect visitors to fake phishing or malicious sites. This lets them steal login information, and personal data, and install viruses.
Noopener stops this by making sure the new tab can't access the old one. So even if the linked site is hacked, it can't hurt the page linking to it.
This keeps visitors safe. Without a noopener, a site could get hacked just by linking out. Noopener seals it off, so the linked site can't reach back into the original.
The good news is that since 2017, this attribute has been automatically added to links that open in a new window or tab in WordPress.
However, it's important to note that this attribute should be added to all external links - not just in WordPress - to maximize security.
In addition, starting from 2020, the majority of modern web browsers automatically treat links with "target="_blank" - which opens links in a new tab or window - as if "rel="noopener" is applied to them by default.
Difference Between “noopener”, “nofollow” and “noreferrer”
Noopener, nofollow, and noreferrer are three different HTML attributes that serve different purposes.
Noopener is used for external links to prevent the new browsing context from accessing the original browsing context, which can be a security risk.
Nofollow is used for external links to tell search engines not to follow the link to the target website. This is typically used for sponsored or paid links, or for links to low-quality or untrusted websites.
By using nofollow, website owners can prevent their websites from being associated with low-quality or spammy websites in the eyes of search engines.
Noreferrer is used for external links to prevent the referrer information from being sent to the target website when the link is clicked.
Referrer information is typically sent by the browser and includes the URL of the page that the user was on before clicking the link. This can be important for privacy and security reasons.
Simply put, noopener is used for security purposes to prevent a new targeted website from accessing the original browsing context, nofollow is used for SEO purposes to prevent search engines from following a link to a target website, and noreferrer is used for privacy purposes to prevent the referrer information from being sent to the target website.
Usually, both rel="noopener noreferrer" are used together along with target="_blank" to provide security and privacy protection at the same time while opening the target website in a new window or tab.
Does Noopener impact SEO?
The short answer is no. Search engines like Google do not use noopener as a signal to rank sites.
However, noopener can indirectly help SEO in other ways. It improves website security and the overall user experience, which search engines do value.
When visitors feel more secure on a site and have a smooth hassle-free experience, they engage more. This leads to better click-through rates, time on site, and more pages viewed. Those metrics matter for search ranking.
Do you need to use a noopener on your website?
It is generally recommended to use a noopener on your website for security purposes, particularly when links open in a new window or tab using the target="_blank" attribute.
Without a noopener, those new tabs can access data like cookies and login details from the original site.
That leaves a security hole hackers can exploit to steal sensitive information or spread malware. So links with target="_blank" especially need a noopener to keep website visitors safe.
Noopener closes this security gap. It makes sure new browser windows can't reach back into the parent site's data.
So if the site in the new tab is compromised somehow, it can't touch the original tab's information. Using noopener and target="_blank" together locks things down.
What is rel=”noopener” in WordPress?
WordPress sites automatically add a noopener to external links opening in new tabs/windows. This stops those external pages from getting into the WP site's sensitive data.
Noopener blocks access between sites for security. It protects WP visitors in case an outside link leads to a hacked site trying to steal information.
With noopener added, those new tabs have no way to reach back into the WP site's data at all. WordPress seals it off completely.
Additionally, WordPress has a function letting site owners easily layer on extra attributes as needed - like noreferrer and nofollow. But noopener gets applied by default to lock things down.
Takeaway
Noopener cuts off access between the old tab and the new one for security. This blocks shady sites from reaching into the original website's sensitive data after being clicked.
Without noopener, hacked or malicious pages opened in new tabs could steal passwords or other visitor data from the linking site. So adding a noopener protects visitors and their information.