Before we dive into the differences between target
_blank
and _new
, it is important to know that _new
is not a valid value for the target
attribute. The target
attribute only supports the following (case-insensitive) values:
Value | Description |
---|---|
_blank |
Opens link in a new, unnamed window. |
_self (default) |
Opens link in the same frame as it was clicked. |
_parent |
Opens link in the parent of the current frame. This is equivalent to _self if the current frame has no parent. |
_top |
Opens link into the original window (canceling all other frames). This is equivalent to _self if the current frame has no parent. |
framename |
Opens link in a frame that has the name attribute value matching the target framename . If no such frame exists, most browsers would open the link in a new window, with all subsequent links with the same framename replacing the previously loaded page in that window. |
As per the official standard, framename
must begin with an alphabet (lower or upper case). However, most browsers ignore that rule, which is why we have non-standard values such as _new
behaving the same way.
To prove the point about target="_new"
behaving the same way as target="framename"
, let's take a look at the following example:
<a href="https://google.com" target="_new">google</a>
<a href="https://apple.com" target="_new">apple</a>
<iframe name="_new"></iframe>
In the example above, all links with target="_new"
would load in the iframe
(because its name
matches the link target
). However, if no such frame existed in the current window, then (as mentioned earlier) most browsers would open the link in a new window (or tab) and replace it with a new url each time another link with the same target
value was clicked on.
target="_blank"
on the other hand, is a part of the official standard, and works by opening a link in a new window each time.
When using _blank
make sure to also set rel="noopener"
on the anchor tag, to prevent potential security risks.
#target
_new
Vs. _blank
Using target="_blank"
would create a new, unnamed window each time (which cannot be reused). This requires more system resources (when creating a secondary window each time) as compared to a named target
(in which case the same window is reused). Also with this approach, if several such links are clicked on, it can easily lead to visual clutter, and possibly the browser using more system resources for having multiple windows/tabs open.
Using a named target attribute value (such as target="_new"
, etc.) will, in almost all modern browsers, create a new single secondary window which is recycled and reused. This approach puts less stress on system resources (as the same window/frame is reused).
You should use new
instead of _new
as the latter is not a part of the official syntax and might cause you validation errors.
This post was published by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.