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

Una volta abbiamo aiutato un utente i cui visitatori venivano reindirizzati a siti web non sicuri dopo aver cliccato su normali link esterni. Il colpevole era una piccola e mancante porzione di codice che creava un rischio per la sicurezza.

È del tutto normale sentirsi curiosi o persino un po' confusi quando si vede gergo tecnico come rel="noopener" nel proprio editor. Potresti chiederti cosa faccia e se il tuo sito web ne abbia bisogno.

Fortunatamente, non è necessario essere uno sviluppatore per mantenere sicuro il proprio sito. Il nostro team di WPBeginner ha messo in sicurezza migliaia di siti web e sappiamo esattamente come gestire queste impostazioni in background.

Vediamo cosa fa effettivamente questo piccolo attributo di testo e come protegge i tuoi lettori. Non preoccuparti, aggiungere rel="noopener" è completamente invisibile ai visitatori del tuo sito web. Non cambia il colore dei tuoi link né la velocità con cui si apre la nuova scheda. Funziona solo in background.

Cos'è rel=”noopener” in WordPress?

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

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

Nota che è stato aggiunto un attributo HTML al link: rel="noopener". Questo attributo viene aggiunto per risolvere una vulnerabilità di sicurezza.

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

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).

Ciò crea una vulnerabilità di sicurezza nota come ‘Reverse Tabnabbing’.

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 tue prestazioni WordPress complessive.

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.

Per saperne di più, consulta il nostro articolo su come aggiungere titolo e nofollow ai collegamenti in WordPress.

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

Nelle versioni precedenti di WordPress, veniva aggiunto automaticamente anche un tag rel="noreferrer" ai link. Sebbene la maggior parte dei programmi di affiliazione utilizzi parametri URL (il che significa che non sono stati interessati), il tag noreferrer occasionalmente nascondeva dati di tracciamento dai dashboard di affiliazione e dagli strumenti di analisi.

Per questo motivo, WordPress ha rimosso il tag noreferrer nella versione 5.3.1. Non devi più preoccuparti che influenzi i tuoi link di affiliazione.

In secondo luogo, la maggior parte degli affiliati utilizza un plugin per mascherare 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.

Se devi assolutamente 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 senza toccare alcun codice HTML, ti consigliamo di utilizzare il plugin All in One SEO (AIOSEO).

Mentre WordPress gestisce la sicurezza automaticamente, AIOSEO ti consente di aggiungere facilmente attributi SEO come nofollow o sponsored direttamente all'interno del popup dei link dell'editor a blocchi, 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.

Risorse aggiuntive 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 trovarci anche su Twitter e Facebook.