Cita:
Iniciado por metacortex
Personalmente no uso nunca el
display: none por razones de accesibilidad y hasta de facilidad.
Esto es incorrecto:
Código:
<h1><span>El título</span></h1>
--------
h1 {
background: url(imagen.jpg) no-repeat;
width: XX px;
height: XX px;
}
h1 span {
display: none;
}
Esto es correcto:
Código:
<h1>El título</h1>
--------
h1 {
background: url(imagen.jpg) no-repeat;
overflow: hidden;
width: XX px;
height: XX px;
text-indent: -10000 px;
}
En un rato hago una pruebita con algo que se me acaba de ocurrir y que está relacionado con esto. Uds. luego dirán si ayuda o no al posicionamiento.
Hola metacortex
Aunque el tex-indent negativo no falla en google o en posicinamiento, creo que en cuanto a accesibilidad a veces si falla. Por ejemplo si lo ves desde Opera en Estilo/Diseño de Accesibilidad verás que no aparece nada.
Aquí se utiliza el mismo ejemplo:
http://www.csslab.cl/2006/09/25/imag...do-por-imagen/ http://www.csslab.cl/ejemplos/header/header.html y si miras esto mismo en Opera verás que no sale nada, donde debería de salir su h1 en modo texto.
Creo que de esta manera si saldría:
Código HTML:
h1 { width: 300px;
height: 174px;
background-image: url(imagenes/h1.gif);
}
h1 span {
display: block;
width: 0;
height: 0;
overflow: hidden;
}
Código HTML:
<h1><span>Título</span></h1>
De todas formas si lo ves con
Fangs en Firefox si sale de las dos maneras perfectamente
Saludos