I do find a lot of worried faces out there about the rel = noopener noreferrer tag. When you open a link in new tab, then the noopener or noreferrer attribute will be added to your links.
In this article, you will understand what is rel=”noopener noreferrer” and how it will affect your website SEO ranking factors.
Definition of rel = noopener noreferrer
When you insert a link in the webpage content, the code will look like this:
target=”_blank” alert the browser to open the link in a new tab and your website page will remain open in its own tab.
The rel attribute of anchor tag specifies the relationship between the current document/web page and the linked web page/document.
The rel noopener attribute is applicable when a link is selected to open in a new browser tab. The same attribute quality can also be achieved with a rel noreferrer.
This property was introduced in an anchor tag to address security aspects which can be exploited by malicious websites. With the help of JavaScript features, we can allow a new tab to be controlled by its referring window.
When you linked to an external website which might be affected by the malicious code, then that website can make use of the window.opener JavaScript property to steal digital information of your audience by running on the same process of your page.
So by adding rel noopener or rel noreferrer to the link will prevent the new tab from taking advantage of the JavaScript window.opener feature.
When you use target=”_blank” for external site link in your web page content, then always include rel=”noopener” or rel=”noreferrer” attribute.
- rel=”noopener” attribute protects the new page to be accessed by the window.opener property and make sure it runs in a separate process.
- rel=”noreferrer” attribute has a similar quality, but it also prevents passing on the referrer information to the new page.
How rel=”noopener noreferrer” influence your website?
The anchor tag rel=”noopener” or rel=”noreferrer” attribute improves the website security, but some people want to ignore it because they think it will affect their website search engine optimization.
It is just a myth.
It has no effect on the website SEO ranking or the overall performance of your website. In fact, it protects the confidentiality of your website audience and prevents external website by spreading malicious code.
Most of the people come across rel noopener noreferrer link while building backlinks and start wondering does this link passes page rank or not?
The search engines and analytics tools don’t interact with the rel=”noopener” tag. It states an instruction for the browser to stop the use of the window.opener Javascript object and create a new thread for processing.
Difference between rel=noopener and rel=nofollow
Most people associate noopener with nofollow, but they are completely separate.
Cross-site hacking will be prevented from noopener attribute and also it improves your website security. Search Engines do not consider noopener or noreferrer as On-Site SEO ranking signal.
SEO link juice of your web page will not be passed to the linked website when your add nofollow attribute. The link with nofollow relationship will not be taking into consideration by search engine crawlers.
Will noopener & noreferrer tags Affect Affiliate Links?
Although, “noreferrer” tag prevented the link from knowing where it actually came from but it does not affect the affiliate programs links.
Most of the affiliate links contain a unique URL which will be having your unique affiliate ID. When someone clicks the link then your affiliate ID is passed with the URL parameter for the other website to track.
Majority of affiliate marketers make use of link cloaking technique for their affiliate links. Cloaking strategy ensures that the affiliate link is actually your own website URL which will redirects users to the destination URL.
- Do not open the link in a new tab:
The quickest way is by not have your affiliate links open in new tabs. Although people will leave your page if you are worried about the potential damage on your earnings then it is the best way to get back on track.
- Remove the noreferrer noopener tag:
Whether you want to have these tags in your link attribute are totally up to you. We do not recommend to remove rel=”noopener” since it does open up the risk of the vulnerability of your website.
How to Remove rel=noopener in WordPress?
Removing noopener noreferrer attribute can be a bit hard as it is integrated into the text editor source code. When you remove it from the HTML code, it will be added back again when you will save or update the document.
So your best bet is to add the following code at the bottom of your WordPress theme’s functions.php file.
add_filter(‘tiny_mce_before_init’,’wpb_disable_noopener’);
function wpb_disable_noopener( $mceInit ) {
$mceInit[‘allow_unsafe_link_target’]=true;
return $mceInit;
}
This will stop automatically adding rel=”noopener” attribute in your links. However, it will not remove already existing tags, so you will have to manually remove them from your post HTML code.
Wrapping Up
I hope this article helped you learn about noopener & noreferrer tags. There is no need to be worried about rel noopener and rel noreferrer tag as it merely protects your audience from potential malicious links that could hijack their tabs.
This tag attribute is automatically added to all internal and external links when you make them open in a new browser window.
I believe you will only want to remove this tag attribute when you want to take advantage of the JavaScript window.opener feature.
If you think I missed any topic related to rel=”noopener noreferrer” or if you have any questions regarding this article, then feel free to down a message in the comment section below.