h1, h2, h3... titoli grafici.

[Sonikag]

A livello di accessibilità ecc.. cosa ne pensate dei titoli "grafici" trattati in questo modo? Danno problemi di qualche tipo?

es:

#tit h3 {
	background-image: url('titolo.gif');
	width: 250px;
	height: 50px;
}

#tit h3 span {
	display: none;
}

<div id="tit">
			<h3><span>TITOLO</span></h3>
...

[Mich_]

Ha due errori di fondo:
1. non viene letto dai browser testuali (il display:none fa capire che e` roba da saltare)
2. non piace a Google e simili, per cui rischi il ban dai motori

Poi c'e` l'errore (veniale) di inserire il titolo dentro un blocco da solo ... il tag <hX> e` gia` un blocco per conto suo.

Invece il CSS deve essere del tipo:
h3 span {
margin-left: -200em;
}
in modo da mettere la scritta al di fuori del campo visivo.


PS: io sono comunque contrario a fare i titoli mediante immagini: un bravo grafico e` in grado di ottenere un effetto dello stesso tipo con i colori ed un opportuno sfondo

[pierofix]

Se proprio si vuole sostituire il testo con uno sfondo si può fare così:

XHTML

<h1>Informazioni generali</h1>


CSS

h1
{
   width:250px; height:50px;
   text-indent:-1000em;
   background-image:url('titolo.gif');
}

Ci sono anche altri metodi di Image Replacement: con una ricerca in rete dovresti trovare tutti gli approfondimenti del caso.

[Sickbrain]

Prova a guardare questo:

http://www.sickbrain.org/?document_i...ic_id=8&page=0

Magari fa al caso tuo! Ciao

[Sonikag]

Grazie!
Vorrei però anche un vostro parere su queste cose (come ha fatto Mitch_)
Al momento mi verrebbe da pensarla come lui, se dobbiamo fornire contenuti e testo che senso ha mettere delle immagini? Ok la grafica bella ha il tuo effetto però...
E soprattutto se un grafico mi propone una soluzione del genere voglio essere pronta ad esporgli tutti i CONTRO ai suoi PRO grafici.

[Leilond]

Il testo deve essere presente per l'accessibilità e perchè, a volte capita anche a me quando la connessione è lenta, si possono disabilitare le immagini. E' quindi sempre un bene utilizzare una tecnica di image replacement che però funzioni con immagini disabilitate (ovvero in assenza di immagine si vede il testo)

I pro sono anche per i motori di ricerca. Se usi una tecnica di image replacemente, il bot del motore di ricerca LEGGE IL TESTO, che probabilmente sarà un tag <h> di qualche tipo e le parole del titolo verranno prese in considerazione veramente, cosa meno efficace con <img> "alt" e "title"

Quindi non sono affatto contro l'uso di immagini come titoli, ma solo ed esclusivamente tramite le suddette tecniche e mai con un semplice tag <img>

Dato che il cliente sente solo il suono del danaro, fagli presente il tema dei "motori di ricerca" poichè dal lato "accessibilità" solitamente ci sentono poco (a meno che il sito non sia specificatamente diretto a qualche categoria specifica come gli ipovedenti o che comunque siano un pezzo del loro mercato con un po' di peso)