Cos'è rel="noopener" in WordPress? (Spiegato)

Una volta avevamo un cliente i cui visitatori del sito venivano reindirizzati a siti web loschi dopo aver cliccato su link esterni. Il problema era una piccola parte di codice mancante che creava una grave falla di sicurezza.

È un pensiero spaventoso, ma questa vulnerabilità può interessare qualsiasi sito WordPress. Gergo tecnico come rel="noopener" può sembrare confuso, lasciandoti preoccupato se il tuo sito web sia veramente sicuro per i tuoi visitatori.

Qui a WPBeginner, abbiamo messo in sicurezza migliaia di siti e abbiamo imparato che questi piccoli dettagli fanno una grande differenza. Spiegheremo cos'è rel="noopener" in termini semplici e perché è così importante.

Vediamo come questo piccolo attributo protegge te e i tuoi utenti.

Cos'è rel=”noopener” in WordPress?

Quando aggiungi link al tuo sito web WordPress, puoi utilizzare attributi HTML per controllare cosa succede quando si fa clic sul link.

Ad esempio, quando crei un link, c'è un interruttore che ti permette di aprirlo in una nuova scheda.

Il codice HTML generato da WordPress per questo link è il seguente:

<a href="http://example.com" target="_blank" rel="noreferrer noopener">external link</a>

Nota che alcuni attributi HTML sono stati aggiunti al link: rel="noopener" e rel="noreferrer". Questi attributi vengono aggiunti per affrontare una vulnerabilità di sicurezza.

Quando usi target="_blank" per far aprire un link in una nuova scheda, c'è qualcosa di potenzialmente inaspettato che accade in background per impostazione predefinita. La nuova scheda ottiene effettivamente una sorta di connessione alla scheda originale su cui ti trovavi.

Questa connessione viene creata tramite qualcosa nei browser web chiamato window.opener. La pagina nella nuova scheda può accedere e persino controllare determinate proprietà della scheda originale, come cambiare l'indirizzo della pagina (window.opener.location).

Questo crea una vulnerabilità di sicurezza.

Immagina di fare clic su un link su un sito Web attendibile e questo apre una pagina dannosa in una nuova scheda. A causa di questa connessione window.opener, quella pagina dannosa potrebbe potenzialmente trasformare la pagina attendibile originale che stavi visualizzando in una finta pagina di accesso (una truffa di phishing), ingannandoti quando torni alla scheda originale.

L'attributo del link noopener è progettato per prevenire questo specifico rischio di sicurezza.

Quando aggiungi rel="noopener" a un link che si apre in una nuova scheda, dici al browser di non creare quella connessione window.opener tra le due schede. Questo protegge i tuoi utenti da truffe e tentativi di phishing.

In che modo rel=”noopener” influisce sul tuo SEO WordPress?

Non influisce.

Anche se l'attributo rel="noopener" migliora la sicurezza del tuo sito WordPress, alcuni utenti evitano di usarlo perché pensano che influenzerà il loro SEO WordPress.

Ma questo è solo un mito.

Non ha alcun impatto sui ranking SEO del tuo sito o sulle prestazioni generali del tuo WordPress.

Qual è la differenza tra “noopener” e “nofollow”?

It’s easy to confuse rel="noopener" with rel="nofollow". However, they are completely separate attributes.

The noopener attribute prevents your website from cross-site hacking and improves WordPress security.

On the other hand, the nofollow attribute prevents your website from passing on SEO link juice to the linked website.

Search engines look for and consider the nofollow attribute when following a link on your website. However, they do not give any consideration to the noopener tag.

L'attributo nofollow dice ai motori di ricerca di non passare alcuna autorità SEO al sito web a cui stai linkando. Mentre l'editor a blocchi di WordPress ha un interruttore integrato per aggiungere nofollow a un link, spesso è necessario un plugin per un controllo più avanzato.

Ad esempio, potresti voler applicare automaticamente il tag nofollow a tutti i link esterni sul tuo sito, ed è qui che un plugin SEO diventa essenziale.

To learn more, see our article on how to add title and nofollow to links in WordPress.

rel=”noreferrer” influisce sui link di affiliazione in WordPress?

Il codice rel="noreferrer" non influisce sui link di affiliazione in WordPress. Alcuni utenti credono che lo faccia perché rel="noreferrer" impedisce il passaggio delle informazioni sul referrer alla nuova scheda.

Tuttavia, la maggior parte dei programmi di affiliazione ti fornisce un URL univoco che contiene il tuo ID affiliato. Ciò significa che il tuo ID affiliato viene passato come parametro URL affinché l'altro sito web possa tracciarlo.

In secondo luogo, la maggior parte degli affiliati utilizza un plugin per nascondere i link per i propri link di affiliazione.

Con il nascondimento dei link, il link di affiliazione su cui cliccano i tuoi utenti è in realtà l'URL del tuo sito web, che poi reindirizza gli utenti all'URL di destinazione.

Come disabilitare rel=”noopener” in WordPress?

Non c'è bisogno di rimuovere rel="noopener" dai link sul tuo sito web. È positivo per la sicurezza del tuo sito web e non ha alcun impatto sulle prestazioni o sulla SEO del tuo sito web.

Tuttavia, se devi rimuoverlo, dovrai disabilitare l'editor a blocchi di Gutenberg in WordPress e utilizzare l'editor classico.

Questo perché se rimuovi manualmente rel="noopener" dal link, l'editor a blocchi lo aggiungerà automaticamente per mantenere sicuro il tuo sito web.

Una volta disabilitato l'editor a blocchi, dovrai aggiungere uno snippet di codice al file functions.php del tuo tema o al plugin WPCode (consigliato). Puoi imparare come usare il plugin gratuito WPCode nella nostra guida su come aggiungere facilmente codice personalizzato in WordPress.

Copia semplicemente il seguente codice in un nuovo snippet PHP:

add_filter('tiny_mce_before_init','wpb_disable_noopener');
function wpb_disable_noopener( $mceInit ) {
    $mceInit['allow_unsafe_link_target']=true;
    return $mceInit;
}

Assicurati di attivare l'interruttore 'Attivo' e quindi fai clic sul pulsante 'Salva snippet'.

Questo impedirà a WordPress di aggiungere rel="noopener" ai nuovi link. Dovrai anche modificare manualmente tutti i vecchi link per rimuovere l'attributo.

Per un controllo ancora maggiore sugli attributi dei tuoi link, ti consigliamo di utilizzare il plugin All in One SEO (AIOSEO). AIOSEO ti consente di aggiungere facilmente attributi come nofollow o sponsored direttamente all'interno dell'editor di WordPress, aiutandoti a gestire i tuoi link esterni per le migliori pratiche SEO.

Domande frequenti su rel=”noopener”

Ecco le risposte ad alcune delle domande più comuni che riceviamo sull'attributo "noopener" in WordPress.

1. Qual è lo scopo principale dell'utilizzo di rel="noopener"?

Lo scopo principale di rel="noopener" è la sicurezza. Impedisce a una nuova scheda di poter controllare la scheda originale che l'ha aperta, proteggendo così i tuoi visitatori da truffe di phishing dannose.

2. È bene usare rel=”noopener” per la SEO?

L'attributo rel="noopener" non ha un impatto diretto, né positivo né negativo, sulla SEO del tuo sito web. La sua funzione è puramente di sicurezza e i motori di ricerca non lo utilizzano come fattore di ranking.

3. Devo rimuovere rel=”noopener” dai miei link?

No, non c'è alcun buon motivo per rimuovere rel="noopener". Fornisce un importante beneficio di sicurezza senza effetti negativi sulla SEO o sulle prestazioni del sito, quindi è meglio lasciarlo al suo posto.

4. WordPress aggiunge automaticamente rel=”noopener”?

Sì, WordPress aggiunge automaticamente rel="noopener" ai link impostati per aprirsi in una nuova scheda. Questa importante funzionalità di sicurezza è stata introdotta per la prima volta in WordPress 4.7.4 ed è una parte standard dell'editor a blocchi moderno.

Guide Esperte sull'Uso dei Link in WordPress

Speriamo che questo articolo ti abbia aiutato a conoscere rel="noopener" in WordPress. Potresti anche voler consultare altre guide sull'uso dei link in WordPress:

• Guida per principianti su come aggiungere un link in WordPress
• Come aprire collegamenti esterni in una nuova finestra o scheda con WordPress
• Come aggiungere collegamenti Nofollow in WordPress (Guida semplice per principianti)
• Come aggiungere titolo e NoFollow al popup Inserisci link in WordPress
• Come aggiungere Nofollow a tutti i link esterni in WordPress
• Come tracciare i clic sui link e sui pulsanti in WordPress (modo semplice)
• Come monitorare i link in uscita in WordPress
• Come cambiare il colore dei link in WordPress (Guida per principianti)
• Collegamenti interni per la SEO: la guida definitiva alle migliori pratiche
• Come precaricare i collegamenti in WordPress per velocità di caricamento più rapide
• Come trovare e correggere link interrotti in WordPress (Passo dopo passo)
• I migliori plugin per il collegamento interno per WordPress (automatico + manuale)

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.