How do anchor (``) links work, including target and rel?

Question

How do anchor (`<a>`) links work, including target and rel?

IT Interview Practice · Accepted Answer

The `` (anchor) element creates a hyperlink. Its `href` is the destination, which can be a URL, a path, an in-page anchor, or a special scheme. ```html External site Internal page (relative) Jump to an element with id="section2" Send email Call us ``` ## Opening in a new tab — and the security caveat ```html Opens in a new tab ``` `target="_blank"` opens a new tab, but you should add **`rel="noopener"`**: without it, the new page can access `window.opener` and potentially redirect your page (a "tab-nabbing" attack). `noreferrer` also strips the referrer header. Modern browsers imply `noopener` for `_blank`, but adding it explicitly is best practice. ## The rel attribute communicates relationships ```html Don't pass SEO ranking (untrusted/user links) Security: no window.opener access Paid/affiliate link ``` ## In-page navigation ```html Back to top ...

...

``` Clicking scrolls to the element whose `id` matches the fragment. ## Why it matters Anchors are the backbone of the web's navigation. Knowing the `href` schemes (relative, absolute, fragment, `mailto`/`tel`), the `target="_blank"` + `rel="noopener"` security pairing, and the SEO-relevant `rel` values is essential for correct, safe linking.

Opening in a new tab — and the security caveat

The rel attribute communicates relationships

In-page navigation

Why it matters

Related questions