Before we move on, I want to expand (just a little) on the noopener attribute value. Many people confuse it with the nofollow tag, concerned that they might downgrade their SEO benefits of link-building and prevent PageRank from transitioning between linked pages.

But as you’ll see, noopener has nothing to do with nofollow.

Firstly, rel=”noopener” used to only be available on <a> and <area> elements. The good news it that it’s now added to the <form> element.

Why is the rel=”noopener” property important?

There are some JavaScript features that allow a new tab to get control of its referring window.

This can cause security issues.

For example, if you link to an external website affected by malicious code, then that website can use the window.opener JavaScript property to change the original page (your website) to steal information and spread malicious code.

Adding rel=”noopener” prevents the new tab from taking advantage of this JavaScript feature.

This is why the noopener attribute was added to forms. It allows you to disable the JavaScript window.opener property. This is how you write it: 

<form action="/action_page.js" method="GET" target="_blank" rel=”noopener”>

BOTTOM LINE: don’t confuse rel=”noopener” with rel=“noreferrer”

When a user moves from URL X to URL Y, the owner of URL Y receives information about their previous web location. It is easy to identify the sources of incoming traffic by viewing a special report in Google Analytics.

But the webmaster of URL X may not want the webmaster of URL Y to know that visitors are coming from their platform. To conceal this information, they can embed the noreferrer clause in the link’s HTML.

With this clause in place, the owner of URL Y will not be able to tell where traffic is coming from, since it will be displayed as Direct traffic rather than Referral traffic in Google Analytics.

Got it? 

Great. Let's march on.