Roles ARIA: Regiones de puntos de referencia y nombres accesibles

Introducción

Al navegar con un lector de pantalla es importante definir los puntos de referencia, para que las personas usuarias encuentren una mejor navegación y experiencia de usuario. Para que se entienda mejor es conveniente poner nombres accesibles.

¿Qué es un punto de referencia?

Un punto de referencia o landmark roles son las grandes zonas para diferenciar las partes de un sitio web.

Pasos para identificar los puntos de referencia según WAI-ARIA 1.1.

Según la especificación WAI-ARIA 1.1 hay que seguir una serie de pasos para establecer los puntos de referencia:

  1. Identificar una estructura lógica:
    • dividir las áreas perceptibles de contenido
    • Dividir las áreas en subáreas cuando sea necesario
  2. Asignación de roles de referencia a cada área
    • Hay que asignar roles de contenido en función de su tipo.
    • banner,main, complementary y contentinfo deben ser los principales puntos de referencia de nivel. Se recomienda entre 5 y 7 puntos de referencia.
    • Los puntos de referencia se pueden anidar para establercer las etiquetas padre/hijo de la información que se presenta.
  3. Etiquetar áreas.
    • Si un área comienza con un elemento de encabezado(h1-h6), puede usarse como etiqueta para el área usando el atributo aria-labelledby.

Puntos de referencia

Banner: Cabecera

    • Un banner se situa en el comienzo de cada página de un sitio web. Se trata del logotipo de la empresa. Aparece en la parte superior de la página y abarca todo el ancho.
    • Si una página incluye más de un banner cada uno debe una etiqueta única.
    • La etiqueta <header> define un punto de referencia cuando el contexto es el elemento<body>
    • No se considera banner cuando desciende de cualquiera de los elementos: article, aside, main, nav, section.
  • Si <header> no usa la técnica de HTML se debe usar un role="banner" para definir un punto de referencia.

Complementario: complementary

  • Un complementario es una sección que está separada del contenido principal. Normalmente se suele identificar como las barras laterales en el sitio web.
  • Si el contenido complementario no está relacionado con el contenido principal, se le debe asignar una función más general (region).
  • Si incluye más de un complementary, cada uno debe tener una etiqueta única.
  • Si <aside> no usa la técnica de HTML se debe usar un atributo role=»complementary» para definir el punto de referencia.

Información de contenido: contentinfo

  • Un contentinfo es una manera de identificar información común en la parte inferior del sitio web, lo que generalmente se identifica como pie de de página o <footer>, incluida políticas de privacidad y accesibilidad y derechos de autor.
  • Cada página puede contener un contentinfo
  • El contentinfo debe ser de nivel superior.
  • Si incluye más de un contentinfo, cada uno debe tener una etiqueta única.
  • El elemento <footer> define un contentinfo cuando el contexto es el elemento <body>
  • No se considera <footer> cuando desciende de cualquiera de los elementos: article, aside, main, nav, section.
  • Si <footer> no usa la técnica de HTML se debe usar un atributo role=»contentinfo» para definir el punto de referencia.

Formularios: form

  • Un formulario es una región que se compone de elementos con diferentes controles y cada uno de ellos tiene una función determinada.
  • Un campo de formulario debe tener una etiqueta (<label>) para que las personas usuarias puedan entender de qué campo se trata y debe ser visible.
  • Para el campo de búsqueda se usa un input de tipo «search»
  • Si incluye más de un form, cada uno debe tener una etiqueta única.
  • Siempre que sea posible, los controles de formularios deben usar la semántica nativa: <button>, <input>, <select>, <textarea>.
  • El elemento form define un punto de referencia cuando tiene un nombre accesible. Por ejemplo: aria-labelledby, aria-label o title.
  • Importante: Usa role=»form» para identificar una region de la página, no para los campos de formularios. Los campos de formulario tienen su propia etiqueta y tipo.

Contenido principal: main

  • Un main identifica el contenido principal del sitio web.
  • Cada página debe tener un contenido principal y debe ser de niel superior.
  • Si una página incluye más de un main, cada uno debe tener una etiqueta única.
  • Si main no utiliza la técnica de HTML, usa un role=»main» para definir el punto de referencia.

Navegación: Navigation

  • Un navigation sirve para identificar diferentes grupos (listas o enlaces), que se van a utilizar para la navegación por el sitio web.
  • Para cada grupo de enlaces o listas similares, usa la misma etiqueta para cada uno de ellos.
  • Si una página incluye más de un navigation, cada uno debe tener una etiqueta única.
  • Si nav no utiliza la técnica de HTML, usa un role=»navigation» para definir el punto de referencia.

Región: region

  • Un region es una sección lo suficientemente importante como para que las personas usuarias naveguen por ella.
  • Un region debe tener una etiqueta.
  • Si una página incluye más de un region, cada uno debe tener una etiqueta única.
  • El elemento section define un punto de referencia cuando tiene un nombre accesible. Por ejemplo: aria-labelledby, aria-label o title.
  • Si section no utiliza la técnica de HTML, usa un role=»region» para definir el punto de referencia.

¿Cómo poner nombres accesibles?

Siguiendo la especificación WAI ARIA, existe una serie de características de nomenclatura por las que hay que establecer un nombre accesible.

  1. Contenido infantil
  2. Contenido con atributo con aria-label o aria-labelledby.
  3. Controles de formulario con elementos de etiquetas. <label>
  4. Conjuntos de campos con el elemento <legend>
  5. Tablas y figuras con subtítulos.
  6. Nombres de reserva derivados de títulos y marcadores de posición.
  7. Se describe haciendo referencia al contenido con aria-describedby. Tablas y figuras con subtítulos y descripciones derivadas de títulos.

Técnicas de nomenclatura

Hay una serie de técnicas para seguir la nomenclatura y adecuar nombres accesibles.

Contenido secundario

  • Es cuando un elemento tiene su nombre accesible a partir de su contenido. <a href="/">Home</a>, se identifica como la página de Inicio.
  • Los elementos que tienen uno de los siguientes roles son, por defecto, nombrados por una cadena calculada a partir de su contenido descendiente:
  • botón
  • celda
  • caja
  • encabezado de la columna
  • cuadrícula de celdas
  • título
  • enlazar
  • menuitem (el contenido contenido en un menuelemento hijo está excluido)
  • menuitemcheckbox
  • menuitemradio
  • opción
  • radio
  • fila
  • Rowheader
  • cambiar
  • lengüeta
  • información sobre herramientas
  • treeitem (se excluye el contenido incluido en un groupelemento hijo ).
    • En este último ejemplo, al tratarse de un elemento tipo árbol <tree>, hay dos casos especiales en los que se ignoran u omiten ciertos descendientes.
    •  losgroupdescendientes de elementostreeitem y los menudescendientes de elementosmenuitem.
      • Por ejemplo, a continuación tree, el nombre del primer elemento del árbol es Verduras; Se omiten la lechuga, el tomate y la cebolla.
    <ul role="tree">
      <li role="treeitem">Verduras
        <ul role="group">
          <li role="treeitem">Lechuga</li>
          <li role="treeitem"><Tomate</li>
          <li role="treeitem">Cebolla</li>
        </ul>
      </li>
    </ul>

Importante: Si un elemento con uno de los roles anteriores que admite la nomenclatura del contenido secundario se nombra usando aria-labeloaria-labelledby.Se recomienda usarlo en casos excepcionales.

Propiedad aria-label

La propiedad aria-label se usa para nombrar un elemento con una cadena que no se representa visualmente. Tenemos el ejemplo de un botón «Cerrar», es decir, no vale poner como nombre «Cruz» o «Equis», sino que tenemos que poner un nombre que sea comprensible para las personas usuarias.

La propiedad aria-labeles útil cuando no hay contenido de texto visible que sirva como un nombre accesible apropiado.

La propiedad aria-labelafecta a los usuarios de tecnología de asistencia en una de dos formas diferentes, según el rol del elemento al que se aplica. Cuando se aplica a un elemento con uno de los roles que admite la denominación del contenido secundario, como por ejemplo, el nombre que depende de un elemento concreto, (el subtítulo de una tabla, en donde el lector lee el subtítulo y el contenido de la tabla) aria-labeloculta el contenido descendiente de los usuarios de tecnología de asistencia y lo reemplaza con el valor de aria-label.

Sin embargo, cuando se aplica a casi cualquier otro tipo de elemento, las tecnologías de asistencia representarán tanto el valor aria-labelcomo el contenido del elemento. Por ejemplo, el nombre de la siguiente región de navegación es «Producto».

<nav aria-label="Producto">
<!-- Lista de navegación de Productos -->
</nav>

En ese caso, lector leerá «Región de navegación del producto», diciendo el nombre y el rol del elemento, y leerá los enlaces contenidos en esa región.

La propiedad aria-labelledby

La propiedad aria-labelledby es similar a la propiedad aria-label, pero aria-labelledby hace referencias a otros elementos para definir el nombre accesible, el cual depende del elemento anterior.

<span id="night-mode-label">Modo noche</span>
<span role="switch" aria-checked="false" tabindex="0" aria-labelledby="night-mode-label"></span>

El role switch funciona de manera similar a los campos de casilla de verificación (checkboxs) en donde se pueden marcar o no marcar las opciones, (sin marcar/marcado) pero en este caso funciona como un interruptor (activado/desactivado o encendido/apagado).


Esta propiedad es útil porque:

  • Tiene la mayor prioridad cuando los navegadores calculan nombres accesibles, es decir, anula los nombres del contenido secundario y todos los demás atributos de nomenclatura, incluidosaria-label.
  • Puede concatenar contenido de múltiples elementos en una sola cadena de nombre.
  • Incorpora contenido de elementos independientemente de su visibilidad, es decir, incluso incluye contenido de elementos con el atributohidden HTML, CSS display: noneo CSSvisibility: hiddenen la cadena de nombre calculada.
  • Incorpora el valor de los elementos de entrada, es decir, si hace referencia a un cuadro de texto, el valor del cuadro de texto se incluye en la cadena de nombre calculada.

Otro ejemplo con nombre accesible con la propiedad aria-labelledby es el siguiente:

  • Un botón de descargar PDF. El nombre para que sea accesible, deberá tener un espacio entre la extensión y el tamaño. «Descargar PDF, 3.5 MB»


PDF, 3.5 MB

Controles de formulario con el elemento de etiqueta y leyenda.

Es importante recordar que los formularios siguen siendo uno de los principales problemas de accesibilidad para las personas que usan lector de pantalla. Utilizan la etiqueta label, en donde cada uno de ellos cumple su función especifica según del tipo que sea.

Descripción de tablas y figuras con subtítulos.

El elemento caption se usa para descripciones largas en una tabla accesible. Por ejemplo, un encabezado podría servir como un nombre accesible apropiado, y el elemento captionpodría contener una descripción más larga. En tal situación, aria-labelledbypodría usarse tablepara establecer el nombre accesible para el contenido del encabezado y captionse convertiría en la descripción accesible.

Calendario de eventos

Calendario de eventos de los meses de noviembre y diciembre establecidos por días

Nombres alternativos derivados de títulos y marcadores de posición

Por ejemplo, en un campo de tipo radio donde se puede usar el atributo title para poner el título del formulario, en lugar de la etiqueta legend.



Redacción de nombres accesibles efectivos y fáciles de usar

Transmitir función o propósito.

  • Por ejemplo, si un icono que se parece a la letra X cierra un diálogo, nombrarlo Cerrar , no X . Del mismo modo, si un conjunto de enlaces de navegación en la barra lateral izquierda navega entre las páginas del producto en un sitio de compras, nombre el producto de la región de navegación , no a la izquierda .

Poner las palabras más distintivas e importantes primero.

  • Por ejemplo, si una lista de contactos muestra los botones Editar,Eliminar y Acciones para cada contacto, entonces Editar John Doe, Eliminar John Doe y Acciones para John Doe serían nombres mejor accesibles que John Doe edit,John Doe delete y John Doe acciones. Al colocar el verbo primero en el nombre, los usuarios del lector de pantalla pueden distinguir más fácil y rápidamente los botones entre sí, así como del elemento que abre la tarjeta de contacto para John Doe.

Sé conciso.

Para muchos elementos, de una a tres palabras es suficiente. Solo agregue más palabras cuando sea necesario.

NO incluya un nombre de rol ARIA en el nombre accesible.

  • Por ejemplo, no incluya el «botón de» en el nombre de un botón, «la imagen de» en el nombre de una imagen o la «navegación de» en el nombre de una región de navegación. Hacer esto crea una salida de lector de pantalla duplicada, ya que los lectores de pantalla transmiten el papel de un elemento además de su nombre.

Crea nombres únicos para elementos con el mismo rol a menos que los elementos sean realmente idénticos.

  • Por ejemplo, asegúrese de que cada enlace en una página tenga un nombre diferente, excepto en los casos en que varios enlaces hagan referencia a la misma ubicación. Del mismo modo, asigne a cada región de navegación de una página un nombre diferente a menos que haya regiones con contenido idéntico que realicen funciones de navegación idénticas.
  • Comienza los nombres con una letra mayúscula; ayuda a algunos lectores de pantalla a hablarlos con la inflexión adecuada. No termine los nombres con un punto; No son oraciones.

 

Accesibilidad: Móvil y videojuegos

Introducción

Escribo esta entrada porque he estado pensando en estos días varias cosas. Para empezar, es algo que siempre me he preguntado.

Accewsibilidad: móvil y videojuegos

Una de las cosas es que me parece muy triste, pero muy triste que en Whatsapp haya tropecientos modelos de familia: familias monoparentales, homosexuales, heterosexuales, con hijos, con perros, con gatos, con abuelos, de todo. Eso está muy bien, pero ya que estamos en el mes de la libertad, ¿Dónde están la banderas de la L y la B? Puede parecer una tontería pero no lo es. ¿Porqué tengo que pulsar tres corazones para representar la bandera tricolor pudiéndolo hacer sólo una vez? Mejoremos la usabilidad.

y aquí viene la pregunta: ¿Las personas en silla de ruedas, qué somos? ¿Monigotes? ¿Siluetas? ¿No sentimos?, ¿no lloramos?, ¿no reímos?, ¿no nos enamoramos?.

Como cualquier otra persona, también queremos vernos representadas ahí, también nos enamoramos, también podemos tener pareja e hijos, o un animal.

Entiendo que es una manera de representar un símbolo para determinar el derecho de las personas con diversidad funcional, o un certificado de discapacidad o una plaza de aparcamiento o un servicio adaptado. Pero somos algo más que un simple monigote: somos personas.

Y ya de paso aprovecho la entrada para comentar exactamente la misma situación en el mundo de los videojuegos: la representación de personas en sillas de ruedas es practicamente nula, por no decir nula. Hay muy pocos personajes con los que nos sintamos identificados.

Accesibilidad: Personajes con diversidad funcional en videojuegos

Yo cuando jugaba a videojuegos, el personaje de Bentley de Sly 2, para Play Station 2 va en silla de ruedas.

Sí, tengo la Play 2 y la primera XBox que salió y me pasaba las mañanas de verano jugando al «Prince of Persia: las Arenas del Tiempo», al «God of War», (estos dos, a veces, con ayuda de mi padre), y al «Sly», que jugaba sola. Me encantaba ese juego.

También está este pequeño vídeo de Mario Bros, que me encanta, nunca me canso de verlo. Es maravilloso.

O el juego de BloodBorne, donde aparece un cazador en silla de ruedas.

Huntsman de "BloodBorne"

Me ha venido a la mente otro juego, mucho más reciente: Overwatch, para Play Station 4. Lo ha creado el artista surcoreano Kirim Son. El juego consta de representación del colectivo LGTB, en los personajes de Soldado: 76 y Tracer, y de personas con diversidad funcional, el personaje de Sinaes, que es ciega y le acompaña su perro guía, y el personaje de Kjell Berg, un policía en silla de ruedas.

 

Accesibilidad videojuegos: personajes con diversidad funcional

Overwatch también trae opciones de contrastes de color para daltonismo.

Accesibilidad: Opciones de daltonismo en el juego Overwatch

Parece ser que va a haber una segunda parte de Overwatch.

La verdad es que poco a poco se van integrando más personajes con diversidad funcional en los videojuegos. Y es muy necesario por una sencilla razón: se ajusta más a la realidad de la sociedad. Hay que ir avanzando muchísimo en este tema y sobre todo, otro igual de importante o más: erradicar la cosificación de los personajes femeninos en los videojuegos. Se representa el típico personaje de una princesa a la que hay que salvar. También a mujeres sexys. Y se hace solo porque es rentable, porque atrae a los consumidores, porque es la estrategia de marketing que mejor funciona.

Acabar con los estereotipos sexistas

Por otra parte, hay que acabar con los estereotipos y comentarios sexistas que aguantamos las mujeres solo por jugar y por el hecho de serlo. Hay que dejar a las mujeres que demuestren su valía sin cuestionar su profesionalidad, ni sorprenderse porque le gane a un hombre. O comentarios como que los hombres genéticamente juegan mejor que las mujeres. Es una lucha constante.

Y para acabar, pido a toda aquella persona que se dedique al dibujo o al anime (en este último se ve algo más), intente ser más inclusivo que haga dibujos de personas en silla de ruedas. Que nos veamos representados también a través del dibujo. Y sobre todo, también para que se normalice la diversidad funcional en todos los ámbitos. Una pareja donde las personas estén en silla de ruedas. O uno de los dos. Dándose un beso o con un niño en brazos, algo. Algo normal. Que parece que solo estamos enfermos, de hospitales o practicamos deporte. O hacemos de todo, pero solos. Hay dibujos que están muy infantilizados.

Que es cierto que hay gente que está muy afectada, pero hay gente que con ayuda se pueden desenvolver solos y pueden llevar una vida normal.

En definitiva, que se hagan dibujos que evoquen sentimientos, emociones, que sean reales. Que sean realistas. Que somos personas como cualquier otra, que sentimos, con independencia de nuestro género, diversidad funcional, raza, y etnia.

Este es de los pocos que he encontrado.

Accesibilidad: Pareja en silla de ruedas a punto de darse un beso

accesibilidad: anime. Personajes en silla de ruedas

 

Ypor supuesto, es necesaria la visibilidad también en el mundo de la animación. Un ejemplo es el cortometraje «Cuerdas», basada en la historia de Nicolás, un niño con Parálisis Cerebral. En el año 2014 fue ganador de un Goya.

La historia es dura, pero hace pensar. En el mundo necesitamos más gente como su amiga María.

Accesibilidad web: Daltonismo y baja visión

Después de la entrada de los colores dejo aquí una demostración de cómo perciben el mundo las personas daltónicas.

Pruebas de color con simulador de daltonismo

Usando la herramienta Color Blidness Simulator, he decidido poner a prueba diferentes colores con respecto a los problemas de daltonismo que hay, para que tengáis un ejemplo visual de cómo se ven los colores. Este tampoco es mi caso.

He escogido una lista de los colores más problemáticos para el daltonismo. En este caso, he escogido (varios colores sobre blanco para visión normal). Hay que partir de ahí.

Aquí hay un ejemplo para cualquier persona sin problemas de visión respecto al color:

Amarillo, azul, rojo, verde, celeste, lila y naranja.

 

Una persona con protanomalia ve los colores así.

protanomalia

Una persona con deuteranomalia ve los colores así:

daltonismo: deuteranopia

Vamos con la tritanomalia:

daltonismo: tritanomalia

Así se perciben los colores con deuteranopia:

Daltonismo: deuteranopia

Vamos con la tritanopia. En este caso, rojo y verde se percibe igual:

daltonismo: protanopia

Hay personas que no perciben el color, y que tienen la visión monocromática.

daltonismo: visión monocromática

Monocroma de cono azul:

Daltonismo: monocromo de cono azulVuelvo a insistir, he escogido algunos, no todos, los daltónicos tienen su paleta de colores específica. Es importante decir que no se pueden poner un verde y un rojo porque un daltónico los ve iguales. Aunque algunos requieren un rojo vivo, porque lo identifican mejor.

En base a esto, que lo he puesto para que lo veais visualmente, he llegado a una conclusión:

  • El azul y el lila, como ya dije, una persona daltónica los ve muy parecidos. El rojo y el verde también.
  • A nivel general para las personas con ceguera al color, se recomienda utilizar un color intermedio: secundarios o terciarios.

Por otra parte, con la herramienta No Coffee Visión Simulator, disponible para Google Chrome, también podemos hacemos una idea de cómo ven las personas daltónicas un sitio web y se visibiliza mejor los colores que percibe. Es una herramienta que se debería poder usar en todos los navegadores. También se puede comprobar cómo lo verían las personas que tienen baja visión, (cataratas, glaucoma y otros), y es recomendable usar un contraste de blanco sobre negro. Así obtenemos un documento claro y legible para este grupo de personas a la hora de imprimirlo. Y para todos, claro.

Herramienta No Coffee Vision Simulator.

Usando la herramienta de Contrast Ratio barajando varios contrastes, por ejemplo:

 

Blanco sobre verde

contraste de blanco y verde

Blanco y rojo:

contraste de blanco y rojo

Un negro sobre azul no cumple contraste

negro y azul es mal contraste

Blanco y naranja, tampoco cumple contraste.

Mal contraste: blanco y naranja

Negro sobre naranja sí cumple contraste para los dos niveles: el doble A y el triple A.

buen contraste: naranja y negro

También se puede usar la herramienta Color Contrast Analyser, de The Pacciello Group, que es una herramienta muy útil. Federico Toledo ha compartido un artículo muy interesante y nos da unas buenas indicaciones para usar la herramienta. Está disponible para Windows y para MacOS.

También se puede usar la herramienta WCAG Contrast checker, para Firefox.

Como estamos hablando de accesibilidad y es para todo, es importante saber que a nivel de tecnología también entran los videojuegos: aquí he encontrado la historia de una persona daltónica que cuenta cómo es disfrutar de un videojuego, y las opciones de accesibilidad que tiene que tener: ellos lo agradecerán.

Hay que tener en cuenta que si son enlaces tienen que estar subrayados, porque no se debe transmitir información sólo con el color.

Filtros para la dislexia y estudios.

He descubierto un estudio que se ha realizado por investigadores brasileños y francesesde la la revista Research in Developmental Disabilities, en la que cuenta que un filtro de color verde podría mejorar la velocidad lectora de los niños disléxicos.

En el estudio se utilizaron filtros de color amarillo y verde, y se pidió a los 36 niños que leyeran libros infantiles adecuados para su edad. Los textos se mostraron en una pantalla de ordenador con un filtro amarillo, con otro verde y sin ningún filtro. Se seleccionaron 18 niños con dislexia y 18 sin ella.

En general, un niño con dislexia, tiene que fijar su mirada en las palabras durante más tiempo para comprender un texto, por lo que su velocidad de lectura es menor.

Sin embargo, el dispositivo de seguimiento ocular detectó una diferencia significativa para los niños con dislexia, que leían más rápido con el filtro verde, fijando su mirada en grupos de palabras durante 500 milésimas de segundo, en comparación con las 600 milésimas de segundo que utilizaban con filtro amarillo o cuando la lectura no tenía filtro.

En este sentido, los autores del estudio señalan que la mejora en el tiempo de lectura con la utilización del filtro verde podría deberse a cambios en los estímulos visuales disponibles para el procesamiento del sistema nervioso central.

En un estudio de 2015, una resonancia magnética mostró una activación significativa de la corteza cerebral durante la lectura con filtros en comparación a la lectura sin filtros. Los autores plantearon entonces la hipótesis de que los filtros pudieran reducir el estrés visual y la distorsión.

Ahora bien, ahora que conocemos un poco todo esto del color, he reflexionado que ahora la cosa está un poco más fácil a la hora de diseñar un logotipo porque conocemos las necesidades respecto al color: esa eterna pregunta de las personas que se dedican al diseño «¿Y qué color cojo?». En base a todo esto, ya tenéis una idea, a no ser que alguien requiera algo específico según su patología si la tiene. Para facilitarles la vida. Y por supuesto, algo que no puse en la entrada correspondiente que se me pasó, el logotipo también tiene que cumplir el contraste entre el color y fondo, que establece el criterio 1.4.11.

Por otro lado, decir que hay que tener en cuenta el gradiente que puede hacer que dificulte la legibilidad si se le pone un texto, un eslogan y no es recomendable.

Tipografía

También es importante tener en cuenta la tipografía que se lee en pantalla, porque las serifas no se leen tan bien como las Sans Serif. Todo depende del tamaño, peso o grosor de la tipografía y la tipografía en cuestión.

En cuanto a características de la tipografía, hay tipografías más legibles si se aumenta un poco el grosor. Se recomienda un tamaño entre 12 y 18 puntos. Es muy importante la legibilidad de la tipografía, el trazado, peso o grosor de la tipografía y el ancho del texto, ya que si tiene un ancho muy grande puede hacer muy difícil la lectura porque se hace pesado leer frases largas.

No se recomienda abusar de las mayúsculas porque pueden dificultar la lectura, sobre todo, para las personas ciegas, o dislexia.

Tipografías legibles

Varios ejemplos de tipografías legibles son aparte de las ya conocidas o mejor dicho, más utilizadas porque estamos acostumbrados a leerlas y las identificamos fácilmente, como son la Arial, Verdana, son las siguientes: Roboto, Open Sans, Ubuntu, PT Sans… A mí personalmente me gusta mucho la Roboto. Es una tipografía muy legible.

No se recomiendan algunas tipografías serifas porque en pantalla pueden dar problemas de legibilidad. Por ejemplo, EB Garamond, incrementada en pantalla un 170%, sigue sin leerse bien. Se ve pixelada.

Tipografía serifa no recomendada: EB Garamond

O  por ejemplo, esta otra:

Tipografía no legible

Tampoco se recomiendan tipografías que tengan un trazado díficil de leer o que las letras estén muy juntas, tipo Curlz, o Playbill y la Comic Sans.

Tipografías no recomendadas por su estilo

Hay algunas características que pueden ayudar a la legibilidad. Así que hay que tener en cuenta lo siguiente:

  • Prominentes ascendentes (por ejemplo la línea vertical en d).
  • Descensores prominentes (por ejemplo, la línea hacia abajo en y).
  • Una combinación d/b o p/q que no son una imagen exacta del espejo de uno a otro.
  • I, l minúsculas, mayúsculas y 1 debe tener diferentes características entre sí.
  • Evita fuentes que tienen espaciado de letra apretada, para no dificultar la lectura.

 

Accesibilidad web: Aprendiendo Braille

Introducción

Esta semana me ha picado un poco la curiosidad y he investigado sobre el Braille. Todo a raíz de ver y probar con el lector de pantalla. Cuando escribimos un número lo lee normal. Pero la duda me surgía cuando se trata de fórmulas. ¿Cómo las interpreta?

Es curioso cómo te hace ver un mundo diferente y te hace empatizar y ver todo lo que las personas invidentes luchan para estar en estar en igualdad de condiciones con los demás.

La verdad es que me ha impresionado y es bastante chulo. Es trabajar la memoria constantemente y tener una capacidad de memorización impresionante. Pero es como todo, al final es aprenderlo y acostumbrarse.

Historia y antecedentes del braille

Os voy a contar un poco la historia de cómo Louis Braille inventó el sistema de lectoescritura para personas ciegas que conocemos hoy en día.

Louis Braille nació en 1809 y a los tres años se clavó un punzón en el ojo en el taller de armaduras de su padre. La herida se le inflamó y le pasó también al ojo sano y a los cinco años se quedó ciego.

Louis aprendió el abecedario y las tablas de multiplicar pero tenía un problema: no sabía qué forma tenía todo lo que aprendía; ni letras ni números.

Pero en 1749, el escritor francés Denis Diderot ideó un plan para reducir la discriminación que había entre la comunidad ciega: escribió una carta en la que proclamaba mejores condiciones de vida para todas estas personas. Hasta ese momento, los ciegos se dedicaban a fabricar cepillos y cestas. Claro, este hecho movilizó a toda Francia.

Más adelante, en 1785, el pedagogo Valentín Haüy creó el primer sistema de escritura, que se basó en la escritura en relieve. Consistía en escribir las letras invertidas sobre papel grueso. Un sistema que podían leer personas videntes y no videntes.

Cuando Louis ingresó en el colegio en 1819 como interno en el Instituto Nacional para Jóvenes Ciegos de París y devoraba los pocos libros que existían con escritura en relieve.

Por otro lado, dos años más tarde, el capitán de artillería Charles Barbier le presentó al director un código de puntos que permitía a los soldados leer mensajes en la oscuridad.

La idea de Barbier consistía en un sistema de coordenadas de seis filas y dos columnas: 12 puntos, basándose en los 36 sonidos de la lengua francesa. Su invento lo llevó al colegio y lo probó con sus alumnos, pero a ellos se les hacía muy difícil hacerlo con los dedos. Quisieron modificar el sistema de Barbier y él se enfadó y se fue.

Entonces ante este panorama, Louis Braille recordó que tenía un dado que le fabricó su padre años antes. En cada cara del dado tenía un máximo de 6 puntos, que es la cantidad máxima que puede ser percibida por las yemas de los dedos. Con ese recuerdo de su padre se dedicó a reinventar el sistema Braille y en dos años lo terminó.

También era organista y aplicó su sistema a la notación musical.

El Braille

Louis Braille fue muy inteligente y creó un sistema muy fácil de memorizar.

Para las letras de la «a» a la «j», que son las 10 primeras del abecedario, se usan sólo los 4 puntos de arriba. Desde la «k» a la «t» se usan combinaciones con el punto de abajo a la izquierda, es decir, el correspondiente al número 3. Y para el resto de las letras, combinaciones que incluían el punto de abajo a la derecha, que corresponde al número 6.

Con los números representó cada uno de ellos, del 0 al 9 con una matriz previa, y las combinaciones de puntos correspondientes de la «a» a la «j».

En total, se generan 63 combinaciones diferentes. Son suficientes para el alfabeto y caracteres especiales franceses. Diversos países fueron agregando los caracteres que ellos utilizaban y que les faltaban. Y en 1878 en un congreso en París se convirtió en el sistema internacional de escritura para las personas invidentes.

En España son 64 caracteres porque se le añade la letra ñ.

¿Cómo es el Braille?

El cajetín o signo generador se compone de seis celdas numeradas del 1 al 6. Para la lectura se lee la primera fila y luego la segunda. Para la escritura es al revés. Eso es para situarnos.

El signo de número tiene su signografía específica y se representa con una almohadilla.

Breaille: cajetín o signo generador

Abecedario en braille

En el braille, para las diez primeras letras, se usan los 4 puntos de arriba y su signografía es la siguiente.

Para las siguientes diez letras, se le añade el punto 3, abajo a la izquierda.

Braille: signografía de la k a la t

Para las letras u, v, x i griega y z se le añade el punto 6, de las letras correspondientes de la k a la o.

La eñe, la uve doble y la u con diéresis se crearon después. Hay que recordar que el alfabeto es francés.

braille: de la u a la z

Vocales acentuadas y mayúsculas

Para las vocales acentuadas tienen su propia signografía. Y para las mayúsculas ta,mbién tiene su propio signo.

Braille: vocales acentuadas y mayúsculas

Los números en braille

En braille, para los números se representa con una almohadilla como signo de número, y los números 1 al 9 y el 0 se representan con la signografía de las 10 primeras letras del abecederio.

Es decir, el uno corresponde a la letra a, el 2 a la b, y así sucesivamente. El 0 corresponde con la letra j.

braille: números del 1 al 4

braille: números del 5 al 8

En la parte de abajo he puesto un ejemplo, el número 736, que se representa de esa forma: siempre se pondrá antes del número, el signo de número.

braille: signografía del 9 y el 0 y un ejemplo de un número

Operadores matemáticos básicos y signos de puntuación

Operadores: suma, resta, multiplicación, división e igual.
Signos de puntuación: punto, coma, punto y coma, dos puntos y guión.

braille: Operadores matemáticos y signos de puntuación

Editor matemático braille

En este editor matemático, creada por José María Fernández, se escribe la fórmula normal y te devuelve el resultado en braille.

Por ejemplo, si tenemos en cuenta la expresión x al cuadrado en matemáticas: a la hora de escribir el circunflejo hace referencia a un número «elevado a la potencia», o lo que es lo mismo, un exponente.

Como podéis observar, la lectura en braille es diferente, y el número lo transcribe como letra.

EXpresión matemática de ASCII a braille.

Editor científico EDICO

La ONCE junto con la Universidad Complutense de Madrid han creado el editor científico (EDICO) que permite a las personas ciegas trabajar las matemáticas, la física o la química y usar todo tipo de fórmulas. En versiones posteriores quieren incluir la estadística y las matemáticas financieras.

Es una herramienta  preparada para que el profesor le enseñe la materia al alumno sin necesidad de que conozca el sistema de lectoescritura. Es bidireccional, y de esta forma, el profesor también la puede visualizar en pantalla de forma estándar.

Apps para aprender braille

He encontrado una aplicación móvil para aprender braille, Brailliac: Braille Tutor, y está disponible para Android y para iOs.

App Brailliac: aplicación móvil para aprender braille

21 apps accesibles para invidentes o personas con baja visión: Xataka

Por aquí, dejo la noticia de una tablet para invidentes: Xataka.

Y por aquí dejo un traductor braille online

 

Accesibilidad web: Contrastes de color

Introducción

Uno de los principales problemas que hay de accesibilidad web son los contrastes.

Hay muchas personas que tienen problemas para leer en pantalla, por lo que, si no se tienen en cuenta los problemas de contraste pueden dificultar la legibilidad y ocasiona un problema de accesibilidad.

Accesibilidad web: contrastes de color

Contrastes

Si nos remitimos a las WCAG existen cuatro criterios que nos permiten trabajar el color y los contrastes.

Por un lado, tenemos:
El criterio 1.4.1 Uso del color.

  • «El color no es el único medio para transmitir la información, indicar una acción, solicitar una respuesta o distinguir un elemento visual.

Por otro lado tenemos el criterio 1.4.3 Contraste mínimo.

  • «La presentación visual de texto e imágenes de texto tiene una relación de contraste de al menos 4.5:1»
  • Texto grande: «El texto a gran escala y las imágenes de texto a gran escala tienen una relación de contraste de al menos 3: 1;

Por último está el criterio 1.4.6. Contraste mejorado.

  • La presentación visual de texto e imágenes de texto tiene una relación de contraste de, al menos, 7:1, excepto en los siguientes casos.
  • Textos grandes: Los textos de gran tamaño y las imágenes de texto de gran tamaño tienen una relación de contraste de, al menos, 4.5:1.

Hay personas que tienen sensibilidad reducida al contraste. Esto implica que si no se le pone un contrasto alto, puede originar un problema de lectura y por lo tanto de accesibilidad. Y otras personas que tienen baja visión, que requieren un contraste de blanco sobre negro.

También hay personas con daltonismo, las cuales sufren ceguera al color, especialmente al rojo y verde. A las personas con dislexia les molesta la luz, por lo que se recomienda un blanco que no sea puro, pero siempre tiene que cumplir lo que establece la normativa de accesibilidad.

¿Qué quiero decir con esto?

Muy sencillo. Hay que utilizar contrastes altos. Bien, hasta ahí todo claro.

Código hexadecimal de colores. Por ejemplo:

  • Negro puro es #000000
  • Blanco puro es #ffffff

Es tan sencillo como ir probando y comprobando que cumple el ratio, tanto el máximo como el mínimo que establece las WCAG.

Algunos de los contrastes de los que aquí hablo se pueden poner también a la inversa. Y jugar con ellos sin problema. Todos los rangos elegidos son ejemplos, no necesariamente hay que usar sólo los colores propuestos.

Todo esto que voy a contar a partir de ahora sobre la dislexia lo cuento a modo de información. Es para entender mejor a las personas con dislexia, pero no es mi caso.

  • El gris fuerte sobre blanco también vale porque no es el contraste fuerte de blanco sobre negro, que es más dañino para la vista. 
  • Y un gris claro sobre negro.
  • O un color crema sobre negro. El caso es rebajar la luz de una manera u otra, o bien de un lado o bien de otro.

Y más teniendo en cuenta que estamos una población envecejecida y como consecuencia de la edad surgen más problemas.

También se puede dar el caso de que la persona en cuestión quiera imprimir el documento, por lo que tiene que tener buena legibilidad en papel, un contraste blanco sobre negro.

Por otra parte, el gris fuerte sobre blanco es muy legible y más cómodo para cuidarnos la vista. Esto se puede aplicar (si queremos), como opción de lectura de alto contraste para móvil y ordenador. Se puede usar como una opción más de accesibilidad para quien le pueda servir.

O también con la posibilidad de tener las letras o palabras del teclado predictivo en móvil en celeste. Es otra buena opción.

Mi intención es meterlos a todos, sin distinción.

Diferentes tipos de contrastes y su explicación.

Vamos a empezar a emprezar con contrastes altos y buenos: aquí tenemos un blanco sobre negro. Este contraste es bueno para las personas con baja visión y les ayuda a que el documento sea legible para ellos.

Contraste bueno: blanco sobre negro sobre negro

Como podemos observar este es un contraste alto, entre un blanco y un gris fuerte. Sólo para algunas zonas de la web, como el pie de página

buen contraste: gris fuerte y blanco

Tanto un contraste como el otro se puede poner perfectamente.

Otro tipo de contraste bueno para la dislexia sería gris claro sobre negro:

Contraste bueno: gris claro sobre negro

Otro tipo de contraste alto sería un negro con la tipografía de color naranja.

contraste bueno: negro y naranja

Otro contraste más: Color crema sobre negro. Este contraste es bueno también para la dislexia.

Contraste bueno: crema sobre negro

Otro contraste de color que cumple las WCAG. El amarillo y el negro. Solo esto. Un daltónico un amarillo sobre blanco no lo percibe, y los que tenemos visión normal tampoco, sobre todo, por legibilidad.

Para las personas con ceguera al color, como los daltónicos, se recomienda un color intermedio.

Contraste bueno: amarillo sobre negro.

Otro más: Buen contraste ente el color celeste y negro.

Accesibilidad web: contraste bueno de celeste y negro

Otro ejemplo más sería: Un blanco y el violeta. Los daltónicos perciben el lila y el azul más o menos igual, aunque tienen su propia paleta de colores.

Violeta: #800080

Blanco: #ffffff

Contraste bueno: Blanco no puro y lila

 

O entre un azul oscuro y blanco. Este es un buen contraste porque el celeste sobre blanco no se ve, y es mejor un tono intermedio, o un poco más oscuro, como en este caso. Si le ponemos un celeste casi no lo perciben. El azul puro también lo perciben y es perfectamente accesible para un daltónico.

Accesibilidad web: azul no puro y blanco no puro

Buen contraste entre el verde claro y el negro.

Contraste bueno de colores: el verde claro y el negro

Ejemplos de mal contraste

Otro ejemplo, pero esta vez con un mal contraste sería este. De este contraste lo que quiero decir es que no se pude mezclar dos colores claros porque no se ven.

contraste entre azul claro y gris

Además, si os fijáis bien la legibilidad no es buena.

Lo mismo ocurre con este contraste de color entre dos colores claros. Y al revés tampoco se ve, es decir con fondo celeste y la letra blanca. No necesariamente tiene que ser así. Puede ser un poco más fuerte, porque un celeste de por sí, no se percibe. Y para los daltónicos son un problema porque tienen ceguera a los colores claros.

Mal contraste de color: Celeste y blanco no puro

O este otro.

Accesibilidad web: mal contraste entre gris y blanco

Antes de acabar, hay que mencionar el criterio 1.4.11 que hace referencia al contraste de color con imágenes, es decir, tratar los colores de la imagen y su contraste.
La presentación visual tiene una relación de contraste de al menos 3:1 contra el color o los colores adyacentes:

Componentes de la interfaz de usuario: información visual requerida para identificar los componentes y estados de la interfaz de usuario, excepto los componentes inactivos o donde el aspecto del componente está determinado por el agente del usuario y no es modificado por el autor. Por ejemplo, los botones de redes sociales o los checkboxs.

accesibilidad web: contraste delos componentes de la interfaz de usuario

Otro ejemplo más:

Accesibilidad web: Componentes de la interfaz

Diferente es si cuando se da la información no precisa sólo de color, sino que se le pone el nombre de la red social en cuestión. Ahí ya no requiere de contraste.

Objetos gráficos: partes de gráficos necesarios para comprender el contenido, excepto cuando una presentación particular de gráficos es esencial para la información que se transmite. Por ejemplo, algún símbolo de alerta.

Contrastes: Símbolo de alerta

Un problema muy común es cuando intentamos navegar con el teclado y el foco no se ve, no se aprecia bien. No porque no esté puesto, sino puede darse el caso de que no haya buen contraste entre el fondo y el color del foco.

mal contraste entre el fondo y el color del color

También se puede usar la herramienta de Lea Verou para calcular la ratio, y se puede probar con diferentes tipografías, cambiando los colores y contrastes, y usar hsla, rgba, y código hexadecimal.

En definitiva, trabajar con el contraste es cuestión de sentido común y lógica. Hay que utilizar siempre contrastes altos.

 

Accesibilidad: Derechos de las personas con parálisis cerebral

Introducción

Esta semana os traigo un vídeo de la Federación Aspace donde se explica lo que es la ciudadanía activa y el promover el ejercicio de nuestros derechos, así como conocer los derechos que corresponden a las personas con diversidad funcional, entre ellas la parálisis cerebral.

convención de derechos de las personas con diversidad funcional

Convención de derechos de las personas con diversidad funcional

Artículo 3 Principios generales

Los principios de la presente Convención serán:

a) El respeto de la dignidad inherente, la autonomía individual, incluida la libertad de tomar las propias decisiones, y la independencia de las personas;

b) La no discriminación;

c) La participación e inclusión plenas y efectivas en la sociedad;

d) El respeto por la diferencia y la aceptación de las personas con discapacidad como parte de la diversidad y la condición humanas;

e) La igualdad de oportunidades;

f) La accesibilidad;

g) La igualdad entre el hombre y la mujer;

h) El respeto a la evolución de las facultades de los niños y las niñas con discapacidad y de su derecho a preservar su identidad.

Artículo 9 Accesibilidad

1. A fin de que las personas con discapacidad puedan vivir en forma independiente y participar plenamente en todos los aspectos de la vida, los Estados Partes adoptarán medidas pertinentes para asegurar el acceso de las personas con discapacidad, en igualdad de condiciones con las demás, al entorno físico, el transporte, la información y las comunicaciones, incluidos los sistemas y las tecnologías de la información y las comunicaciones, y a otros servicios e instalaciones abiertos al público o de uso público, tanto en zonas urbanas como rurales. Estas medidas, que incluirán la identificación y eliminación de obstáculos y barreras de acceso, se aplicarán, entre otras cosas, a:

a) Los edificios, las vías públicas, el transporte y otras instalaciones exteriores e interiores como escuelas, viviendas, instalaciones médicas y lugares de trabajo;

b) Los servicios de información, comunicaciones y de otro tipo, incluidos los servicios electrónicos y de emergencia;

2. Los Estados Partes también adoptarán las medidas pertinentes para:

a) Desarrollar, promulgar y supervisar la aplicación de normas mínimas y directrices sobre la accesibilidad de las instalaciones y los servicios abiertos al público o de uso público;

b) Asegurar que las entidades privadas que proporcionan instalaciones y servicios abiertos al público o de uso público tengan en cuenta todos los aspectos de su accesibilidad para las personas con discapacidad;

c) Ofrecer formación a todas las personas involucradas en los problemas de accesibilidad a que se enfrentan las personas con discapacidad;

d) Dotar a los edificios y otras instalaciones abiertas al público de señalización en Braille y en formatos de fácil lectura y comprensión;

e) Ofrecer formas de asistencia humana o animal e intermediarios, incluidos guías, lectores e intérpretes profesionales de la lengua de señas, para facilitar el acceso a edificios y otras instalaciones abiertas al público;

f) Promover otras formas adecuadas de asistencia y apoyo a las personas con discapacidad para asegurar su acceso a la información;

g) Promover el acceso de las personas con discapacidad a los nuevos sistemas y tecnologías de la información y las comunicaciones, incluida Internet;

h) Promover el diseño, el desarrollo, la producción y la distribución de sistemas y tecnologías de la información y las comunicaciones accesibles en una etapa temprana, a fin de que estos sistemas y tecnologías sean accesibles al menor costo.

Artículo 21

Los Estados Partes adoptarán todas las medidas perti-nentes para que las personas con discapacidad puedan ejercer el derecho a la libertad de expresión y opinión, incluida la libertad de recabar, recibir y facilitar información e ideas en igualdad de condiciones con las demás.

a) Facilitar a las personas con discapacidad información dirigida al público en general, de manera oportuna y sin costo adicional, en formatos accesibles y con las tecnologías adecuadas a los diferentes tipos de discapacidad;

b) Aceptar y facilitar la utilización de la lengua de señas, el Braille, los modos, medios, y formatos aumentativos y alternativos de comunicación y todos los demás modos, medios y formatos de comunicación accesibles que elijan las personas con discapacidad en sus relaciones oficiales;

Derechos de las personas con parálisis cerebral

Ángeles Blanco, jurista asesora de la Fundación CERMI Mujeres, cuenta que es importante conocer la Convención de derechos de las personas con discapacidad, ya que el Estado está obligado a implantarlo en nuestro Ordenamiento Jurídico. Porque se está incumpliendo la normativa en muchos aspectos y los colectivos más afectados son el de Parálisis Cerebral y el de la diversidad funcional intelectual.

En el vídeo aparecen personas en la que explican sus problemas en determinados ámbitos de la vida cotidiana, en lo que hay que mejorar y que aún queda mucho por hacer.

Estos son algunos de los derechos de los que se habla en el vídeo.

  •  Artículo 5 Derecho a la igualdad y a la no discriminación.
  •  Artículo 27 Derecho al empleo.
  • Artículo 25 Derecho a la salud

Y cuentan cosas como estas:

  • Una persona cuenta que le impidieron acceder a una discoteca con sus amigos y el portero les prohibió la entrada.
  • Otra persona dice que fueron a la playa y que los vecinos decían que le iban a pegar una enfermedad.
  • Un usuario comenta que las empresas no se preocupan por contratarnos. Que hacemos las prácticas y así ya dicen que colaboran con la diversidad funcional o discapacidad.
  • También otra persona usuaria de silla de ruedas, con dificultad para moverse, cuenta que se encuentra con problemas a la hora de hacerse revisiones médicas por no estar la consulta adaptada.

Yo un día tuve que ir hacerme una radiografía de la boca porque me tenían que quitar una muela y el aparato donde me la hice era incómodo. Tenía que estar de pie porque la silla no entraba en la consulta.

Por otro lado también se habla de:

  • El tema de la infatilización y de la sobreprotección que tiene el entorno familiar con estas personas, cosa que hace que dificulte el desarrollo de las personas y la convivencia.
  • El 90% de las esterilizaciones forzosas se realizan a mujeres.
  • 1 de cada 3 mujeres se ven afectadas por la violencia de género.

Hay que destacar la importancia del empoderamiento de las personas con Parálisis Cerebral para que puedan tener una mejor integración en la sociedad y puedan tener una mayor autonomía.

Y aprovecho esta entrada para decirlo, ya que estamos que estamos hablando de la Convención. Con las declaraciones de David Suárez se han vulnerado los siguientes derechos, que el CERMI ha denunciado:

  • Artículo 16. Protección contra la explotación, la violencia y el abuso
  • Artículo 17. Protección de la integridad personal

El CERMI denuncia ante la Oficina de Delitos de Odio de la Policía las agresiones verbales en redes de David Suárez contra las personas con discapacidad

 

 

Accesibilidad web: Características de la lectura fácil

Introducción

Como ya sabemos, hay personas con diversidad funcional cognitiva como el Sindrome Down, dislexia, TDAH, autismo, disculcalia, a las que les cuesta leer y comprender el contenido de un texto. Por todo esto se recomienda que escribamos contenido fácil de comprender para hacerlo más ameno.

También será sencillo para las personas sordas prelocutivas. Al tener dificultades para hablar si tienen una pérdida auditiva muy grande, les es difícil comprender un texto complejo.

Accesibilidad web: Características de la lectura fácil

¿Cómo surge el movimiento de lectura fácil?

El movimiento de Lectura Fácil es relativamente reciente. Surge en Suecia en la década de los 60, donde se crea la Fundación Centrum för Lättläst junto con la IFLA iniciaron un proyecto para organizar y promover la elaboración de este tipo de material, documentos gubernamentales como leyes, decretos y documentos normativos.

Actualmente, este grupo promueve e implanta proyectos para el uso del lenguaje sencillo y claro en los que ha involucrado a más de la mitad de las instituciones gubernamentales suecas.

¿Qué es la Lectura Fácil?

La Lectura Fácil es una forma de escribir y hacer la información más sencilla para las personas con dificultades de comprensión lectora. No sólo en el lenguaje sino también en la presentación del texto.

Se pueden definir diferentes niveles de adaptación.

  • nivel 1 (más sencillo): con muchas ilustraciones y poco texto, con una complejidad sintáctica y lingüística baja.
  • nivel 2: incluye vocabulario y expresiones de la vida cotidiana.
  • nivel 3 (el más complejo): con texto más largo, con algunas palabras poco usuales y con sentido figurado.

Preguntas para llevar a cabo la lectura fácil

En el documento de Oscar García Muñoz «Métodos de redacción y evaluación» se dan una serie de preguntas  para facilitar los objetivos de la lectura fácil.

¿Por qué quiere producir información en Lectura Fácil?

  • ¿Qué quiere contar a las personas con dificultades lectoras?
  • ¿Necesitan conocer esta información las personas con dificultades lectoras?
  • ¿Quiere implicar a personas con dificultades lectoras en una consulta?
  • ¿Va a consultarles sobre una política o proyecto que afecte a sus vidas?

¿Para quién se hace el texto en Lectura Fácil?

Tenemos que tener en cuenta el público al que nos dirigimos:

  • ¿Debe llegar la información a personas en una reunión específica donde todos se pueden conocer y tener una comprensión común de los asuntos fundamentales?
  • ¿Es información para un gran grupo de gente de todo el país?
  • ¿Conoce ya las necesidades de comunicación del público objetivo?

¿De qué manera emplean la información las personas con dificultades lectoras?

  • ¿Lo leerán una sola vez o lo consultarán más veces? Hay que pensar que dependiendo de la situación en que la que se encuentre lo utilizará una o más veces.

¿Es la Lectura Fácil el formato más apropiado para la ocasión?

  • ¿Es la Lectura Fácil el mejor medio de comunicación para su mensaje o información?

Pautas y recomendaciones para la elaboración de documentos en Lectura Fácil (UNE 153101:2018 EX)

Esta Norma nos ayuda y nos guia en la creación y adaptación de documentos de calidad en Lectura Fácil, documentos dirigidos, como hemos visto, a un público muy amplio que por diferentes circunstancias tiene dificultades lectoras.

El proceso tiene dos fases: la fase de adaptación y de validación. La norma incluye un anexo informativo con ejemplos de actividades para la fase de validación, que es una fase fundamental del proceso.

Explicación en un gráfico: las diferentes fases de la lectura fácil

Características de los textos en Lectura Fácil

Vocabulario

  • Utiliza palabras sencillas y habituales. Evita las palabras muy largas o con sílabas difíciles. Evita frases hechas, refranes, ironías y metáforas.
  • Utiliza palabras adecuadas para los lectores del documento.
  • Si necesitas usar palabras difíciles, utiliza glosas y glosarios para explicarlas.
  • Si usas palabras con varios significados que suenan igual que otra palabra, asegúrate de que el contexto las explique.
  • Evita las palabras de otro idioma a menos que sean muy conocidas.
  • Evita las siglas y las abreviaturas, a menos que sean muy conocidas y las expliques.
  • Utiliza la misma palabra para describir el mismo objeto o cosa en todo el documento.
  • Evita las palabras que no tienen un significado claro.
  • Evita palabras que acaban en “mente”.

Signos de puntuación

  • Evita escribir palabras o frases enteras con letras mayúsculas.
  • Utiliza los 2 puntos delante de una lista con más de 3 palabras o frases.
  • Evita signos raros y poco habituales. Como ( ) % & … ; “ ”
  • Evita la palabra etcétera, puedes utilizar otras palabras como «muchos más» o «y otros».

Números

  • Para escribir las fechas, escríbelas completas añadiendo el día de la semana. Es más facil de entender. Escribe los números en cifras.
    • viernes, 5 de octubre de 2018
  • Los números grandes pueden ser difíciles de entender:
    • podemos utilizar “más de 6.000” en lugar del número 6.525.
  • Evita las fracciones y los porcentajes.
    • Diríamos “algunos” en lugar de un porcentaje como “14%”.
  • Evita los números ordinales.
  • Evita los números romanos. Si tienes que usarlos, explícalos.
  • Separa los números de teléfono en números más pequeños.
    • Para el lector de pantalla es más cómodo escribir en números más pequeños. He probado con NVDA y un número de teléfono compuesto por 9 cifras sin espacios, 600521460 lo lee en millones. Es preferible poner y más cómodo de recordar: 600 521 460 o  separar las 6 últimas cifras de 2 en 2: 600 52 14 60.

Frases

  • Utiliza frases sencillas y cortas. Pon una idea por frase.
  • Asegúrate de que está claro a quién se dirigen. Deja claro sobre quién escribes.
  • Usa la voz activa. Puedes utilizar el presente para hacer los verbos más sencillos.
  • Evita los gerundios.
  • Evita usar 2 o más verbos juntos.
  • Utiliza frases positivas en vez de frases negativas. Evita 2 frases negativas juntas.
  • Evita las explicaciones con comas dentro de una frase.

Organización del texto

  • Escribe la información necesaria.
  • Organiza la información en el tiempo. Explica primero lo que sucede al principio y sigue la historia en orden. Para hacerlo más claro, puedes utilizar palabras como: antes, después o siguiente.
  • Dirígete al lector y habla con él siempre que puedas.
  • Pon junta la información sobre el mismo tema y organiza los temas con espacios en blanco entre las frases.
  • Utiliza títulos que expliquen de qué habla el documento.
  • Organiza las listas con viñetas.
  • Escribe los diálogos al estilo teatral. Es decir, con un guion. Asegúrate de dejar claro quién habla.

Presentación del documento

  • Empieza cada capítulo en una página nueva.
  • Divide el texto en capítulos y apartados. Evita dividir todo el documento en apartados muy pequeños.
  • Evita escribir en vertical.
  • Intenta que las líneas acaben en el mismo sitio más o menos.
  • Utiliza un interlineado 1,5 como mínimo. Utiliza márgenes amplios también.

El índice

  • Coloca el índice al principio de tu documento.
  • Deja claro en qué página está cada apartado. Puedes utilizar rayas.

Tipografía y formato

  • Utiliza un tipo de letra sin adornos (sin serifa o sin remate).
  • Evita las letras con adornos, en cursiva, subrayadas, con sombras, o que no se leen bien.
  • Utiliza un tamaño de letra Arial 14 como mínimo. El tamaño puede ser diferente según el tipo de letra.
  • Utiliza un color de letra que se vea bien sobre el fondo de la hoja.
  • Alinear las frases a la izquierda que en el centro o a la derecha de la página. No justifiques el texto.
  • Nunca separes una palabra con un guion entre 2 líneas.
  • Cuando no queda claro dónde termina el texto, indica que el texto continúa en la siguiente página.
  • Pon el número de página más grande que el texto. Ponlo en un lugar que se vea bien y siempre en el mismo sitio de la página.
  • Diferencia los títulos del texto. Puedes utilizar tamaños o colores diferentes.
  • Puedes utilizar negrita para señalar las palabras que explicas en glosas.
  • Evita escribir sobre imágenes y fondos con varios colores y tonos, porque dificulta la legibilidad.
  • Si el documento tiene partes que no están en Lectura Fácil, avisa al lector.
  • Contraste adecuado entre el color del fondo del texto y de los caracteres.
  • Elige cómo vas a colocar las páginas de tu documento y colócalas todas igual: en horizontal o en vertical.

Imágenes

  • Utiliza imágenes claras y concretas para que sean fáciles de interpretar. Asegúrate de que tienen calidad y se ven bien. Intenta usarlas en color.
  • No utilizar imágenes ni dibujos como fondo de texto, porque dificulta la lectura y la legibilidad
  • Utiliza la misma imagen en todo el documento para representar la misma idea.

Glosas

  • Coloca la glosa la primera vez que se utiliza la palabra difícil en tu documento.
  • Utiliza las glosas para explicar palabras difíciles e importantes.
  • Asegúrate de que la glosa está en la misma página que la palabra que explica.
  • Señala la palabra difícil en negrita en el texto y en la glosa. Diferencia la palabra difícil de la explicación. Puedes escribir la palabra en una línea y la explicación en otras.

Glosario

  • Utiliza un glosario para explicar las palabras. Ponlo al principio del documento. Coloca las palabras en orden alfabético. Puedes utilizar un título como «Diccionario»
  • Separa la palabra de su explicación. Puedes escribirla en negrita.
  • Utiliza ejemplos para explicar las palabras difíciles.

Resúmenes y repeticiones

  • Utiliza resúmenes en documentos muy largos. Repite la información importante cuando el lector necesite recordarla.
  • Coloca los resúmenes al final del apartado que resume.
  • Ayuda al lector a distinguir el texto principal del resumen o el recuerda. Puedes utilizar colores, formas, cuadros, rayas y otras cosas que se te ocurran.
  • Incluye ejercicios de memoria para trabajar sobre el texto.

Mapas y planos y gráficos

  • Pon un título o una explicación del mapa. También coloca una leyenda y explica de qué va el mapa. Haz lo mismo con los gráficos. Señala las cosas importantes
  • Marca itinerarios y caminos claros. Puedes utilizar fotografías reales.

Criterio de accesibilidad WCAG

El criterio «3.1.5 Nivel de lectura» establece lo siguiente: «Cuando un texto requiere un nivel de lectura más avanzado que el nivel mínimo de educación secundaria una vez que se han eliminado nombres propios y títulos, se proporciona un contenido suplementario o una versión que no requiere un nivel de lectura mayor a ese nivel educativo.»

Una de las técnicas suficientes es ofrecer una versión en Lectura Fácil (técnica G153)

Herramientas para lectura fácil

  • Simplext es una herramienta de  simplificación automática de textos para el español dirigido a personas con diversidad funcional intelectual. Permite facilitar la lectura de textos en base a la reducción de la complejidad léxica y sintáctica de los textos. Detecta las palabras y oraciones mas complejas y genera vocabulario más simple y oraciones más cortas.
  • Diccionario fácil Herramienta donde se adaptan definiciones en lectura fácil.
  • Adapro: Procesador de textos para personas con dificultades lectoras, como la dislexia.

¿A quién beneficia la lectura facil?

  • Personas con diversidad funcional intelectual.
  • Personas con dificultades del lenguaje hablado, como el Síndrome Down, la dislexia, o la afasia, la cual también se da en personas con Parálisis Cerebral y Daño Cerebral Adquirido.
  • Personas que no tengan desarrollado bien el lenguaje por tener problemas auditivos.
  • Personas mayores, personas con demencia
  • Personas extranjeras que no hablan el idioma.

 

Dicho esto, en en el documento de Óscar también se recogen las dificultades de grupos con patologías determinadas, entre ellas la Parálisis cerebral.

Pueden tener alteraciones del lenguaje y la comunicación, según la gravedad de la lesión, su localización, extensión y su momento evolutivo. Pueden tener capacidad intelectual normal o experimentar discapacidades de cualquier grado de leve a profunda. Presentan también
dificultades de atención y memoria.
Así mismo, tienen dificultades de habla, lenguaje y función comunicativa, y alteraciones neuromotrices que afectan a la musculatura respiratoria, fonatoria y articulatoria.
Sus esquemas de comunicación son pobres y limitados, tendiendo a reducirse la longitud de las frases. El vocabulario se reduce a contextos limitados, con dificultades para adquirir y manejar conceptos básicos, dificultades de comprensión de enunciados y, sobre todo, con sintaxis
compleja.

Se recomiendan intervenciones específicas de estimulación del lenguaje, la función comunicativa y el uso de ayudas técnicas con sistemas de comunicación aumentativa.

Referencias

Experiencia de usuario: Mapa de empatía

Introducción

Para entender el comportamiento de las personas, así como detectar sus necesidades, sus sentimientos y sus pensamientos, un mapa de empatía nos ayuda a comprender mejor a las personas usuarias.

¿Qué es una mapa de empatía?

Un mapa de empatía es una herramienta gráfica desarrollada por la consultora XPLANE que se utiliza para recopilar lo que sabemos sobre un tipo particular de usuario. se trata de:

  1. crear una comprensión compartida de sus necesidades
  2. ayudar en la toma de decisiones.

 

Mapa de empatía

 

El primer cuadrante «¿Qué piensa? y ¿Qué siente?» engobla todos los pensamientos, los sentimientos y las preocupaciones que la persona usuaria tiene y qué le importa, o por el contrario si esa persona se muestra reacia a algo, es decir, si algo que no le gusta. «Esto es molesto» o «Me confunde esto».

Lo que ve y lo que ve influye en el entorno que le rodea.

El cuadrante lo conforma «¿Qué dice? y ¿Qué hace?» incluye las acciones que realiza la persona usuaria.: Es lo que la persona usuaria dice en voz alta en una entrevista. Por ejemplo: «No entiendo qué hay qué hacer aquí».

Todos los cuadrantes sirven para impulsar nuestro conocimiento sobre las personas usuarias y para asegurarnos de que no omitimos ninguna dimensión importante.

Mapas de empatía de un usuario frente a múltiples usuarios

Los mapas de empatía pueden ayudar a los profesionales de UX a comprender qué aspectos de las personas usuarias conocen y dónde necesitarían reunir más datos.

También pueden coger a un usuario en particular o pueden reflejar la agregación de múltiples usuarios.

Los mapas de empatía de un usuario (individual) generalmente se basan en una entrevista de usuario o en el registro de un usuario de un estudio diario.
Los mapas de empatía agregados representan un segmento de usuarios, en lugar de un usuario en particular. Por lo general, se crean combinando múltiples mapas de empatía individuales de usuarios que exhiben comportamientos similares y se pueden agrupar en un segmento.

El mapa de empatía agregado sintetiza los temas que se ven en todo el grupo de usuarios y puede ser un primer paso en la creación de personas.

Los mapas de empatía agregada también pueden convertirse en formas de resumir otros datos cualitativos, como encuestas y estudios de campo. Por ejemplo, un mapa de empatía puede usarse para comunicar una persona, en lugar del enfoque tradicional de «tarjeta de presentación». A medida que se recopila más investigación sobre esa persona, puede regresar al mapa de empatía y agregar nuevos conocimientos o eliminar aquellos que han cambiado o se han invalidado.

¿Por qué usamos los mapas de empatía?

Los mapas de empatía deben usarse en cualquier proceso de UX para establecer un terreno común entre los miembros del equipo y para comprender y priorizar las necesidades de las personas usuarias. En el diseño centrado en el usuario, los mapas de empatía se utilizan mejor desde el principio del proceso de diseño.

Tanto el proceso de hacer un mapa de empatía como el artefacto terminado tienen beneficios importantes para la organización.

El proceso de mapeo de empatía ayuda a destilar y categorizar el conocimiento del usuario en un solo lugar. Se puede utilizar para:

  • Categorizar y dar sentido a la investigación cualitativa (notas de investigación, respuestas a encuestas, transcripciones de entrevistas a usuarios)
  • Descubra las lagunas actuales e identifique los tipos de investigación necesarios para abordarlo. Un mapa de empatía escasa indica que se necesita hacer más investigación.
  • Cree personas al alinear y agrupar mapas de empatía que cubren usuarios individuales

Comunicar un usuario o persona a otros.

Un mapa de empatía es una forma rápida y digerible de ilustrar las actitudes y comportamientos de las personas usuarias. Una vez creado, debe actuar como fuente de verdad en todo un proyecto y protegerlo de sesgos o suposiciones sin fundamento.

Recopilar datos directamente del usuario.

Cuando los usuarios completan los mapas de empatía, pueden actuar como una fuente de datos secundaria y representar un punto de partida para un resumen de la sesión del usuario. Además, el entrevistador puede recoger sentimientos y pensamientos del entrevistado que de otro modo habrían permanecido ocultos.

Objetivo final.

Derivado de las preguntas anteriores viene lo más importante. Debemos comprender sus miedos y sus valores, averiguar qué obstáculos debe superar, qué es lo que le motiva y lo que le frustra, y escribirlo también en el mapa.

  • ¿Qué le frustra?

Tenemos que saber cuáles son sus preocupaciones porque no le salen las cosas como les gustaría a esas personas

  • ¿Qué le motiva?

Tener una motivación siempre ayuda a las personas usuarias a crecer y a sacar sus mejores virtudes.

 

 

 

Accesibilidad web: Los captchas no son accesibles

Introducción

Los captchas se inventaron para proteger los sitios web del spam. Sin embargo, al igual que la invención bien intencionada de la fusión nuclear, los captchas también tuvieron algunos efectos secundarios poco éticos y destructivos.

Accesibilidad web: Los captchas no son accesibles

Sabemos que los captchas son inaccesibles para las personas con diversidad funcional. Son una lucha constante que no acaba nunca.

En el artículo de Hampus Sethfors «Captchas Suck» se describe por qué los captchas apestan y qué podemos hacer en su lugar.

Introduciendo el mal

A nadie le gustan los captchas. En el mejor de los casos, son un paso irritante y destructor que las personas usuarias deben superar. En el peor de los casos, pueden ser un completo obstáculo para las personas.

Aquí hay uno:

captcha de google donde se pide que se seleccionen las cuadrículas con nombres de calle

Los captchas son seriamente inaccesibles

Imagina que has pasado lo que sentiste como una eternidad llenando un formulario. Finalmente llegas al final y encuentras esta pregunta.

Demuestra que no eres un robot. Haga clic en los animales en la imagen de abajo.

Captcha donde aparecen animales pintados

No puedes ver ningún animal, pero afortunadamente encuentras un botón de «Dame un nuevo desafío». Haz clic en él.

Demuestra que no eres un robot. Resuelve este simple problema de matemáticas:

captcha para resolver un problema matemático

Esta es una experiencia bastante precisa de cuántas personas con diversidad funcional experimentan los captchas.

Y hablando de problemas matemáticos las personas con dificultades de aprendizaje, una suma tan simple como «21 más 42», puede resultar complejo a la hora de resolverlo. También puede darse el caso de que nos encontremos con personas con problemas cognitivos que sean incapaces de realizar esa operación matemática. 

Para las personas con diversidad funcional visual, estos tipos de captchas de imagen generalmente son imposibles de resolver, al ser totalmente visuales:

captcha para seleccionar las fotos que contengan flores

Para las personas con dislexia u otros problemas de lectura, las imágenes borrosas de texto ondulado pueden ser imposibles de resolver.

captcha con letras y caracteres ilegibles

No, el nuevo ReCAPTCHA de Google no es lo suficientemente bueno

Es posible que hayas encontrado el captcha «No soy un robot»:
No es tan malo como los captchas estándar. Pero sigue siendo malo. Las personas con tecnologías de asistencia como los lectores de pantalla a menudo informan que se clasifican como un bot y necesitan resolver un captcha inaccesible y regular.

No, la alternativa de audio no es lo suficientemente buena.

Muchos captchas ofrecen una alternativa de audio. Puede ser muy, muy difícil escuchar el mensaje, ya que tiene que estar lo suficientemente distorsionado para que las computadoras no puedan entenderlo.

Otro problema con el captcha de audio es que el icono para cambiar al captcha de audio generalmente es muy pequeño y difícil de encontrar. Las personas que usan lectores de pantalla también tienden a tener problemas a medida que el audio comienza a reproducirse antes de encontrar el campo para ingresar el texto.

Razones por las cuales los captchas no son buenos

Por eso los captchas excluyen a muchas personas con diversidad funcional. Esta debe ser la única razón por la que necesitas cuestionar seriamente su existencia. Pero veamos otro problema serio: es un asesino de tasa de conversión.

Todos luchamos con los captchas, no solo las personas con diversidad funcional. Muchas personas usuarias han realizado pruebas A / B y han demostrado cómo afectan las tasas de conversión.

Webnographer realizó una prueba de usabilidad donde solo el 62 por ciento de los usuarios completaron Captcha en su primer intento. El 23 por ciento tuvo dificultades para realizar múltiples intentos antes de tener éxito, pero el 15 por ciento se rindió por completo.

Eso, para la mayoría de las organizaciones, significa menos ingresos. Otra razón increíble para cuestionar seriamente los captchas.

Reemplaza el captcha con una alternativa accesible.

Hay formas de verificar a las personas usuarias sin usar un captcha. Aquí hay un ejemplo que permite omitir el captcha:

captcha

Lo mejor del documento es que acaba el artículo con un poema dedicado a los captchas. No tiene desperdicio. Lo llama «el Voldemort de la web». Y le doy toda la razón.

Accesibilidad web: Uso de la x y la arroba para lectores de pantalla

Introducción

Me he decidido a escribir esta entrada sobre el comportamiento de los lectores de pantalla debido a las dudas que hay en relación a por qué afecta la lectura a través de esta tecnología de asistencia si aplicamos el lenguaje inclusivo. Es una duda que se ha repetido ya muchas veces, y esta vez lo escribo en un post para que quede claro.

Hablando en términos generales: eliminar la carga de género

Así hablando en términos generales, mucha gente utiliza la x y la arroba para hablar de manera inclusiva. Incluso con la x o la e, la utilizan para que las personas pertenecientes al colectivo de  Gais, Lesbianas, Bisexuales y Transgénero (LGTB), principalmente las personas trangénero, no se sientan excluidas. Al utilizar la x o la e presenta una dificultad a la hora de leer esas palabras en un lector de pantallas. A fin de cuentas, tenemos que hablar de PERSONAS, y por ahí es una buena manera de empezar a cambiar la forma de expresarnos.

x y arroba para lectores de pantalla

Otra cosa diferente pero también importante, es el uso sexista del lenguaje, en el que se emplea el masculino genérico. Por lo tanto, si se trata de generalizar y de hablar para la gente, para el público en general, lo mejor es eliminar la carga de género, siempre que se pueda. Intenta escribir frases cortas, porque así es más fácil pensar un poco y darle las vueltas a las cosas para que todo el mundo se sienta incluido. Hacer esto nos sirve para darnos cuenta de la riqueza lingüística que posee nuestra lengua. Si nos adaptamos y nos acostumbramos a esto, llegará un momento en que nos saldrá solo, sin pensar.

Las normas para evitar el masculino genérico:

  • El relativo que ha de evitarse cuando le preceda un artículo masculino singular o plural (el o los). Se podrá sustituir por «quien» o por el genérico «persona».

Ejemplos:

El que se haya matriculado, deberá pagar unas tasas (sexista).

Quien se haya matriculado, deberá pagar unas tasas (no sexista).

La persona que se haya matriculado, deberá pagar unas tasas (no sexista).

De la misma manera se procedería con el plural.

  • Cuando se trata de los indefinidos «uno», «alguno» y sus plurales, se sustituirán por el genérico «persona» o se aplicará un procedimiento que sea igualitario.

Ejemplos:

Unos se matricularon y no pagaron tasas (sexista).

Unas personas se matricularon y no pagaron tasas (no sexista).

Algunos se matricularon y no pagaron las tasas (sexista).

Algunas personas se matricularon y no pagaron las tasas (no sexista)

Por ejemplo, si hablamos de dar la bienvenida a la web:

«Bienvenidos a mi web de accesibilidad y usabilidad»

Si queremos eliminar la carga de género lo podemos poner así: «Te doy la bienvenida».

Otro ejemplo: Cuando se trata de un grupo de varias personas que forman un equipo de trabajo, hay mucha gente que pone: «Sobre nosotros». Se puede sustituir por: «El equipo» o «Quiénes somos».

La documentación que aquí expongo es bastante interesante para echarle un vistazo. No puedo poner más ejemplos porque se me hace muy largo el post.

Uso de la x y la arroba para lectores de pantalla

Volviendo al tema que nos incumbe, que es lo que nos preocupa: el uso de la x y el uso de la arroba.

Teniendo en cuenta el ejemplo anterior, ya en el documento nos especifica el por qué no es recomendable la arroba para referirse a ambos géneros (el masculino y el femenino). Setrata de una práctica mal utilizada por la gente para no discriminar y por rapidez a veces, pero realmente no es correcto. Y por supuesto, para las personas que usan que usan lector de pantallas es un problema de accesibilidad.

Que quede claro también: la arroba se utiliza para hablar de las redes sociales y para los correos electrónicos.

Para empezar nos encontramos con tres fórmulas específicas para escribir en la web. La primera de ellas es la fórmula de saludo.

Para el lector de pantallas, la arroba la identifica como tal, y la lee como tal.

Información donde se aplica un uso no sexista del lenguaje a la hora de saludar

Otra es la fórmula de contacto.

Y aquí, las alternativas que hay:

Usar la forma de contacto sin lenguaje sexista

Y también tenemos la fórmula de acceso a un área personal. Aquí volvemos a tener el problema de la arroba. En este caso como alternativa no sexista nos da la opción de «persona usuaria». Tengo que decir que esta alternativa la he usado ya en mi web a la hora de escribir los artículos.

Fórmula de acceso a un área personal

Análisis de otro tipo de lenguajes no textuales

empleo de lenguaje no sexista en lasimágenes

empleo de lenguaje no sexista en el contenidos multimedia, enlaces y el nivel de los contenidos

Ejemplos de webs con un uso sexista del lenguaje o con problemas de accesibilidad

Aquí investigando, he elegido varias webs al azar en donde pueda haber problemas de este tipo.

Nos encontramos con la web de la Escuela Oficial de Idiomas de Pamplona, donde hay una Zona de Usuarios. Se puede sustituir por «Área de acceso privado», «Área privada» o «Área personal».

zona de usuarios de la Escuela Oficial Idiomas Pamplona

Dentro de esta web en el apartado de contacto, hay un problema de usabilidad. Siempre conviene recordar cómo hacer formularios usables.

problema de usabilidad en el formulario de contacto de la EOIP

 

Otro sitio web que presenta problemas es la de la Agencia Tributaria. En la imagen se muestra a una mujer y el mensaje es «así mejoramos todos», por lo tanto, no es muy acorde con la fotografía.

agencia tributaria

Y la forma de contacto tampoco es correcta:

contacte

Otro ejemplo con un problema de accesibilidad es la web de la Asociación Gallega de las Personas con Síndrome de Asperger. Utilizan la arroba para referirse a las personas usuarias.

Asociación gallega de las personas con síndrome de asperger. Usan la arroba para referirse a las personas usuarias. Es un error de accesibilidad para los lectores de pantalla

Y así, podría enumerar miles de ejemplos más que te puedes encontrar por internet.

Para terminar, las WCAG en el criterio 3.1.4 se trata el tema de las abreviaturas. «Se proporciona un mecanismo para identificar la forma expandida o el significado de las abreviaturas.» Es difícil entender una abreviatura, por lo que desaconsejan su uso.

Pruebas con NVDA

Por ejemplo, con NVDA, con Windows 7 y Firefox 66.0.5:

En cada una de las palabras dice: «Error de ortografía»

  • la abreviatura hijos/as la lee «hijos barra as».
  • Si escribiéramos «hij@s», lee «hij arroba ese».
  • Y la palabra «Ellxs», la lee Ells.

Es decir, tanto la x como la arroba y las barras son un problema para la accesibilidad de los lectores de pantalla.

Números de teléfono

Para el lector de pantalla un número de teléfono compuesto por 9 cifras sin espacios, 600521460 lo lee en millones.

Es preferible poner las cifras en bloques de tres y así es más cómodo de recordar: 600 521 460 o también separar las 6 últimas cifras de 2 en 2: 600 52 14 60.

Emoticonos

Los emoticonos son carácteres tipográficos, por lo que, cuando usamos las redes para expresar emociones a través de ellos, estamos fastidiando a la persona que usa lector de pantalla. Imaginaos que ponemos 4 veces el icono de las manos aplaudiendo, pues el lector lee 4 veces «manos aplaudiendo». Es muy pesado y hace que la persona deje de leer.

Por otro lado, tampoco se pueden simular caras con signos de puntuación. El lector al simular una cara, lee «punto y coma cerrar paréntesis». Si podemos evitarlo, mejor.