Jak fungují kotvy (``) odkazy, včetně target a rel?

Question

Jak fungují kotvy (`<a>`) odkazy, včetně target a rel?

Accepted Answer

Element `` (anchor) vytváří hypertextový odkaz. Jeho `href` je cíl, kterým může být URL, cesta, kotva na stránce nebo speciální schéma. ```html External site Internal page (relative) Jump to an element with id="section2" Send email Call us ``` ## Otevření na nové kartě — a bezpečnostní upozornění ```html Opens in a new tab ``` `target="_blank"` otevře novou kartu, ale měli byste přidat **`rel="noopener"`**: bez ní může nová stránka přistupovat k `window.opener` a potenciálně přesměrovat vaši stránku (útok "tab-nabbing"). `noreferrer` také odstraní hlavičku referreru. Moderní prohlížeče implikují `noopener` pro `_blank`, ale explicitní přidání je osvědčená praxe. ## Atribut rel komunikuje vztahy ```html Don't pass SEO ranking (untrusted/user links) Security: no window.opener access Paid/affiliate link ``` ## Navigace na stránce ```html Back to top ...

...

``` Kliknutím se posunete na prvek, jehož `id` odpovídá fragmentu. ## Proč na tom záleží Kotvy jsou páteří webové navigace. Znalost schémat `href` (relativní, absolutní, fragment, `mailto`/`tel`), bezpečnostní dvojice `target="_blank"` + `rel="noopener"` a hodnot `rel` relevantních pro SEO je nezbytná pro správné a bezpečné linkování.