TLTR: Se un utente può vederlo, anche Google può vederlo.
Il testo nascosto, con l’obiettivo di manipolare l’algoritmo di Google, può portare a penalizzazioni. Tuttavia, esistono alcune tecniche valide e approvate da Google per nascondere i contenuti, in particolare per il web mobile.
In questa guida non parliamo di come nascondere del testo per fare SPAM, ma di come poter nascondere in modo legit del contenuto, per farlo indicizzare e valutare ai fini SEO nello stesso modo di un testo visibile.
Perché qualcuno dovrebbe voler nascondere del testo? Essenzialmente per motivi di UX. Perché magari nella versione mobile del sito non sarebbe comodo per l’utente avere un blocco di testo eccessivamente lungo.
Il testo nascosto nuoce alla SEO?
Il testo nascosto è stato generalmente considerato da Google come una tecnica di spam fin dai primi giorni della SEO. I motori di ricerca allora si basavano su semplici algoritmi di corrispondenza e frequenza del testo. Pertanto risultava relativamente semplice indicizzare un sito web per parole chiave che l’utente non vedeva.
Chi faceva spam usava il testo nascosto per scopi di ranking: l’obiettivo era posizionarsi su query ad alto traffico informativo con una pagina commerciale su un argomento differente.
Indicizzo la pagina per la query Y, ma all’utente mostro Z. Questo è cloaking.
Oggi esiste un modo etico per nascondere il contenuto di testo e immagini, ed è importante capire come farlo per i layout del web mobile. Vediamo in rassegna tutti i metodi per nascondere del testo, dal più spam ed obsoleto da evitare, a quello consigliato da Google.
Partiamo dai peggiori metodi per nascondere testo, per poi arrivare a quelli consigliati da Google.
Cloacking
Il cloaking è l’atto di mostrare ai motori di ricerca una cosa e ai tuoi visitatori un’altra. Ad esempio, indicizzando il sito web con recensioni di libri ma rimandando gli utenti reali a contenuti pornografici.
Nel 2011 Matt Cutts, del web spam team di Google, pubblicò un video per spiegare questo fenomeno:
Il cloaking viene eseguito fornendo contenuti basati sull’indirizzo IP o sull’user-agent. Se viene rilevato uno spider di un motore di ricerca, viene visualizzata la versione pulita e legittima del sito, ma se viene rilevato un visitatore umano, viene invece visualizzata la versione reale del sito web con i contenuti malevoli o indesiderati.
La relativa penalizzazione di Google può essere applicata in due forme:
- Parziale, che interessa solo parti del tuo sito.
- Totale, che interessa l’intero sito web.
Tecniche di cloaking non andrebbero usate se ci tieni alla SEO del tuo sito web. Google considera SPAM questa tecnica.
Testo e sfondo dello stesso colore
Benvenuto negli anni Novanta! Questa tecnica è obsoleta, se stai ancora nascondendo testo in questo modo il consiglio è di aggiornarti perché Google è in grado di identificare questo “trucco” e non lo vede tanto di buon occhio.
Google considera SPAM questa tecnica.
Testo nascosto dietro un’immagine
Tramite CSS e JS è possibile sovrapporre un’immagine a del testo in modo da nasconderlo. Anche questa tecnica è sconsigliata dato che non permette all’utente di vedere il testo nascosto.
Google considera SPAM questa tecnica.
Font-size:0
Inserire del testo in pagina assegnando una dimensione dei font pari a zero equivale a nascondere del testo. Anche questa tecnica andrebbe evitata.
Google considera SPAM questa tecnica.
Valori negativi text-indents
text-indent:-9999em
Questa pratica è stata seguita dagli sviluppatori per molto tempo come un modo per aggiungere loghi o intestazioni personalizzate in cui i caratteri non hanno un trattamento possibile con i CSS, ad esempio con caratteri non concessi in licenza per l’uso di @font-face.
In passato Google aveva dichiarato tramite il portavoce Matt Cutts, che sarebbe meglio evitare questo approccio se possibile e utilizzare il testo alternativo tradizionale per le immagini.
Nella documentazione di Google questa tecnica viene sconsigliata, ma è largamente utilizzata dai designer quindi, se usata in modo consono, solitamente non porta a penalizzazioni.
Visibility:hidden
Questo metodo nasconde il testo dai browser ma non dagli screen reader. Inoltre non permette agli utenti di vedere il testo, questo potrebbe portare una valorizzazione inferiore del testo taggato come visibility:hidden ai fini SEO.
Display:none
Questo metodo con CSS nasconde il testo dai browser ma non dagli screen reader. Come per visibility:hidden, non permette agli utenti di vedere il testo e questo aspetto potrebbe portare una valorizzazione inferiore in termini SEO del testo taggato con display:none.
<div style="display:none;">Testo nascosto</div>
In realtà l’uso legittimo di questa tecnica è così diffuso che non mi aspetterei che i motori di ricerca penalizzassero un sito per l’utilizzo dell’attributo display:none. In particolare, se stai usando un sistema CMS che è usato da molti altri e il CMS usa il display:none dubito che avrai un problema.
Quando usare visibility e quando usare display?
Sebbene entrambi possano essere utilizzati per “nascondere” un elemento, ciascuno lo fa in modo diverso. La differenza sta nel modo in cui viene trattato lo spazio dell’elemento nascosto.
- Con Visibility l’elemento mantiene il suo spazio anche quando non è visto.
- Con Dispay l’elemento nascosto cede il suo spazio consentendo agli altri elementi della pagina di comprimersi attorno ad esso.
Visibility, Display e SEO
Dato che nascondere testo è generalmente indicato dai MdR come SPAM, si tende a non usare queste tecniche. Tuttavia, ci sono molte buone ragioni per cui si vuole nascondere alcuni elementi delle pagine web.
Finché non stai tentando di ingannare i motori di ricerca, non dovresti incontrare problemi utilizzando visibility:hidden o display:none per nascondere un elemento.
Tab dinamiche
Questa è la soluzione migliore, consigliata da Google. Un tab, un accordion, un elemento dinamico che permette all’utente di espandere il testo e leggerlo tutto: This is the way to go in 2020.
Anche Matt Cutts ne aveva parlato in passato:
E successivamente anche John Mueller:
Un esempio di tab dinamica fatta con jQuery lo puoi trovare nella pagina delle guide SEO di questo sito:
Il testo, presente nel codice HTML, inizialmente è nascosto ma l’utente, con un click, può aprirlo e leggerlo.
Come dice Mando,
This is the way