L'attributo target="blank"_ è tipico dei link e indica al browser di aprire una pagina come seconda scheda anziché navigare nella scheda corrente (quindi di fatto, sostituendo la scheda corrente con quella nuova, ciò che avviene di default).
L'attributo target="blank"_ presenta qualche piccolo "problema", che vediamo:
- questione "etica": tanto o poco importante che sia, l'utente non sa se cliccando su un link finirà su una nuova pagina oppure continuerà a navigare nella stessa scheda (di default la scheda si sovrascrive); questo salvo ovviamente fare "ispeziona elemento", "sorgente pagina" o cose del genere
- questione di sicurezza: citando Google Web.dev:
The other page may run on the same process as your page. If the other page is running a lot of JavaScript, your page’s performance may suffer
The other page can access your window object with the window.opener property. This may allow the other page to redirect your page to a malicious URL
Come soluzione per questi "problemi di sicurezza", si possono usare due attributi aggiuntivi:
- rel="noopener": previene che il sito linkato possa (tramite codice JavaScript ad esempio) prendere controllo della pagina precedente (previene quindi potenziali attacchi malevoli)
- rel="noreferrer": nasconde le informazioni "referrer" della pagina/sito precedente, quindi in questo modo non viene mostrata la provenienza (evita anche questo che la pagina linkata possa prendere il controllo della precedente, quindi funzionamento analogo a "noopener")
Osservazione: il CMS WordPress di default quando si implementa un link da aprire come nuova scheda, aggiunge in automatico l'attributo rel=”noopener”.
Alternativa a target="blank"_: un altro esempio per prevenire attacchi malevoli è sostituire il termine target="blank"_ con uno a caso, ad esempio costruire un link di questo tipo:
Ulteriori consigli, una sintesi generale:
- se apriamo pagine del nostro sito, NON usiamo target="blank"_ ma continuiamo a navigare nella stessa scheda
- se apriamo pagine di un altro sito, usiamo target="blank"_
- se non ci "fidiamo" molto della serietà, onestà, autorevolezza sito web linkato, aggiungiamo il classico rel="nofollow" (anche se questo attributo sta diventando sempre meno importante grazie all'algoritmo di Google sempre più evoluto: approfondimento)
- quando si apre una nuova scheda, di un sito web esterno (specialmente se è uno di cui "non ci fidiamo" più di tanto) conviene usare rel="noopener"
Approfondimento:
SearchEngineJournal