Html Rel Noopener Noreferrer

What is Html rel “noopener noreferrer”?

The HTML attributes rel=“noopener noreferrer” should appear in external hyperlinks. It prevents an external link from taking control of your user’s originating browser window.

The HTML attributes rel=“noopener noreferrer” attributes prevents:

• the external target link loading into the same tab where the link was clicked.
• the backlink from appearing as referral traffic in the destination site’s analytics

Example rel=“noopener noreferrer”

    <a href="https://www.bing.com/" target="_blank" rel="noopener noreferrer">

noopener MDN reference

noopener

In the past, leaving target=”_blank” alone in your link opened up this security vulnerability. HTML attributes rel=“noopener noreferrer” is largely a security measure to prevent malicious links from gaining access to a user’s browser (a phishing attack known as tabnabbing).

noreferrer

Essentially, noreferrer keeps external sites from knowing that you have included links to their material on your website. This could be important to you for privacy or security reasons. The noreferrer attribute masks your referral links in destination analytics. It protects your site’s information from being transferred to the website your users are navigating to. As a result, this causes the links to appear as Direct traffic in Google Analytics, rather than Referral traffic from your specific domain.