Todos los días se aprende algo nuevo. Yo reconozco que no soy una experta en páginas web y por eso confieso que no tenía ni idea de esta cosa tan tan básica:
Atributo alt: se muestra cuando IE no carga la imagen (si no hay title). Es un texto alternativo para los elementos que no contienen texto. Su uso es obligado pero si la imagen es de decoración y no debes poner un texto alternativo se puede dejar vacío (alt="")
Si la imagen existe o carga correctamente no se vería el alt, se vería el title (si lo hubiera)
Atributo title: se muestra cuando pasas el ratón por encima. Es una descripción emergente (tooltip)
¿Por qué no lo sabía? Porque Explorer (ese maldito navegador que ya no uso) me mostraba el alt si no tenía el title (y porque no me había parado a pensarlo hasta ahora).

el majo de IE confunde (otros navegadores no pondrían nada)
Además title se puede usar en los enlaces, pero no es obligatorio, sólo es necesario cuando vas a aportar una descripción adicional del mismo o información NO redundante.
Si el texto del enlaces es suficientemente claro, poner un title es innecesario.
Usar este atributo de forma inteligente proporcionará más información al enlace, más opciones, desde el punto de vista del usuario, a la hora de decidir si se hace o no click sobre él.
Pasa el ratón sobre los enlaces y las imágenes de a continuación.
Ejemplos title en enlaces:
Ej uso de title alcarativo:
jaymegutierrez
<a href=”http://www.jaymegutierrez.com” title=”página oficial del cantante jayme gutierrez”>jaymegutierrez</a>:Ej uso de title redundante:
casas
<a href=”http://www.casas.com” title=”casas”>jaymegutierrez</a>Ejemplos de alt y title en imágenes:

solo tiene el atributo alt
<img src="http://www.jaymegutierrez.com/img/drawings/bunny.png" alt ="alt en imagen sin title" width="100" heigh="200"/>
atributo alt pero la imagen no carga
<img src="http://www./img/drawings/bunny.png" alt ="alt en imagen que no carga y sin title" width="100" heigh="200"/>
alt, title y la imagen que carga correctamente
<img src="http://www.jaymegutierrez.com/img/drawings/bunny.png" alt ="alt en imagen con title" title="este dibujo es publicidad de la otra web que llevo" width="100" heigh="200"/>
En definitiva, si quieres que salga ese cuadrito amarillo con la descripción de la imagen (tooltip), usa el title pero no olvides que el alt es imprescindible.
.png)

1 comentarios:
La verdad es que es bastante coñazo el explorer y que haga las cosas a su manera, aunque poco a poco cumple un poco mejor los estándares.
Siempre es bueno usar title y demás cosas de ese tipo, mejora mucho la accesibilidad de personas con alguna discapacidad.
Publicar un comentario en la entrada