Make HTML link open in new tab HTML
When you create an anchor
a link element in HTML it will open in the same tab by default, but you have the option to make the link open in a new tab with the
target attribute. Here is how to make an HTML link open in a new tab as well as some important security measures.
First, you need to add the
target attribute your link and set the value to
_blank. This is what tells the browser to open the link in a new tab (or window). But don't stop there.
Then you should add the
rel attribute to your link and set the value to
This prevents malicious sites from being able to use
window.opener.location to maliciously change the url of your page in the background to something like a fake login page while the user is on their page in the new tab.
noopener sets window.opener to null and
noreferrer disables the Referrer HTTP header.
Here is a full example of an HTML link that opens in a new tab and has
Most modern browsers now automatically treat links with
target="_blank" as if they have the
rel attribute with the value
noopener but you should still include
rel="noopener noreferrer" in the markup of your links for security in older browser versions and Internet Explorer.
Now you know how to safely make an HTML link open in a new tab using
Thanks for reading.
Published on 3 Aug 2022