Master SEO vocabulary with all essential terms and meanings here.

Noopener Noreferrer

Last updated: Aug 07, 2024

https://cmlabs.co/en-id/seo-terms/noopener-noreferrer

Link copied!

Crafting secure and user-friendly web experiences requires meticulous attention to detail. In this realm, understanding the attributes noopener noreferrer becomes crucial.

Let's explore what does noopener noreferrer means, its impact on SEO, and the difference between Noopener, Noreferrer, and Nofollow in this article.

What is Noopener Noreferrer?

If you are a WordPress user, do you know what noopener noreferrer is? Basically, this attribute serves to direct the user to a new tab with a secure connection that is maintained. The following is a more complete explanation.

Noopener

Noopener is an HTML attribute that serves as a security measure to prevent malicious links from gaining access to a user's device. This crime is generally referred to as phishing or tabnabbing. Using the target="_blank" attribute alone without noopener can increase the risk of cybercrime.

As a best practice, now you can use the attribute with target="_blank" to be like this:

<a href=”https://namadomainwebsite.com” target=”_blank” rel=”noreferrer noopener”>

cmlabs

Noreferrer

The rel="noreferrer" tag is a special HTML attribute that can be added to the link (<a>) tag. This attribute prevents passing referrer information to the target website by removing the referrer information from the HTTP header.

This means that in Google Analytics, traffic coming from links that have the rel="noreferrer" attribute will be shown as direct traffic, not referral traffic.

You can see an example of the noreferrer attribute below:

<a href="https://www.example.com" rel="noreferrer">Link to Example.com</a>

cmlabs

When to Use Noreferrer Noopener

As a website owner, of course you want a high-security system that makes users feel safe and comfortable. You will not, however, always use rel="noopener noreferrer" if you want to build and implement a good backlink strategy. To install internal links on a website, you don't need to use this attribute.

This is because this attribute will work well on external links that have the potential to pose a security risk to your website and its users.

Using rel="noopener noreferrer" can tell Google that you care about the security of every link attached to the website.

The Impact of Using Noopener Noreferrer in SEO

Adding the tag to your website links has no direct impacts on SEO. The use of this attribute has an indirect effect, which can actually be beneficial for your website.

One way to get the attention of other webmasters is to include a link to their site. All webmasters check their Google Analytics daily, especially referral traffic.

When they see traffic from a website, they will most likely check it out and share the page on social media, or even decide to provide feedback by building backlinks that point to your website.

In fact, Google recommends using the attribute as a viable option for obtaining backlinks from other websites.

The Difference Between Noopener, Noreferrer, and Nofollow

When you add rel="nofollow" to an external link, you are in effect instructing search engines not to pass any PageRank from one page to another. In other words, you're telling search engines to ignore the link.

The difference between nofollow and noreferrer is that a noreferrer does not pass any referral information to the browser, but the links are followed. While nofollow is active, the referral information will be passed to the browser, but the link is not followed.

So noopener, noreferrer, and nofollow are not the same attribute. Use nofollow on suspicious links. On the other hand, use the noreferrer attribute if you don't want other sites to see a link to your website.