Penalizzazione testo nascosto. Questo codice è penalizzante?

gleenk

quindi usare gli sprites è consigliabile, ma non c'entra niente con l'uso di "text-indent: -9999px;
Non c'entra se lasci i div, i link o chi per essi vuoti. Ma per i loghi ad esempio mi sembra che c'entri

@vnotarfrancesco said:

Si possono ottenere gli stessi effetti con altre tecniche ed evitare quindi l'uso di "text-indent: -9999px;" ed è quello che Google suggerisce nelle sue best practises.

Quali tecniche? Curiosità

vnotarfrancesco

Ogni caso è diverso e può essere risolto in modi diversi.
Ad esempio, visto che tu accennavi al logo, per questa esigenza un modo sarebbe questo:

<body>
<h1><a href="/"><img id="logo" src="logo.png" alt="Descrivi il logo con le keywords" /></a></h1>
...

Google legge l'attributo alt, quindi si ottengono 3 benefici:

si può usare tranquillamente una sprite per ridurre le richieste http e ridurre l'esecuzione di codice js
non si usano tecniche viste da Google come campanello d'allarme per la presenza di spam (text-indent: -9999px;)
ci si può posizionare anche in Google Immagini e prendere un po' di visite (a volte sorprendenti)

Valerio Notarfrancesco

gleenk

Non riesco a capire nel tuo esempio dove useresti la sprite però :D!

vnotarfrancesco

Logo.png è la mega immagine che è composta da tutte le icone.
Associandolo il tag img all'identificativo "logo" (id="logo") faccio visualizzare solo quella porzione della mega immagine che corrisponde a quello che voglio visualizzare io in quel punto (nel file css ovviamente sono definite tutte le posizioni delle icone).

Ho sempre pensato che le immagini sprite fossero queste (carico solo un'immagine e poi visualizzo un pezzo per volta), ma forse intendiamo cose diverse.

Valerio Notarfrancesco

gleenk

Sono abbastanza stupito dalla forma utilizzata, non ho mai utilizzato gli sprites in questo modo, farò un tentativo perchè mi hai incuriosito. Io conosco la strada classica di usare un'immagine di background via css (anche perchè così si fa realmente una sola chiamata al server, con il metodo da te esplicato ogni volta che io metto img src faccio una chiamata) e poi sempre via css usare il background-position per "spostarla" dove mi interessa

webmaster70

Gleenk guarda l'HTML di una SERP di Google, usa un codice molto simile a quello.

C'è un solo tag IMG, quello del logo, tutto il resto è fatto con la proprietà CSS background-image su SPAN o DIV, e sfruttando l'immagine caricata dal logo:

gleenk

Ho finalmente verificato bene e le cose stanno a metà tra quanto detto. O così pare. Diciamo che prendendo ad esempio Google non si riesce a scoprire molto di più, o meglio, guardando il sorgente si vede che si usano gli sprites, il richiamo al logo una volta col tag img non è indispensabile ai fini grafici. Avrebbero potuto usare tranquillamente anche lì uno span ed un background-image + background-position. Hanno fatto questa cosa carina che val la pena utilizzare per i loghi (farò tesoro). Purtroppo per quanto riguarda il text indent non è una fonte attendibile il sorgente di google perchè non ho mai link (a) in display block con immagini al posto del testo. Il caso specifico di cui parlavo (oltre ai loghi per cui ho capito il meccanismo di cui parlavate) è questo. Resta il fatto che personalmente reputo molto strano e sospettoso che bigG utilizzi un <img eccc logo.png> (senza mettere l'alt tra l'altro ^^) quando di fatto quello non è il logo. ma è l'immagine di più cose. Secondo me il non mettere l'alt serve a "pararsi" proprio da questo. In tutto ciò ho scoperto come evitare il text-indent sui loghi, è già un'ottima cosa

webmaster70

@gleenk said:

Avrebbero potuto usare tranquillamente anche lì uno span ed un background-image + background-position.

Graficamente puoi ottenere lo stesso risultato, ma piuttosto che

da un punto di vista semantico, e anche per i motori di ricerca, credo sia meglio qualcosa del tipo

Anche se manca l'alt, viene preso il title del link, che dai motori (almeno da Google) viene considerato proprio solo per i link non testuali.

E dato che Google lato client fa delle ottimizzazioni estreme in nome della velocità (arriva a sacrificare la validazione HTML, la semantica, la SEO ...), magari questa tecnica l'aiuta. In ogni caso a me piace.

Tornando al text-indent:-9999 del thread, è come scrivere display:none, visibility:hidden ... è nascondere del testo, e siccome si può mettere nel title del link dietro al logo e/o nell'alt del logo, non ne vedo il motivo.

gleenk

Concordo su ciò che dici e anzi ti ringrazio per lo spunto del "title". Sicuramente lo userò al posto del text-indent e farò dei confronti SEO se riesco. Non concordo però sull'ultima frase
Non ritengo possibile che Google penalizzi display:none ecc... Significherebbe penalizzare praticamente tutti i siti che utilizzano jquery per fare un banale accordion, una navigazione a tabs o in AJAX. Mi pare del tutto inverosimile e, forse, più aapropriato ciò che ho letto secondo cui (un po' in linea con tutto quello che dicono da sempre) l'importante è l'attinenza contenutistica e la possibilità di "vedere" quell'elemento.

webmaster70

@gleenk said:

Concordo su ciò che dici e anzi ti ringrazio per lo spunto del "title".
Prego.

@gleenk said:

Non concordo però sull'ultima frase
Non ritengo possibile che Google penalizzi display:none ecc...

Infatti non l'ho detto.
Penalizza solo se lo ritiene ingannevole. E anche Google può sbagliare.
Se la soluzione A non da problemi, e quella B ne potrebbe causare, anche se solo raramente, io preferisco la soluzione A.