Links with target='_blank' not opening

Conclusion

• Uncheck Affiliate link in Disqus.
• It is not necessary to add noreferrer or noopener attributes to <a> tags to open external links in a new tab.

Background: Links with target="_blank" not opening

On this blog, I use target="_blank" for external links to open them in a new tab by default.

However, when I published an article to the production environment and viewed it, I encountered a phenomenon where external links would not open correctly. Specifically, in Google Chrome, the address bar displays about:blank, and a blank page opens in a new tab. In Safari, the URL of the original page is displayed in the address bar, and a blank page opens in a new tab.

What’s even stranger is that this behavior is not consistent. For example, sometimes the link opens correctly the first time, but subsequent attempts result in a blank tab. Other times, a blank tab opens from the very first click.

Furthermore, if I right-click and select “Open in new tab” or Command + click, it opens normally.

In summary 👇️

• Clicking a target="_blank" link opens a blank page.
• The value in the new tab’s address bar differs between browsers.
• The timing of when the blank tab opens is inconsistent.
• Open in new tab works fine.

What is this… I want to know the cause…

Cause

While investigating the JavaScript that captures click events, I found that a script from Disqus was involved. Disqus is a service that allows you to add comments to websites and blogs. It seems to have gained popularity from its launch around 2007 to around 2013. Since then, articles about “installing Disqus” are still seen, and I also installed it on this blog, which is built with Hugo. That was in early August 2024.

Disqus has an Affiliate Links feature that automatically replaces external links with affiliate links. It seems they generate revenue from this.

The Disqus Affiliated Links Program

Yesterday, I received an e-mail from a reader of my blog. He told me that he clicked on the XING link on my “About”...

tuhrig.de

When this is enabled, it captures clicks on links within the article with a script and redirects to the affiliate link destination. By disabling this feature, the script is no longer loaded, and external links can now be opened in a new tab normally.

I suspect that the process of redirecting to a link fetched asynchronously after opening a new tab was failing for some reason.

I also considered the story that changing the new tab’s location to the affiliate link with opener was failing because of the noopener attribute, but that would be a fatal bug that would prevent all target="_blank" links from opening, and I don’t think location is the way to change the URL of a new tab from the original tab anyway…

Hmm, I don’t really get it.

Solution

• For now, disable the affiliate link setting in Disqus.

  1. Go to https://<your_disqus_site>.disqus.com/admin/settings/advanced/
  2. Uncheck affiliate links

  

Addendum 2025-09-14

Checking the behavior now,

• With the affiliate link feature enabled
• And a target="_blank" link

I was able to navigate without any problems.

Test page:

What attributes should <a> tags have to open in a new tab?

I took this as a good opportunity to look into it again.

• noreferrer
  • Omits the HTTP Referer header when navigating from page A to page B.
• noopener
  • Sets window.opener to null when navigating from page A to page B.
  • The HTTP Referer header is still sent.
• Setting noreferrer automatically adds the noopener setting.
• You can change the tab of page A to any page C by rewriting it like window.opener.location = "<URL>".
  • An attack using this specification is called Tabnabbing.
• Modern browsers implicitly add noopener-equivalent behavior to target="_blank" tags.
  • 

    Target=_blank implies rel=noopener

    In modern browsers there's no need to define rel="noopener" because it's set automatically.

    www.stefanjudis.com
  • This means window.opener will be null.
• noreferrer completely prevents the referrer from being passed, which can interfere with access analysis.
  • 

    別タブへのリンク記述「target=”_blank”とrel=”noopener noreferrer”」の見直しを - 株式会社真摯

    Webサイトにてリンク先を別タブで開く用途で、a要素へのtarget="_blank"の指定に加えてrel="noopener noreferrer"が指定されていることがあります。 しかし現時点では、リンクを別タブで開く目的にて「targ

    cinci.jp
• The amount of Referer information to include is set with Referrer-Policy.
  • The default is strict-origin-when-cross-origin.

Therefore

• For a simple technical blog, for external links:
  • The noreferrer attribute is not necessary.
  • The noopener attribute does not need to be explicitly stated.

I found out.

Summary

• It seems better to keep the affiliate link feature disabled.
• It is not necessary to add noreferrer and noopener attributes to <a> tags that you want to open in a new tab.

The detailed mechanism of the script embedded by Disqus and the reason why the link opens correctly the first time but results in a blank tab on subsequent attempts are still unclear, but I’m glad to know that noreferrer is no longer necessary.

Actually, ads have started appearing in the Disqus comment section, so I’m thinking of removing it…