Pri povezavah (<a> elementih) se pogosto srečamo z atributom rel. Med najbolj pogostimi sta rel=”noopener” in rel=”follow”, vendar služita popolnoma različnima namenoma. Čeprav sta oba zapisana znotraj povezave, eden skrbi za varnost, drugi pa za SEO.

Kaj je rel=”noopener”?

Atribut noopener je namenjen varnosti. Običajno ga uporabljamo skupaj z target=”_blank”, ko želimo povezavo odpreti v novem zavihku.

<a href="https://example.com" target="_blank" rel="noopener">
Odpri stran
</a>

Ko uporabnik odpre povezavo v novem zavihku, lahko nova stran privzeto dostopa do objekta window.opener, kar pomeni, da lahko vpliva na izvorno stran. To odpira možnost napadov, kot je tabnabbing, kjer zlonamerna stran spremeni vsebino prvotnega zavihka in uporabnika tako zavede. Z uporabo noopener ta dostop preprosto onemogočimo.

Pomembno: atribut nima nobenega vpliva na SEO ali indeksiranje strani.

Kaj je rel=”follow”?

Atribut follow je povezan z optimizacijo za iskalnike. Iskalnikom pove, da lahko sledijo povezavi in upoštevajo njen vpliv pri razumevanju povezav med spletnimi stranmi.

<a href="https://example.com" rel="follow">
Povezava
</a>

V praksi je follow privzeto obnašanje povezav. Če atributa ne dodamo, bodo Google in drugi iskalniki povezavi še vedno sledili. Zato atribut rel=”follow” redko vidimo v kodi. Veliko pogosteje se uporablja njegovo nasprotje: rel=”nofollow”, ki iskalnikom sporoča, naj povezave ne upoštevajo za SEO namene.

V čem je torej razlika?

Glavna razlika je v namenu. Noopener skrbi za varnost uporabnika in spletne strani. Follow pa je namenjen komunikaciji z iskalniki in vpliva na SEO. Gre za dva popolnoma ločena koncepta, ki se med seboj ne izključujeta.

Ali ju lahko uporabljamo skupaj?

Seveda.

<a href="https://example.com" target="_blank"
rel="noopener follow">
Povezava
</a>

V resničnih projektih boste veliko pogosteje srečali kombinacijo: rel=”noopener noreferrer”. Atribut noreferrer dodatno prepreči pošiljanje podatka o izvorni strani (HTTP Referer) ciljni strani.

Kdaj uporabiti katerega?

Če povezavo odpirate v novem zavihku, skoraj vedno dodajte noopener. Če razmišljate o SEO, se odločajte med follow (privzeto) in nofollow, odvisno od tega, ali želite, da iskalniki povezavi sledijo. Večina sodobnih CMS sistemov in WordPress urejevalnikov danes atribut noopener samodejno doda pri zunanjih povezavah, odprtih v novem zavihku.

Če odprete povezavo v novem zavihku, uporabite rel=”noopener” zaradi varnosti. Če razmišljate o SEO, je pomemben predvsem rel=”nofollow” oziroma privzeti follow.