Noopener

Noopener is a value of the rel="»" HTML attribute. It is automatically or manually added to every outgoing link you add in WordPress. It is often used for and Noopener is used in HTML elements. Its most frequent use (especially in WordPress) occurs in the implementation of elements, such as links or hyperlink anchors.

What is Noopener?

The term "noopener" refers to the HTML attribute rel="noopener", an for safety reasons is added to links that should open in a new browser tab or window.

The purpose of this attribute is to provide an additional level of security for website visitors, in particular by preventing a third-party website you link to from taking control of the browser tab via the window object (the window.opener property).

Why is Noopener important?

Without the rel="noopener" attribute, the linked website could take control of the browser's links tab and redirect it to a phishing page or a malicious website. This could be used to steal personal data or install malware.

This attribute on external links protects website visitors from this backdoor hack. And since it's the SEO Since it will not affect your site at all, you can safely use it to maximize the security of all your users.

Since 2017, this attribute has been automatically added to links that open in a new window or tab in WordPress. However, it should be added to all external links, not just those within WordPress.

The good news is that since 2020, most browsers automatically process links with target_blank (open in new tab/window) as if rel="noopener" were set.

Does Noopener affect SEO?

Some website owners are hesitant to use the "noopener" attribute because they fear it will negatively impact their website's search engine optimization.

The "noopener" attribute, however, has no effect on search engine optimization, neither in terms of crawling nor link flow. The "noopener" attribute operates at the browser level and prevents security vulnerabilities.

Do you need to use Noopener on your website?

If you're using WordPress, you're probably automatically using "noopener". Keep in mind that modern browsers interpret links with target_blank process as if rel="noopener" It is available, but it offers an additional layer of security for your users if they do not have a modern browser.

On the other hand, if you're not using WordPress, it's good practice to manually include "noopener" in links that open in a new tab/window. This protects visitors who might be using older browser versions.

While using "noopener" is certainly a good way to protect users from malicious code, it's still important to carefully consider where you link to first. By linking only to authoritative and trusted websites, you minimize the risk to your users.

But in cases where websites change, are shut down, or sold, today's good links can become malicious tomorrow, and you won't even notice the change. This makes "noopener" an important additional layer of security to ensure your users remain safe regardless of which links they click on your site.

What does the attribute rel="noopener" actually do?

Now that we know what the attribute is... rel="noopener" We explain what it is and what it looks like, and what it does for your links, your website, and the interaction between your site and those you link to.

In short, the attribute is a response to a security vulnerability where websites with malicious code gain partial access to the websites they link to.

The attack only works if the link is opened in a new tab. All new tab links actually grant access to the referring page through a JavaScript feature called window.opener.

As a result, your accidental link to a malicious website actually passes control to a bot or webmaster who intends to edit your site, install malware, or carry out a number of other attacks.

When this threat became prominent, WordPress acted quickly by automatically adding the attribute every time users created links that would open in new tabs. rel="noopener" includes.

Why? Because the attribute rel="noopener" The linked page is prevented from accessing the JavaScript feature window.opener, thus eliminating the risk. Gutenberg also closes the value do not refer This prevents the linked (potentially malicious) page from seeing that your page has linked to it. It thus eliminates a security vulnerability when opening links in new tabs and hides your site information when links are opened in new tabs.

The advantages and disadvantages of Noopener HTML attributes

Many people confuse noopener with nofollow and therefore think that the attribute rel="noopener" It's essential if you want to improve SEO or use affiliate links. However, it won't help with either. It does, however, have several other advantages.

Benefits

• The `noopener` value prevents malicious websites from accessing the JavaScript object `window.opener`. `window.opener` allows partial access to the linked webpage when opened in a new tab, thus helping to eliminate this threat.
• It improves security and also allows you to open links in new tabs, which many users find more convenient.
• WordPress automatically adds the attribute when you create a link that opens in a new tab. This happens whether you're using the Gutenberg editor or the traditional WordPress editor, essentially eliminating any manual work for you.
• You can insert the attribute into the code at any time if you wish.
• It has no impact on SEO, affiliate links, or the performance of your website.

Disadvantages

• It's confusing trying to distinguish between noopener, noreferrer, and nofollow. Some users even add noopener values ​​to all their links, hoping to improve their SEO. But that's a complete waste of time.
• There is a simple way to completely circumvent the window.opener vulnerability: simply open the links in the same tab. Therefore, this value is not really necessary, as the threat can be avoided from the outset.
• Technically, noreferrer already restricts access to window.opener, so many people argue that noopener is redundant.