Antxoa.com

Jornada Ajax y Javascript no Intrusivo, accesibles? Miércoles, 24 de Octubre de 2007

Por poco se me pasa avisar…

Mañana jueves, 25 de octubre, en Bizkaia Enpresa Digitala, impartiré una jornada sobre Ajax y JS no intrusivo, orientada a la accesibilidad.

Es gratuito, sólo dura dos horitas y además hay café y pastas! así que espero veros a todos por allí (prometo no aburrir).

Podéis consultar el programa (y todavía estáis a tiempo de inscribiros) en la web de Enpresa Digitala.

Si acudísteis a la jornada que impartí el año pasado, va a tener una parte parecida, casi toda la de Javascript no intrusivo, sólo que esta vez haremos hincapié en la Accesibilidad con el añadido de Ajax.

Clasificado bajo: Estándares Web | Sin comentarios »

Indignación accesible Jueves, 13 de Septiembre de 2007

Una vez que ya ha pasado todo eso del huracán Dean, prosigo con la temática normal del blog, es decir, a escribir lo primero que se me pase por la cabeza.

Mi colega Sigmar, uno de los pocos lectores fieles que tengo, se ha acordado de mí y me ha enviado la preciosa viñeta de comic que comparto con todos hoy:

En la viñeta aparecen un chico con pinta de chulito y una chica hablando. El chico le dice a la chica:
Y entonces le contesté ¿para qué coño voy a hacer una página accesible?.
Entonces la chica le pega un puñetazo, muy indignada.

Se supone que la chica me representa a mí y el chico, a alguien que no respeta la accesibilidad web.

Si no te dedicas al desarrollo web, sáltate este párrafo. Si te dedicas, sigue leyendo. Hola amigo del diseño y desarrollo web. Si te preguntas por qué estoy describiendo con pelos y señales lo que aparece en la imagen (qué perdida de tiempo si ya estás viendo la imagen, ¿no?), mejor no te acerques a mí, que igual la viñeta cobra vida…

Hola de nuevo, querido lector que no se dedica al desarrollo web.

Bien, como iba diciendo, aunque el mensaje de la viñeta puede ser un poco fuerte, realmente representa una situación que vivimos muchos de los chicos y chicas WAIs cuando nos sentimos frustrados, por ejemplo:

• Estás impartiendo un curso de Accesibilidad Web y el último día de clase escuchas a un alumno decir que realmente todo esto no es importante porque, total, todo el mundo utiliza Internet Explorer.
• O te dicen que por unos pocos ciegos no vas a joder al resto (lo siento por el taco, pero es literal).
• O te dicen que no existe la vida sin javascript.
• O que la maquetación con tablas es lo mejor que existe.
• O…

Hay veces que esto es una mierda, la gente no se compromete, se la sopla todo, y realmente te apetece coger un bate de beisbol y liarte a palos con lo que tengas más cerca (la impresora, el ordenador. o lo que sea). Te ven como al enemigo cuando tú lo único que quieres es ayudarles a que la web sea un lugar mejor para todos…

Vale lo dejo aquí que me estoy empezando a poner cursi.

Clasificado bajo: Estándares Web | 1 comentario »

Plugin instalado: MoreMoney (aka Buhonejo) Miércoles, 18 de Julio de 2007

Bueno, poco a poco estoy afinando más esta última versión del blog, y lo último ha sido volver a poner la publicidad de Google.

Pero esta vez no se visualizará siempre. Mis lectores habituales no tendrán que soportar la dichosa publicidad, tan sólo aparecerá a los usuarios que provengan de buscadores.

Todo gracias al estupendo plugin de los chicos de No puedo creer, el MoreMonkey (aka Buhonejo).

Clasificado bajo: Estándares Web | Sin comentarios »

Atributo alt vacío Miércoles, 16 de Mayo de 2007

Al hilo de unos mensajes que han surgido en Ovillo sobre el acierto o no de poner textos alternativos vacíos en imágenes decorativas, no he podido reprimirme a escribir un mensaje que voy a reproducir en el blog.

Realmente no cuento nada nuevo que no hubiera dicho ya hace 6 meses en el post de Textos alternativos vacíos, pero igual os sirve como complemento.

Ahora bien (esto no tiene nada que ver con el post), ¿debo implementar mi mensaje como un blockquote de mí misma o no? nunca lo había pensado…

Textos alternativos vacíos…

Hola,
vamos por partes.

Por la propia definición de (X)HTML, las imágenes deben llevar el atributo alt (así como el atributo src) obligatoriamente.

Lo que cambia es el valor que se ofrezca. Como se ha dicho anteriormente, la forma más correcta de implementar imágenes decorativas, de maquetación, que no aportan información al usuario es mediante CSS, como fondo de un elemento.

Pero hay veces que, por la razón que sea, es imposible, así que el desarrollador la inserta en el contenido de la página (por ejemplo, páginas maquetadas con tablas que quieren cumplir con algunos puntos de accesibilidad, o el nivel A, o cualquier otra razón…)

Es el mismo caso que cuando tenemos que insertar un estilo en línea con style=”…”. Son situaciones ocasionales pero ocurren.

Así que, como se ha dicho antes, lo que tenemos que hacer es que esas imágenes no incordien al usuario, aplicando un valor vacío al texto alternativo.

Un texto alternativo vacío (alt=”") NO es lo mismo que la ausencia de texto alternativo, algo que la gente suele confundir.

Los navegadores no muestran ningún error ni nada raro cuando se encuentran con un texto alternativo vacío.

Si lo que se aplica es un texto alternativo con un espacio (alt=” “), ya no es un texto alternativo vacío porque contiene un espacio y algunos lectores de pantalla, ante textos alternativos así, suelen hacer una pausa en la lectura. Así que hay que usarlos con cuidado, porque si hay 15 imágenes decorativas con alt=” ” antes de un elemento, el lector de pantalla parecerá que se ha quedado dormido…

Los que sí van a “cantar” ante un texto alternativo vacío van a ser los revisores automáticos de accesibilidad (hera, taw…) ya que te indicarán las imágenes a las que has aplicado textos alternativos vacíos y te pedirán que te asegures, en tu revisión manual posterior, de que esas imágenes realmente son decorativas.

Los navegadores sólo nos muestran un aviso si existe una imagen sin texto alternativo. Por ejemplo, un lector de pantalla avisará al usuario de que se ha encontrado una imagen sin texto alternativo, así que el usuario no sabrá jamás si la imagen contenía información importante o era decorativa. Incluso hay usuarios que configuran su navegador para que no les dé este tipo de avisos…

Una práctica habitual en accesibilidad, lamentablemente, es utilizar únicamente revisores automáticos de accesibilidad, así que algunos ponen a todas las imágenes textos alternativos vacíos y se quedan tan anchos, porque “pasan” esa validación automática.

Otra práctica hace justo lo contrario, se implementan por CSS imágenes que sí tienen contenido y para aplicarles (o simular) el “alt” se hacen mil burradas como poner un atributo “title” en el elemento “div” o en el que se le ha aplicado la imagen, y como valor de ese “title” se indica lo que debería ir en el “alt”… y esto es casi peor…

Y como también se ha dicho antes, utilizar textos alternativos para indicarle al usuario que se ha encontrado con una imagen decorativa, del estilo:

• alt=”imagen decorativa de una señora haciendo cola en el supermerdado”
• alt=”foto decorativa”
• alt=”esquina superior izquierda”
• …

tampoco es correcto, lo único que hacemos es aburrir al usuario y conseguir que nuestra página se le haga bastante cuesta arriba. Es aquí donde utilizaremos los textos alternativos vacíos.

Si la imagen tiene información, jamás puede ir como fondo, salvo que en esa imagen haya texto y entoces se utilice una técnica de reemplazo de texto y ésta sea accesible (porque recordemos que no todas las técnicas son accesibles del todo).

And that’s all folks!

Clasificado bajo: Estándares Web | Sin comentarios »

Textos alternativos vacíos Jueves, 30 de Noviembre de 2006

Muchas veces, cuando reviso páginas, me encuentro con textos alternativos en imágenes del estilo: “esquina superior derecha”, “barra de decoración”, “imagen decorativa”…

Como todos deberíamos saber ya a estas alturas, las imágenes que no aportan información al usuario deben llevar un texto alternativo vacío.

Problemas

El problema está cuando te encuentras que muchos usuarios entienden lo de texto alternativo vacío como una indicación clara para eliminar el texto alternativo. Y es todo lo contrario.

Una imagen debe llevar siempre el atributo alt. No sólo por accesibilidad, sino porque por definición tanto en HTML como en XHTML es obligatorio (al igual que siempre tenemos que poner el atributo src).

Mala comprensión

No es lo mismo un texto alternativo vacío, que la ausencia del texto alternativo.

Ausencia de texto alternativo significa que no va a existir el atributo alt.

Texto alternativo vacío significa que existirá el atributo alt pero con un valor vacío: alt="".

Podéis decir, ¿pero no es lo mismo?. Pues no (y punto).

El por qué

Si el atributo alt no existe, cuando un usuario que navegue sin carga de imágenes (por ejemplo) llegue a esa imagen, sabrá que hay una imagen, pero al no tener texto alternativo no podrá saber si se trata de una imagen decorativa o bien una imagen relevante, con información (algo que nosotros, como desarrolladores sí que sabemos).

Sin embargo, si utilizamos un texto alternativo vacío, alt="", cuando este usuario llegue a esa imagen, ni siquiera reparará en ella. Es decir, se hace transparente, ya que como no ofrece información, es como si no existiera.

Gazapos

A día de hoy me he encontrado los siguientes métodos para implementar un texto alternativo vacío:

• alt="vacío"
• alt=""""
• alt="&quote &quote"
• alt="comillas comillas"

Parece increible pero en 3 años y medio que llevo dedicándome exclusivamente a la Accesibilid Web he visto de todo y aunque os pueda parecer sorprendente (sobre todo el último caso), creedme que es cierto.

Recomendación final

Bien, ahora que no se os ocurra poner a todas vuestras imágenes un texto alternativo vacío, para así pasar los validadores automáticos, o toda la furia de los WAI’s caerá sobre vosotros.

Recordad que los profesionales serios revisamos a mano la accesibilidad, con lo cual no vais a poder engañarnos, así que sed niños buenos y trabajad correcta y honradamente.

Clasificado bajo: Estándares Web | 3 comentarios »