Índice de contenidos
1 – Introducción
Un lector de pantalla es un programa que interpreta el contenido que hay en la pantalla de tu ordenador (texto, imágenes, botones, etc.) y lo representa de una manera no visual, normalmente mediante voz o con una salida braille.
Durante estas últimas semanas he estado iniciándome en el mundo de la accesibilidad web y una de las cosas que he aprendido es a usar un lector de pantalla. Por comodidad he decidido no instalarme ningún programa y usar VoiceOver, el lector de pantalla que viene de serie en los ordenadores de Apple. En este artículo aprenderemos a dar los primeros pasos con este lector de pantalla y daré mis impresiones como usuario que nunca había usado un lector de pantalla.
2 – Primeros pasos
Para iniciar VoiceOver sólo tenemos que pulsar Comando + F5. Se nos abrirá una pantalla de bienvenida en la que oiremos por primera vez la voz robótica del lector de pantalla, que nos invita a hacer un tutorial de la herramienta. Si ya sabemos usar VoiceOver podemos saltarnos este tutorial presionando la tecla v. Nosotros, como todavía no sabemos usarlo, pulsaremos espacio e iniciaremos el tutorial. A partir de ahora empezarán una serie de pantallas de aprendizaje entre las que podemos navegar presionando las teclas de dirección derecha e izquierda.
Para usar un ordenador usando solamente el teclado tendremos que aprender unos cuantos atajos de teclado. El primero que aprenderemos es que, para utilizar los comandos de VoiceOver, tenemos que presionar las teclas Ctrl + Alt junto con una o más teclas. Esta combinación de teclas se abrevia normalmente como “VO”. Por ejemplo, si nos piden presionar VO + K, tendremos que pulsar Ctrl + Alt + K. Si la combinación de VO por defecto, Ctrl + Alt, nos resulta incómoda, podemos cambiarla por la combinación de teclas que nosotros queramos. A mí, personalmente, me parece una combinación bastante cómoda.
En la página 5 tenemos el primer ejemplo de navegación por contenido, usando VO + las teclas de dirección. Navegaremos por un formulario en el que nos encontraremos con unos botones de radio, varias casillas seleccionables y un par de botones. A mi, la primera navegación me resultó bastante complicada hasta que entendí que tenía que pulsar siempre la tecla de VO, ya que si pulsas solamente derecha en vez de VO + derecha, navegas hacia la siguiente página del tutorial en vez de navegar por el formulario de ejemplo. En mi caso me resultó especialmente frustrante ya que estuve varios intentos hasta que me dí cuenta de esto y, cada vez que navegas entre páginas del tutorial, se activa el dictado por voz a un ritmo lento y la tecla de VO permanece desactivada hasta que no acaba de leer todo el texto que hay en la página.
En la página 6 del tutorial aprendes a cambiar los ajustes de la voz de VoiceOver, usando VO + Comando + Shift y las teclas de dirección. Con las teclas derecha e izquierda navegamos entre las diferentes opciones (velocidad, entonación, etc) y con las teclas de arriba y abajo cambiamos los valores de estas opciones. Yo me he quedado con los valores por defecto de todo excepto la velocidad del dictado, que la he aumentado a un 70%.
En las páginas siguiente nos enseñan a interactuar con diferentes elementos de los formularios, como cajas de texto, listas de elementos y diferentes selectores. Lo principal que tenemos que aprender aquí es a entender cómo el lector de pantalla nos muestra los diferentes elementos y que para presionar un elemento tenemos que hacer VO + espacio. También veremos cómo interactuar con una “caja” que tiene varios botones dentro. Para interactuar con los botones de dentro de la caja, tenemos que entrar en ese elemento haciendo VO + Shift + abajo. Una vez hayamos acabado de interactuar con este elemento podemos salir haciendo VO + Shift + arriba.
3 – Aprender a navegar por la web
Navegar por la web con el lector de pantalla es muy similar a navegar por el texto que hemos ido practicando en el tutorial. Es importante señalar que el lector de pantalla está optimizado para funcionar en Safari y que, en otros navegadores como Chrome, tendremos una experiencia menos completa.
Yo empecé con el siguiente formulario de ejemplo de Mozilla en el que tenemos 3 botones de radio, varios campos de texto y un menú desplegable. Es una página muy buena para aprender a usar formularios ya que lo único que tiene es el formulario y no tenemos que preocuparnos de otros detalles de la navegación web.
A continuación empecé a practicar con el tutorial para desarrolladores de la w3c. Esta página es perfecta para aprender a navegar, ya que está bien estructurada y pensada para poder ser utilizada por lectores de pantalla con comodidad. VoiceOver nos ofrece multitud de maneras de navegar por una página web, y a continuación explicaré las que más uso.
Pulsando VO + Shift + derecha/izquierda podemos navegar por los diferentes bloques de contenido de la página (banner, main, navegación e información). Cuando estemos en el bloque que nos interese podemos usar VO + Shift + abajo para “entrar” en los contenidos de este bloque. A partir de ahora podemos navegar secuencialmente usando VO + derecha/izquierda. Podemos también saltarnos bloques de contenido al igual que hemos hecho antes con VO + Shift + derecha/izquierda. Al principio puede resultarnos un poco lioso pero una vez que nos hemos acostumbrado se convierte en una manera muy natural y rápida de navegar por la página.
Otra manera que nos ofrece VoiceOver para navegar por la web es el rotor, que se activa pulsando VO + U. El rotor nos agrupa contenido similar y secciones de la página para navegar rápidamente a la parte que nos interese. Usando las flechas de dirección izquierda y derecha navegamos entre las diferentes opciones (links, cabeceras, formularios, zonas destacadas, etc) y pulsando arriba y abajo accedemos a los elementos de la opción que tengamos seleccionada. Por ejemplo, en el tutorial para desarrolladores de la w3c podemos pulsar VO + U para abrir el rotor, pulsamos derecha hasta llegar a la sección de links y pulsamos abajo 8 veces, hasta llegar al link a las WCAG 2.0. Si pulsamos espacio se nos moverá el foco a la zona de la página donde está ese link. Ahora podemos usar VO + derecha/izquierda para leer el texto que rodea a este link o pulsarlo usando VO + espacio.
Ahora que sabemos los comandos fundamentales para navegar, yo lo que hice para aprender, y lo recomiendo mucho, es bajar el brillo de la pantalla al mínimo o apagarla y navegar usando sólo el teclado y el dictado por voz. Al principio nos costará un poco pero, como ya estamos familiarizados con la página, al cabo de poco tiempo navegaremos con bastante fluidez por la página.
Cuando ya nos sintamos cómodos navegando por esta web el siguiente paso que recomiendo tomar es acceder a una web con más contenidos y que nos sea familiar como, por ejemplo, un artículo de Wikipedia. Aquí podremos aprender a navegar por una web completa, que tiene texto, imágenes, secciones de contenido, artículos relacionados, etc y una estructura más compleja que la página anterior. En concreto recomiendo usar Wikipedia ya que es una web en la que se nota que se han tomado en serio la accesibilidad y no nos va a costar navegar por ella.
El último paso que podemos tomar para finalizar este tutorial introductorio a los lectores de pantalla es apagar la pantalla e intentar navegar por la web en la que pasemos más tiempo al día y que conozcamos a la perfección cómo funciona. Puede ser nuestra red social favorita, la página en la que trabajamos, google o la que sea, pero es importante que la conozcamos bien. Esto es importante ya que, por desgracia, hay muchas páginas en las que no se ha pensado en la accesibilidad y navegar por ellas usando sólo el lector de pantalla puede ser bastante complicado o incluso imposible.
4 – Conclusiones
Los primeros pasos me costaron bastante, ya que nunca había usado ninguna tecnología específica de accesibilidad y me pasé casi un día entero hasta que logré navegar más o menos cómodamente por páginas webs sencillas. En concreto, el tutorial que ofrece Apple la primera vez que usas VoiceOver, no me gustó mucho por resultarme demasiado lento (aunque también es cierto que soy bastante impaciente) y preferí lanzarme a la aventura y navegar directamente e ir aprendiendo sobre la marcha.
Ahora que llevo ya varias semanas usando el lector de pantalla de Apple casi a diario, me he acostumbrado y soy capaz de navegar con cierta fluidez por páginas bien diseñadas. Para navegar por páginas poco accesibles, que por desgracia son muchas, acabo usando el ratón porque no soy capaz de navegar por ellas bien y me puede la impaciencia de hacer las cosas rápido.
VoiceOver es muy cómodo para dar los primeros pasos, ya que viene instalado de serie y es cómodo no tener que instalarte un programa y poder probar directamente, pero, por desgracia, no puedo recomendarlo para un uso más frecuente. Esto es por varias limitaciones y errores que me ha dado el programa. El más bloqueante de todos es que, a veces, todos los ajustes que hemos hecho a la herramienta desaparecen y se vuelven a poner los valores por defecto y es imposible cambiarlos a no ser que reinicies tu ordenador. Esto me resulta muy molesto ya que, en los valores por defecto, el sintetizador de voz tiene un ritmo bastante lento y para cada elemento de la pantalla te da una descripción larga en vez de una breve. Esto hace que tarde más del doble de tiempo en hacer lo que quería en comparación con la configuración personalizada que suelo usar.
Para un uso más frecuente, como estoy haciendo yo ahora, recomiendo usar algún otro lector de pantalla. Aprenderemos a usarlo muy rápido ya que su uso básico es muy similar a lo que hemos aprendido en esta introducción usando VoiceOver.
Para terminar me gustaría señalar que, a partir de ahora, un lector de pantalla va a estar siempre presente en mi lista de herramientas al hacer desarrollo web, al mismo nivel que un debugger o un buen IDE. De hecho recomendaría a cualquier desarrollador front-end usarlo también, ya que es una herramienta que nos permite ver con rapidez si la página que estamos haciendo está bien diseñada o no. Si abrimos nuestro lector de pantalla y no somos capaces de navegar con fluidez por nuestra página es que algo no estamos haciendo bien. Además nos permite ver rápidamente si tenemos algún error en los textos alternativos de una imagen o en los títulos de los links, entre otras muchas cosas.
