How do you open a link in a new tab in HTML?

Add target="_blank" to an <a> tag, and always pair it with rel="noopener noreferrer" for security.

HTMLSecurity

Overview

`target="_blank"` makes a link open in a new browser tab. But without `rel="noopener noreferrer"`, the new page can access your page via `window.opener` a security vulnerability known as reverse tabnapping.

Key Points

•`target="_blank"` opens the link in a new tab or window.
•`rel="noopener"` prevents the new tab from accessing `window.opener` (blocks reverse tabnapping).
•`rel="noreferrer"` additionally hides the HTTP Referer header from the destination page.
•Always combine both: `rel="noopener noreferrer"`.
•Modern browsers (Chrome 88+) apply `noopener` automatically for `target="_blank"`, but it is still best practice to write it explicitly.

Examples

Correct way to open a link in a new tab

html

<a href="https://example.com" target="_blank" rel="noopener noreferrer">
  Visit Example
</a>

Unsafe missing rel attribute (avoid)

html

<!-- DON'T do this on older browsers -->
<a href="https://evil.example" target="_blank">Click me</a>
<!-- The new page could do: window.opener.location = 'phishing-site.com' -->

Pro Tip

Add `rel="noopener noreferrer"` as a habit any time you write `target="_blank"`. ESLint plugins like `eslint-plugin-jsx-a11y` (React) will warn you if you forget it.