The target attribute on <a> controls where a link opens — the same tab, a new tab, or (in old frame-based layouts) a specific frame.
Syntax
<a href="..." target="_blank">opens in a new tab</a>Basic Example
<a href="https://developer.mozilla.org/" target="_blank" rel="noopener">
MDN Web Docs (opens in a new tab)
</a>Browser output: clicking opens MDN in a brand-new browser tab, while the original page stays open right where the visitor left it.
How It Works
| Value | Behavior |
|---|---|
_self | Opens in the same tab — this is the default, so writing it explicitly is rarely necessary |
_blank | Opens in a new tab or window |
_parent | Opens in the parent frame, if the page is embedded in one |
_top | Opens in the full body of the window, breaking out of any frames entirely |
Important Attributes
| Attribute | Purpose |
|---|---|
target | Sets where the link opens, per the table above |
rel="noopener" | Should always accompany target="_blank" — see External Links for the security reason why |
Real-World Example
<p>Read our full <a href="/privacy-policy">Privacy Policy</a> on this site,
or the <a href="https://gdpr.eu/" target="_blank" rel="noopener">official GDPR guidance</a> (opens in a new tab).</p>Internal link left at the default (_self); external reference deliberately opened in a new tab so the visitor doesn't lose their place on the page.
Common Mistakes
- Adding
target="_blank"to every single link out of habit, including internal ones — this fills a visitor's browser with unwanted extra tabs - Using
target="_blank"withoutrel="noopener" - Relying on frame-related values (
_parent,_top, named frames) in modern layouts that don't actually use frames — these only matter in frame/iframe-based page structures
Best Practices
- Leave
targetat its default for internal navigation - Reserve
target="_blank"for genuinely external destinations, or cases where losing the current page's state would be disruptive (like a long form) - Warn users when a link opens in a new tab, ideally in the visible or accessible text
Accessibility Considerations
Unexpected new tabs are disorienting for users relying on the back button, especially with screen readers or keyboard navigation. Add visually hidden text such as "(opens in a new tab)" inside links that use target="_blank".
SEO Considerations
No direct ranking effect — target only changes browser tab behavior, not how search engines crawl or evaluate the link.
Browser & Modern HTML Notes
Frame-based values (_parent, _top, named targets) are legacy from the frameset era of HTML and are rarely relevant outside of pages still using <iframe>-heavy layouts.
Mini Practice
- Build one internal link (default target) and one external link (
target="_blank" rel="noopener") on the same sample page. - Add accessible "(opens in a new tab)" text to a
target="_blank"link.
