Avoid Using Target Blank If You Can

target="_blank" is an a tag attribute that causes a link to open up in a new tab.

There is also target="blank" thus without the underscore _, this causes every link you click on from the parent page to open up in the same new tab. You can set target to any value and all links with the same target value will be previewed using the same browser tab.

E.g.:

✅ Wrap📋
01: <a href="https://example.com" target="value1">Click me (value 1)<a><br>
02: <a href="https://example.com" target="value1">Click me 2 (value 1)<a><br>
03: <a href="https://example.com" target="value2">Click me 3 (value 2)<a><br>

In the example above links 1 and 2 will open up in the same tab because they have the same target value of value1.

Anyways enough of that, let's look at the problem with opening up links externally. The page that was just opened i.e. example.com will have some level of access to the parent page.

For example, example.com can replace the parent site using window.opener.location.replace('malicious-url.com'). This means if the owner of example.com knew what the parent or referer site looked like it could create a malicious clone and redirect the user there without them knowing.

To prevent this we can disable access to the opener object by adding the rel="noopener" attribute to our a tag.

Also by adding rel="noreferrer" the child page cannot tell where the visitor came from in the first place.

In the end, your link should look something like this:

✅ Wrap📋
01: <a href="https://example.com" rel="noopener noreferrer" target="value2">Click me<a>

Here is another article you might like 😊 Be careful with HTML ID attributes