hreflang: l’attributo HTML per siti web multilingue

Se desiderate internazionalizzare la vostra presenza sul web, avete molteplici possibilità di scelta per rendere multilingue le proprie pagine web: ad esempio, si può scegliere di tradurre tutti i contenuti del proprio sito Internet, adattare l’offerta per utenti specifici e trovare una soluzione (che sia eventualmente relativa ad alcuni determinati paesi) per il dominio o il dominio di primo livello; si può provvedere, inoltre, anche ad adattare la struttura del server per fare sì che il tempo di caricamento del sito web sia sempre costante. Nondimeno l’ottimizzazione per i motori di ricerca delle differenti versioni linguistiche della stessa pagina si dimostra essere sempre una questione spinosa, sebbene necessaria. Infatti è solo sulla base di misure SEO specifiche per lingua e paese che i crawler dei motori di ricerca riescono a classificare correttamente le diverse versioni linguistiche di un sito web e mostrarle così al pubblico corrispondente.

Uno dei mezzi più efficaci di cui la SEO dispone è l’elemento link del tag hreflang.

Im Dezember 2011 stellte Google hreflang als einfache und effektive Lösung vor, um die Suchmaschine über die Beziehungen alternativer Website-Varianten zu informieren. Das Attribut signalisiert den Crawlern der Suchanwendung, dass der Inhalt der aktuellen Seite in verschiedenen Sprachversionen verfügbar ist. Zu diesem Zweck wird es innerhalb eines Link-Elements im HTML-Dokument gesetzt – inklusive der jeweiligen Sprachkürzel. Will man beispielsweise eine spanische Seite als solche kennzeichnen, implementiert man hreflang mit dem Länderkürzel „es“. Das komplette Element sieht dann folgendermaßen aus:

Se, ad esempio, questo elemento è integrato in un sito Internet in tedesco, gli utenti con indirizzo IP localizzato in Spagna verranno automaticamente rimandati alla pagina equivalente in spagnolo.

L’attributo hreflang può essere anche utilizzato per contrassegnare le varianti di una stessa lingua. In questo caso l’attributo viene esteso semplicemente indicando la regione di destinazione. Prendendo ancora una volta in esempio la già citata pagina in spagnolo, si potrebbe pensare di distinguere la pagina utilizzata dagli utenti in Spagna ("hreflang="es-ES") dalla sua variante mostrata agli utenti in Messico ("hreflang="es-MX"). Tutte le possibili abbreviazioni relative a paesi e lingue sono definite negli standard ISO 639 e ISO 3166.

hreflang non è l’operazione che consente di inoltrare una pagina web, infatti, questi due procedimenti non vanno confusi tra loro, pena il rischio di causare l’eliminazione dei metadati dalla pagina. Al fine di evitare che, nonostante l’attributo implementato, nei risultati di ricerca dell’utente appaia una versione del sito Internet in una lingua errata, è necessario che si adottino tutte le misure possibili per l’ottimizzazione multilingue per i motori di ricerca.

Esistono tre modalità diverse per implementare il tag hreflang: il primo metodo, nonché quello più comune, consiste nell’integrare il tag nell’intestazione del documento HTML.  In alternativa, per i documenti che non sono disponibili in formato HTML come ad esempio un file PDF, l’attributo hreflang può essere utilizzato implementato nell’intestazione HTTP. Infine è anche possibile includere l’attributo specifico della lingua o del paese nella sitemap. La struttura dell’elemento link, generalmente utilizzato per marcare le strutture di relazione, è già stata brevemente presentata nell’esempio precedente della versione di una pagina web in lingua spagnola. Al fine di chiarire la struttura generale, presentiamo ancora una volta la forma non specifica del codice:

L’elemento link <link /> è un elemento vuoto che serve esclusivamente per implementare l’attributo adeguato. Può essere utilizzato solo nell’area di intestazione con la frequenza desiderata. Per collegare più versioni linguistiche di una stessa pagina con hreflang, è necessario aggiungere i due attributi rel e href. Queste tre componenti hanno la seguente funzione:

• rel: è un attributo obbligatorio che specifica le relazioni rel tra un documento già esistente e il documento da collegare. Il valore "alternate" indica al motore di ricerca che il documento esterno presenta una versione alternativa di quel determinato sito web.
   
• hreflang: questo attributo descrive in quale lingua è redatto il documento linkato, inoltre può anche indicare quella pagina per quale paese è particolarmente rilevante. I valori ammessi sono i codici regione e lingua regolati dalle norme ISO 639-1 e 3166-1. Se vengono indicati entrambi i dati, i codici devono essere separati da un trattino. Un elenco chiaro di tutte le possibili combinazioni è disponibile su lingoes.net.
   
• href: l’attributo href specifica dove si trova la versione alternativa. Come valore viene solitamente utilizzato l’URL assoluto del documento esterno.

L’utilizzo dell’hreflang ha l’obiettivo di proporre all’utente la pagina web linguisticamente più adatta. Anche nel caso di un’ampia possibilità di scelta può capitare che, a causa della lingua o dell’abbreviazione del paese, agli utenti non possano essere mostrate le varianti giuste. Se questi utenti si imbattono nel vostro sito web dopo una ricerca fatta con un motore di ricerca, sarà il ranking a stabilire quale variante linguistica visualizzare. Risulta quindi chiaro che se viene mostrata la pagina nella lingua sbagliata, si rischia di perdere potenziali lettori e clienti nel giro di pochi secondi. Ciononostante Google fornisce una soluzione a questo problema con l’opzione "x-default", permettendo di risolvere il problema.

Questo valore, che può essere utilizzato in alternativa al codice ISO della lingua o del paese, segnala che l’URL linkato rappresenta la soluzione standard offerta a tutti gli utenti per i quali non esiste una versione linguistica specifica. Ad ogni modo nella pagina standard è possibile presentare una panoramica delle lingue offerte, con l’opzione di selezionare quella desiderata, in modo da poter permette agli utenti di visualizzare il sito web nella lingua che preferiscono. In questo caso, la riga di codice appropriata da aggiungere all’intestazione di ogni versione alternativa è la seguente:

Per capire il funzionamento del tag hreflang, è importante tenere presente una proprietà specifica di questo attributo: hreflang collega due o più documenti in modo bidirezionale e non unidirezionale, come avviene invece quando si inoltra una pagina web. Dunque non è sufficiente che il sito web in lingua italiana contenga un link hreflang alla versione in spagnolo, se questo non è presente anche nella pagina in italiano. Solo se l’attributo hreflang-HTML è implementato in tutti i documenti e in tutte le direzioni disponibili, ossia in tutte le versioni linguistiche, il motore di ricerca può riconoscere la struttura del vostro progetto web e regolare di conseguenza i risultati di ricerca degli utenti.

Presentiamo di seguito un esempio di implementazione dell’attributo hreflang in esempiodominio.it con le versioni linguistiche in italiano, tedesco, spagnolo e inglese. Questo dovrebbe essere inserito nell' intestazione di tutti e quattro i documenti HTML:

L’integrazione dell’attributo nell’intestazione HTTP funziona seguendo lo stesso principio dell’esempio di cui sopra: anche in questo caso bisogna referenziare tutte le versioni linguistiche disponibili. Ci sono piccole differenze soltanto nella sintassi da seguire. Se ad esempio desiderate offrire manuali in PDF nelle quattro lingue della tabella precedente e volete segnalarlo ai motori di ricerca, bisognerà scrivere il codice giusto in questo modo:

Se si vuole realizzare un progetto web internazionale, l’implementazione degli attributi hreflang in una sitemap XML è un’utile alternativa all’inserire il tag in ogni singola pagina. Infatti se si offrono contenuti multilingue su larga scala, lo sforzo per la consueta implementazione HTML è relativamente alto. Anche in una sitemap tutte le versioni linguistiche devono essere elencate singolarmente specificando il rispettivo URL. Ogni URL è anche specificato da un elemento xhtml: link che fa riferimento alle altre varianti disponibili:

Gli esempi di hreflang per HTML e Co. riportati poco sopra dimostrano che l’implementazione pratica e automatica dell’assegnazione degli utenti per le presenze web multilingue non è cosa complicata. Tuttavia bisogna avere una certa attenzione nell’effettuare tutti i passaggi correttamente, indicando tutti i riferimenti giusti: il potenziale di errore non va sottovalutato. Di fatto talvolta può succedere di sbagliare e causare problemi di minore o maggiore entità, alcuni dei quali riguardano solo singole pagine, ma altri di contro, mettono a repentaglio la funzionalità di hreflang per l’intero progetto web. Per questo motivo abbiamo riassunto alcune delle fonti di errore più comuni nei paragrafi seguenti.

hreflang non implementato a livello URL

Poiché il tag hreflang è sempre collegato a un URL specifico, deve essere sempre implementato a questo livello. In altre parole: se viene etichettato esclusivamente l’URL sorgente delle diverse versioni linguistiche, il tag automatico si applica solo a queste pagine iniziali e non all' intero progetto web. È quindi vostro compito implementare singolarmente l’elemento link per tutte le pagine multilingue o URL o, in alternativa, lavorare con la variante della sitemap citata nei paragrafi precedenti.

Una o più versioni linguistiche mancano di autoreferenza

Molti sviluppatori di siti web commettono l’errore di contrassegnare gli URL delle versioni linguistiche con l’attributo hreflang, ma dimenticano che la pagina corrispondente deve anche fare riferimento a sé stessa, ossia avere autoreferenza. In questo caso, la struttura di collegamento è incompleta e non può essere considerata né da Google, né da altri motori di ricerca.

Codici ISO errati

Nell’immettere i codici ISO relativi alle abbreviazioni nazionali e linguistiche, molti SEO tendono a non seguire alla lettera il protocollo giusto, causando spesso la trascrizione di un codice hreflang non corretto. Ad esempio se il contenuto della pagina è esplicitamente rivolto al pubblico britannico, la combinazione "en-uk" potrebbe, a prima vista, sembrare una scelta appropriata, ma il link giusto è in realtà "en-gb". E anche il tag "dk-DK" sembra ovvio, se si vogliono indirizzare gli utenti danesi. Tuttavia, mentre il codice paese ISO per la Danimarca è effettivamente "DK", il codice rispettivo al danese è definito nella norma ISO 639-1 è "da", motivo per cui il codice hreflang corretto è "da-DK".

Rinunciare al tag hreflang x-default

Sia che stiate lavorando a un menu di selezione della lingua sulla pagina iniziale, o a reindirizzi in base all’indirizzo IP, o ancora, a reindirizzi automatici basati sulla lingua del browser, non vi è motivo di non specificare una pagina default. Quasi come se fungesse da segnaposto, un sito Internet così strutturato ti aiuta ad attirare anche quei visitatori la cui lingua o paese non è rappresentata sul tuo sito web. Inoltre Google consiglia di utilizzare questo tipo di tag, poiché apprezzato dai motori di ricerca e dagli utenti.

Riferimento a URL vecchi o inesistenti

Uno dei principali motivi di errore riguardo all’uso del tag hreflang è riferirsi a URL inesistenti o che non esistono più. Il primo errore capita quando i tag vengono automaticamente implementati in tutte le sottopagine, ma non sono tutte disponibili in ogni variante di lingua offerta. Spesso i webmaster dimenticano di seguire una logica adatta a questo modello, in modo che solo gli URL esistenti siano contrassegnati come URL alternativi. Un URL diventa obsoleto nel momento in cui si apportano modifiche alla struttura dell’URL senza che queste vengano trasmesse agli elementi di link.

Implementazione discordante del tag rel canonical e hreflang

Numerosi sviluppatori web ricorrono al tag rel canonical in modo da evitare che i crawler dei motori di ricerca indicizzino le pagine con contenuti uguali o simili. Questo modo di agire è sicuramente un’opzione valida per aggirare la problematica dei contenuti duplicati, tuttavia entra in conflitto con l’utilizzo dell’attributo hreflang. Di fatto se una pagina contiene entrambi i tag, i motori di ricerca ricevono le seguenti informazioni contraddittorie:

• Si suggerisce di ignorare la pagina e di passare a quella successiva (tag rel canonical).
• Oltre alla pagina in questione esistono delle pagine alternative che possono essere più adatte per l'utente. Tuttavia, questa pagina dovrebbe essere rilevata e indicizzata come opzione possibile (tag hreflang).

Da un lato un URL di questo tipo si riferisce a sé stesso, tuttavia dall’altro rimanda anche a un secondo URL che a sua volta contiene un backlink. Di conseguenza, il motore di ricerca ignora entrambi i segnali e cerca di rilevare la struttura in modo diverso. Pertanto, si dovrebbe utilizzare il tag hreflang solo per le pagine che non si riferiscono a un’altra pagina tramite il tag rel canonical. 

Le impostazioni nei tool di Google Webmaster inviano segnali contraddittori

Se registrate il vostro sito web in Google Webmaster Tools (Search Console), potete definire l'orientamento internazionale di un dominio o di un URL, a condizione che vengano utilizzati domini generici di primo livello. Ad ogni modo Google pensa anche alle estensioni di dominio specifiche per un determinato paese. Non c’è dubbio che voi, in qualità di gestori di siti web trarrete vantaggio da questa funzione: Google utilizza queste informazioni per classificare le pagine in modo ottimale.

Tuttavia, non si dovrebbe mai dimenticare di includere queste impostazioni nelle attività SEO. Se si contrassegnano anche le pagine con il tag hreflang, non dovrebbe sorgere alcuna contraddizione. Ad esempio, può succedere rapidamente che una pagina sia contrassegnata con un solo codice lingua e senza specifiche regionali, mentre allo stesso tempo un determinato paese è specificato negli strumenti del webmaster.

Come è già stato detto in precedenza, l’integrazione del tag hreflang nelle pagine HTML rilevanti avviene tramite un certo numero di passaggi e di codici. Quanto più è complesso il vostro sito Internet multilingue, tanto più è probabile che si commettano passi falsi durante l’implementazione dei tag, nonostante si sia a conoscenza delle probabili fonti di errore. Per questo motivo è consigliabile utilizzare alcuni tool per l’implementazione dei tag, al fine di poter controllare a intervalli regolari il funzionamento di tutti gli attributi. Di seguito, una lista di alcuni strumenti interessanti:

• SISTRIX hreflang Generator: grazie al generatore gratuito di tag hreflang ideato da SISTRIX potrete integrare facilmente gli elementi link con attributo hreflang per l’intestazione HTML del vostro contenuto multilingue. Per fare questo, è sufficiente inserire gli URL pertinenti e le abbreviazioni di paese e lingua desiderate. Successivamente per generare il codice basta cliccare su "crea codice". È anche possibile stabilire una pagina predefinita.
   
• SISTRIX validatore hreflang: dopo aver implementato gli attributi per le differenti versioni linguistiche del vostro progetto web, potrete utilizzare il validatore di hreflang offerto da SISTRIX. Questo servizio online gratuito verifica se nell’URL indicato i tag hreflang sono stati implementati correttamente.
   
• Flang: con flang, la società di marketing Dejan SEO vi offre una possibilità gratuita per la verifica dei tag hreflang. Dopo un breve tempo di attesa riceverete le lingue e le regioni di destinazione definite per tutte le alternative inserite e, in caso di problemi, potrete ricevere anche dei suggerimenti per l'ottimizzazione dell'URL desiderato.
   
• Google Search Console: l’iscrizione a Google non solo facilita la comprensione del vostro sito da parte del motore di ricerca, ma vi consente anche di accedere a diversi strumenti di analisi per ottimizzare il vostro progetto web. Tramite l’opzione dell’"orientamento internazionale" la dashboard fornisce anche informazioni sui tag hreflang utilizzati, incluso un elenco di backlink mancanti.

Il motivo principale per il quale si ricorre all’utilizzo di alcuni attributi come il tag rel canonical o il tag hreflang consiste nell’evitare che ci siano contenuti duplicati in progetti web multilingui. Capita spesso di dover servire più progetti web dai contenuti simili, tradotti ma identici. Ad ogni modo per i paesi in cui si parla una stessa lingua, la situazione è ancora più complicata: alcuni cambiamenti dovuti a differenze culturali o regionali (vocabolario, valuta, informazioni di contatto, ecc.) sono in gran parte caratterizzati da contenuti identici. Poiché di solito si utilizza lo stesso dominio, è molto importante inviare segnali chiari ai motori di ricerca per evitare una classificazione negativa.

Mentre il rel canonical dichiara che un URL è la variante dominante ed esclude tutte le versioni alternative dall'indicizzazione, l'attributo hreflang segnala invece quale versione di un determinato pubblico (lingua e/o paese) dovrebbe essere presentata nella ricerca del motore di ricerca. Per questo motivo, se si vuole avere successo a livello internazionale con il proprio sito web dal contenuto multilingue, integrare i tag in HTML è sempre la scelta migliore. Anche se il tag non ha un’influenza diretta sul ranking nei motori di ricerca, il suo uso corretto darà grandi risultati nel lungo periodo, perché sia i crawler che gli utenti dei diversi paesi hanno possibilità di fruire nel modo migliore del vostro sito web.