Link Targets & rel Attribute — HTML

Link Targets and rel Attributes

Two attributes shape how a link behaves and what it tells other systems: target decides where the linked document opens, and rel describes the relationship between the current page and the link's destination — information search engines and browsers both read.

target Attribute Values

Value	Behavior
`_self`	Default — opens in the same browsing context (same tab)
`_blank`	Opens in a new tab or window
`_parent`	Opens in the parent frame, if the page is inside an `<iframe>`
`_top`	Opens in the full body of the window, breaking out of any frames/iframes

target-values.html

HTML

<a href="/about" target="_self">About (same tab, default)</a>
<a href="https://example.com" target="_blank" rel="noopener noreferrer">Docs (new tab)</a>

<!-- Inside an iframe -->
<a href="/dashboard" target="_parent">Escape one level of frame</a>
<a href="/dashboard" target="_top">Escape all frames</a>

Named targets

`target` can also be an arbitrary name (e.g. `target="preview"`). The first link with that name opens a new window/tab; every subsequent link using the same name reuses that same window instead of opening more.

rel Attribute Values

rel documents the relationship between the current document and the linked one. Some values matter for security, others for search engines.

Value	Meaning
`nofollow`	Tells search engines not to pass ranking credit through this link
`noopener`	Prevents the new page from accessing `window.opener` (security)
`noreferrer`	Also strips the `Referer` header sent to the destination
`sponsored`	Marks a link as paid/sponsored (ads, affiliate links) for search engines
`ugc`	Marks a link as user-generated content (comments, forum posts)

rel-values.html

HTML

<!-- An affiliate link -->
<a href="https://shop.example.com/item" rel="sponsored nofollow">Buy this product</a>

<!-- A link posted by a forum user -->
<a href="https://randomsite.example" rel="ugc nofollow">check this out</a>

<!-- A trusted external resource, opened safely in a new tab -->
<a href="https://developer.mozilla.org" target="_blank" rel="noopener noreferrer">MDN</a>

Why rel Matters for SEO

Search engines use nofollow/sponsored/ugc to decide whether a link should influence the destination site's ranking — important for compliance with ad and affiliate disclosure guidelines.
Sites that sell links or run heavy affiliate programs are expected to mark them sponsored, or risk penalties for manipulating search rankings.
Comment sections and forums should mark outbound user links ugc (or nofollow) so spammy links don't pass ranking value to their targets.

Why rel Matters for Security

noopener and noreferrer protect against tabnabbing — where a page opened via target="_blank" uses window.opener to silently redirect the original tab to a phishing page while the user is focused on the new one.

Combine multiple values with spaces

`rel` accepts multiple space-separated values on one link, e.g. `rel="nofollow noopener noreferrer"`. Don't repeat the attribute — one `rel` attribute per link, with all relevant values inside it.

Quick Reference

Attribute	Typical use
`target="_blank"`	Open link in a new tab
`rel="noopener noreferrer"`	Always pair with `target="_blank"` for security
`rel="nofollow"`	Untrusted or paid link, don't pass SEO credit
`rel="sponsored"`	Advertisement or affiliate link
`rel="ugc"`	User-submitted content link

Defaults changed over time

Modern browsers implicitly apply `noopener`-like protections to `target="_blank"` links even without the attribute, but explicitly setting `rel="noopener noreferrer"` remains the portable, explicit, best-practice choice.