Noopener

Definition

The noopener value is used in the rel attribute of a link or a HTML tag to indicate that a link should not have access to the current browsing context[1]. This can be useful for security purposes, as it can prevent certain types of cross-site scripting (XSS) attacks.

Example

Here's an example of how the noopener value would be used in an <a> tag:

<a href="https://example.com" rel="noopener">Click here</a>

The noopener value is often used in conjunction with the noreferrer value, which prevents the referer header from being sent when a user clicks on the link. Here's an example of how both values would be used in an a tag:

<a href="https://example.com" rel="noopener noreferrer">Click here</a>

By using the noopener and noreferrer values, you can help protect your site and your users from certain types of XSS attacks. It's important to note that these values do not provide complete protection against all types of XSS attacks, and other measures should also be taken to secure your site.

Difference between noopener and nofollow

The noopener value and the nofollow value are both used in the rel attribute of a link or an HTML tag, but they have different purposes:

Noopener: The noopener value is used to indicate that a link should not have access to the current browsing context. This can be useful for security purposes, as it can prevent certain types of cross-site scripting (XSS) attacks.

Nofollow: The nofollow value is used to indicate that a link should not be followed by search engines[2]. When a search engine encounters a link with the nofollow value, it will not follow the link and will not pass any "link equity" (a measure of the value that a link passes to the linked website) to the linked website.

The noopener value is typically used to improve security, while the nofollow value is typically used to control the flow of link equity and to prevent search engines from following links that may not be trustworthy or relevant.

It's important to note that while the noopener and nofollow values can be useful for certain purposes, they are just one aspect of search engine optimization. To maximize your search rankings, you should also focus on other factors, such as creating high-quality content, building high-quality backlinks, and having a mobile-friendly design.

Related links

Links to cross-origin destinations are unsafe - Chrome Developers