Tutorial de Teach Access para un HTML accesible

WebAIM publicó un informe que analiza la accesibilidad de las principales páginas web de un millón de sitios web, llamado The WebAIM Million este señaló.

• El 97.8% de las páginas de inicio tenían fallas detectables de WCAG 2.
• 5 de los 6 problemas principales se debieron únicamente a HTML incorrecto (falta de texto alternativo, enlaces vacíos, etiquetas de entrada de formularios faltantes, idioma de documento faltante).

Una organización llamada Teach Access está ayudando a crear contenido para corregir estos errores. Teach Access es un grupo de empresas de tecnología (incluidas Apple, Google, LinkedIn, Adobe y Microsoft) que prepara a los diseñadores, ingenieros e investigadores para que piensen y construyan de manera inclusiva. Para ello entre una de sus medidas ha sido el crear un tutorial

PDF accesibles directamente desde Microsoft® Office

Color y Contraste

Mientras crea su documento, asegúrese de que no está utilizando señales visuales (color, fuente, tamaño, estilo, ubicación en la página, etc.) como la única forma de transmitir información. Si utiliza el color, por ejemplo, como la única forma de indicar que algunos números en una tabla de datos son negativos, los usuarios de lectores de pantalla, así como las personas que miran el documento y tienen ciertos tipos de ceguera al color, van a pasar por alto el hecho de que Algunos números son negativos. Lo mismo vale si usa negrita o cursiva para indicar información. Los lectores de pantalla no anunciarán que el texto está en negrita o en cursiva y, aunque lo hicieran, es posible que las personas no sepan qué se estaba utilizando ese formato para transmitir. asegúrese de elegir colores que proporcionen suficiente contraste entre el primer plano y el fondo
Imágenes
Cuando se trata de incluir elementos gráficos en sus documentos, hay un par de cosas a considerar. La primera es la “colocación”. Cuando inserte una imagen o un gráfico, por ejemplo, en las opciones de “Ajuste de texto”, elija “En línea con el texto”. Si bien esto no necesariamente se presta para crear los documentos más hermosos, es una Detalle importante desde el punto de vista de la accesibilidad. Colocar estos elementos en línea con el texto ayudará a asegurar que se lean en el orden de lectura adecuado sin tener que corregir los problemas en el PDF (una tarea potencialmente más difícil).

En segundo lugar, proporcionar texto alternativo. Cuando un lector de pantalla encuentra una etiqueta de Figura en un PDF, le dirá al usuario que hay un gráfico en la página (literalmente dirá, "Gráfico"). Sin embargo, si no hay ningún texto alternativo, las personas que usan lectores de pantalla no sabrán qué es lo importante acerca de ese gráfico y por qué está ahí. Dependiendo de su versión de Word, su ubicación podría haber cambiado recientemente. Seleccione la imagen y luego, desde su menú contextual, elija "Formato de imagen", vaya a "Diseño y propiedades" y escriba su descripción (en el campo "Descripción", no en el campo "Título"). En las versiones más recientes de Word, seleccione la imagen, vaya a la pestaña
"Formato" en la barra de herramientas y seleccione "Alt texto" en la cinta.

Orden de lectura

Afortunadamente, si está creando su documento de una manera lógica, ¡es fácil corregir el orden de lectura! Solo recuerde colocar sus imágenes "en línea con el texto". Dicho esto, si desea formatear su texto en columnas, por ejemplo, use la funcionalidad de columna que Word proporciona. Evite utilizar cuadros de texto y barras laterales. Claro, pueden verse bien, pero presentan muchos escollos de accesibilidad que son difíciles de solucionar y que probablemente deban solucionarse en el PDF (que, como se mencionó anteriormente, puede ser mucho más difícil).

Listas

Del mismo modo, MS Word tiene una funcionalidad para hacer listas fácilmente. En la cinta de opciones de la pestaña Inicio, en el grupo Párrafo, seleccione la opción para crear listas con viñetas (desordenadas) o listas ordenadas (con números, letras y / o números romanos). Para el autor, la ventaja de usar la funcionalidad de lista, en lugar de escribir las viñetas (o números) a mano, es que Word formateará automáticamente sus listas para usted, dándoles un aspecto coherente y también creará el siguiente elemento de la lista automáticamente para usted a medida que escribe (cuando presiona Entrar). Desde un punto de vista de accesibilidad, el uso de la funcionalidad de lista permitirá a las personas que usan tecnología de asistencia saber que hay una lista como parte del contenido. Cuando un lector de pantalla está leyendo un documento a alguien y aparece en una lista, le dirá a la persona que hay una lista allí.

Tablas

Al crear tablas para datos en su documento, trate de mantenerlas lo más simples posible. ¡Son más fáciles de leer para todos, ya sea que se use o no la tecnología de asistencia! Sería mejor tener dos (o incluso tres) tablas simples en su documento que una tabla realmente compleja. Sin embargo, todos hemos visto esto, donde los autores están realmente orgullosos de sus tablas increíblemente complejas (y argumentan brillantemente organizadas). ¡El problema es que el autor es el único que realmente sabe lo que está pasando en la mesa! "KISS" adiós a esas mesas complejas y "¡Mantenlo simple, tonto!"
Otra cosa a considerar cuando se trata del diseño de la tabla es no permitir que las filas se dividan en una página. Esto puede ser confuso para las personas que tienen discapacidades visuales y tal vez utilizan una lupa de pantalla porque pueden no darse cuenta de que el contenido de una celda continúa en la página siguiente. Otra consideración visual es utilizar los bordes de las celdas (las líneas) en sus tablas. Las líneas son útiles, e incluso cruciales, para algunas personas que miran visualmente la mesa. Por supuesto, si tiene una tabla que abarca varias páginas, use la funcionalidad de Word para repetir los encabezados de las columnas en la parte superior de cada página. De esa manera, las personas no tienen que pasar las páginas de un lado a otro para saber en qué columna están. También, tenga en cuenta el orden de tabulación. Una vez que tu mesa está construida, coloque el cursor en la celda superior izquierda y luego navegue por la tabla con solo la tecla Tab del teclado. Si no se lee de forma lógica, en el orden que desee, debe volver a diseñar su tabla.

Comparación entre MS Word vs. CommonLook Office

Seiichi miyake el inventor japonés de pavimentación para invidentes

En 1965, SEIICHI MIYAKE quería ayudar a su amigo que estaba perdiendo la vista, y así, usando su propio dinero, comenzó a trabajar en la pavimentación táctil, originalmente conocida como bloques Tenji.

Se le ocurrieron dos diseños. Uno que incorporaba puntos elevados que alertaban a los ciegos de que se acercaban al peligro, como un cruce de carreteras. El otro tenía barras sólidas que indicaban guía a lo largo de un camino seguro. Las diferentes texturas permitieron a los ciegos sentirse a su manera con sus zapatos o un bastón, o con la ayuda de un perro guía.

Miyake esperaba que esto ayudara a las personas con discapacidades visuales a viajar con seguridad por las calles. Uno de los objetivos era asegurarse de que aquellos que no podían ver bien podían subirsé a un tren de manera segura.

En este día de 1967, una calle cerca de la escuela para ciegos de Okayama en Japón, presentó el ingenioso invento de Miyake. Luego se implementó en Japón y se hizo obligatorio en todas las estaciones de tren en una década. El pavimento táctil es ahora una característica de los paisajes urbanos de todo el mundo.
El pavimento también puede estar codificado por colores para ayudar a las personas con deficiencia visual. Los colores brillantes y contrastantes pueden advertir a las personas de un cruce de semáforos,

Color y la accesibilidad web

Diseño en escala de grises primero

Comenzar el diseño con color es un error bastante común entre los diseñadores. Si bien puede ser tentador completar el diseño con color, es mejor evitar esa tentación.

Combina los colores con la marca

Los colores de marca deben jugar un papel clave en la creación de una paleta de colores. Intenta usar los colores de tu marca en los diseños que diseñas.

Recientemente muchas marcas comenzaron a usar colores brillantes para su diseño. Los colores brillantes dan energía y una sensación de inmediatez.

La regla 60–30–10

El 60–30–10 es una regla muy simple para crear paletas de colores bien equilibradas. La idea es simple: cuando elige una nueva paleta de colores, el 60% de la paleta debe estar dedicada a un color (generalmente, es un color neutro), otro color (complementario) constituye el 30% de la paleta y un tercero El color (acento) se utiliza para el 10% restante del diseño.

La regla de maxima de 3 colores

“No uses más de tres colores en un atuendo, de lo contrario te verás como un payaso o un loro”.  Este es un consejo común que los estilistas personales dan a sus clientes. A menos que sea un experto en combinar colores, es mejor limitar la cantidad total de colores que utiliza en su diseño.
Si crees que tu diseño necesita más colores, intente utilizar variaciones más oscuras y claras de los colores ya seleccionados.

Utilizar generadores de paletas de color

Los generadores de paletas de colores simplifican la tarea de encontrar esquemas de color bien equilibrados. Aquí está una lista de generadores de paletas de color

Nunca use color solo para transmitir el significado

Aproximadamente el 8% de los hombres y el 0.5% de las mujeres se ven afectados por algún tipo de ceguera al color. Deuteranopia (ceguera de color rojo-verde) es la forma más común de ceguera de color. Dichos usuarios tienen dificultades para interactuar con la IU que usa solo el color para transmitir el significado (por ejemplo, usa el color rojo para entregar el estado de error).

Lookup, la nueva aplicación de Google que convierte el móvil en nuestros ojos.

Google últimamente está trabajando en hacer que Android pueda ayudar a personas con discapacidades. Lookup, la nueva aplicación de Google que convierte el móvil en nuestros ojos. La inteligencia artificial quiere demostrar que es mucho más que una palabra de moda, y para ello está mostrando su potencial en muchas áreas. Lookup es una nueva aplicación de Google cuyo objetivo es simple. Esta aplicación nos dirá lo qué es lo que está viendo la cámara de nuestro móvil. Esto es posible gracias a la inteligencia artificial aplicada al reconocimiento de imágenes.
¿Para qué sirve? Principalmente es una herramienta de accesibilidad, ya que permite que personas que no puedan ver puedan utilizar su Android como una especie de guía, indicando qué es lo que tienen al frente. El funcionamiento es así de sencillo. Apunta con la cámara y la aplicación te dirá lo que está viendo. De momento, esta aplicación sólo funciona en dispositivos Pixel y funciona únicamente en Inglés. Si entras en Google Play, lo más probable es que la tienda de Google te indique que la aplicación no está disponible en nuestro país. No obstante, si quieres descargar la aplicación y probarla puedes hacerlo descargando el archivo APK desde APKMirror.

Botones y tamaño adecuado

El estudio Interfaces de usuario de pantalla táctil para adultos mayores: tamaño de botón y espaciado encontró que los usuarios tenían la menor precisión táctil en botones que tenían menos de 42 píxeles. Los botones que tenían más de 72 píxeles también tenían baja precisión. La mayor precisión se encontró con botones entre 42-72 píxeles. Esto significa que 42 píxeles es el mínimo y 72 píxeles es el tamaño máximo de botón más óptimo para los usuarios. El tamaño de botón más preferido fue de 60 píxeles, que es aproximadamente la mitad del rango. El botón de 72 píxeles produjo la mayor precisión táctil y fue preferido por los usuarios más antiguos.
Cuando se utiliza una serie de botones, es importante indicar la prioridad. De esta manera, los usuarios saben qué acciones los llevarán al resultado más deseado. El seguir el estándar de tamaño de botón, puede indicar la prioridad de una manera efectiva.
La mayor precisión se encontró con botones entre 42-72 píxeles. Esto significa que 42 píxeles es el mínimo y 72 píxeles es el tamaño máximo de botón más óptimo para los usuarios. El tamaño de botón más preferido fue de 60 píxeles, que es aproximadamente la mitad del rango. El botón de 72 píxeles produjo la mayor precisión táctil y fue preferido por los usuarios mayores. Cuando se utiliza una serie de botones, es importante indicar la prioridad. De esta manera, los usuarios saben qué acciones los llevarán al resultado más deseado. Al seguir el estándar de tamaño de botón, puede indicar la prioridad de una manera efectiva. Ya no tiene que elegir un tamaño arbitrario y esperar que sea fácil de usar.

El ejemplo demuestra el uso del estándar de tamaño de botón para indicar la prioridad.

Botón de alta prioridad = 72 píxeles
Botón de prioridad media = 60 píxeles
Botón de prioridad baja = 42 píxeles

Los botones que los usuarios usan con más frecuencia ahora son más fáciles de detectar y tocar. Podrán tocarlo con un tiempo de reacción más rápido y una mayor precisión. Esto es especialmente útil si la atención del usuario se divide entre diferentes tareas.

Espaciado de botones

Cuando los botones estaban demasiado separados, los usuarios se movían hacia el objetivo táctil mucho más lento. Y cuando los botones estaban demasiado juntos, los usuarios tenían la menor precisión táctil.

El estudio concluyó que un intervalo de 12 a 48 píxeles es el espacio óptimo entre los botones.
Un botón más grande permite a los usuarios presionar su objetivo con precisión incluso cuando su dedo está ligeramente fuera del objetivo. Pero si están fuera del objetivo con un botón más pequeño, fallarán y presionarán un botón adyacente. Es por esto que los botones más pequeños necesitan más espacio que los botones más grandes.

Botones de texto

Por ejemplo, un botón de texto con una altura de 60 píxeles tendrá un ancho mayor que un botón con el icono de 60 píxeles, pero es tan fácil de tocar. De hecho, es más fácil de tocar porque el ancho más grande requiere menos precisión.

Nuevas ruedas motrices Alber e-motion M25.

Es uno de los pocos impulsores de potencia activa que se pueden adaptar individualmente para satisfacer todas las necesidades de conducción de cualquier persona que use una silla de ruedas manual. Cada rueda pesa solo 7,8 kg. El motor eléctrico e-motion es diferente a cualquier otro producto del mercado y es compatible con casi todos los modelos de sillas de ruedas y se puede adaptar en cualquier momento, la autonomía es de 25 km gracias a sus baterias de litio.
Más detalles del producto en la web de Invacare en Europa.

Apuntes del RD 1112/2018

23 de septiembre de 2019 y para todos los sitios web antes del 23 de septiembre de 2020

1. Este real decreto se aplica al sector público que comprende:
a) La Administración General del Estado.
b) Las Administraciones de las comunidades autónomas.
c) Las entidades que integran la Administración Local.
d) El sector público institucional, en los términos establecidos en el artículo 2.2 de
la Ley 39/2015, de 1 de octubre, del Procedimiento Administrativo Común de las
Administraciones públicas
e) Las asociaciones constituidas por las Administraciones, entes, organismos y entidades que integran el sector público.
También será de aplicación a la Administración
de Justicia.
El contenido accesible de los sitios web y de las aplicaciones para dispositivos
móviles incluye la información tanto textual como no textual, los documentos y formularios
que se pueden descargar, los contenidos multimedia pregrabados de base temporal, las
formas de interacción bidireccional, el tratamiento de formularios digitales y la
cumplimentación de los procesos de identificación, autenticación, firma y pago con
independencia de la plataforma tecnológica que se use.

EXCLUSIONES
Están excluidos de este real decreto y se regularán por su normativa específica los contenidos multimedia en directo y pregrabado de base temporal de los sitios web y aplicaciones para dispositivos móviles de prestadores del servicio público de
radiodifusión y sus filiales.

a) Formatos de archivo de ofimática publicados antes de la entrada en vigor de este
real decreto, salvo que los mismos sean necesarios para tareas administrativas activas.
b) Contenido multimedia pregrabado de base temporal publicado antes de la
entrada en vigor de este real decreto.
c) Contenido multimedia en directo de base temporal salvo lo dispuesto en otra legislación específica que obligue al respecto.
d) Servicios de mapas y cartografía en línea, siempre y cuando la información esencial se proporcione de manera accesible digitalmente en el caso de mapas destinados a fines de navegación.
e) Contenidos de terceros que no estén financiados ni desarrollados por el sujeto obligado ni estén bajo su control.
f) Reproducciones de bienes de colecciones del patrimonio que no puedan hacerse plenamente accesibles
g) Contenidos de extranet e intranet entendidos como sitios web accesibles únicamente para un grupo restringido de personas y no para el público en general.
h) Contenidos de sitios web y aplicaciones para dispositivos móviles que tengan la condición de archivos o herramientas de archivo por contener únicamente contenidos no necesarios para el desarrollo de cualesquiera tareas administrativas activas.

CUMPLIR:
norma EN 301 549 V1.1.2 (2015-04)
el 20/12/2018 se publicó en el Diario Oficial de la UE la EN 301 549 V2.1.2 (2018-08) equivalente a las WCAG 2.1, así que ya es oficial que los sitios de la AAPP deben cumplir con las WCAG 2.1 Ya se está trabajando en la versión 3.1.1 prevista para final de 2019.

RESUMEN:

El nuevo Real Decreto 1112/2018 solo deroga, los artículos 5, 6 y 7 del Real Decreto 1494/2007, que es el que establece qué normativa y nivel de adecuación hay que cumplir, así como la información que debe incluir la declaración de conformidad.

Las entidades obligadas deberán ofrecer a las personas usuarias un mecanismo de comunicación que permita a cualquier persona presentar sugerencias y quejas, así como informar sobre cualquier posible incumplimiento por parte de su sitio web o de su aplicación para dispositivos móviles de los requisitos de accesibilidad y solicitar la información excluida.

Los contenidos deben ser accesibles para todos los usuarios, y en especial para las personas mayores y con discapacidad, de acuerdo a la norma publicada en el "Diario Oficial de la Unión Europea", sino se presumirá que es la EN 301 549 v1.1.2 (2015-04).

La declaración debe cumplir los siguientes requisitos:

Actualizarse periódicamente, mínimo una vez al año, o cada vez que se haga una revisión.
Deberá proporcionarse en formato accesible.
Seguirá el modelo de declaración que va a dictarse mediante "Orden de la Ministra de Política Territorial y Función Pública", de acuerdo con el modelo europeo. La Directiva europea establecía que la Comisión proporcionaría el modelo de declaración de conformidad antes del 23/12/2018.
En los sitios web, la declaración de conformidad estará disponible en un apartado del sitio enlazado desde todas las páginas denominado "Accesibilidad" o su equivalente en el idioma en el que se encuentre la página.
En las apps nativas, estará en el sitio web de la entidad obligada que haya desarrollado la aplicación junto con el enlace para su descarga, o bien se facilitará junto con otra información disponible al descargar la aplicación de las plataformas de distribución de aplicaciones.

Unidades responsables de accesibilidad

En la Administración General del Estado se designarán las unidades responsables de accesibilidad en el ámbito de las Subsecretarías de cada Departamento.
En las comunidades autónomas se designará la "Unidad responsable de accesibilidad" para todo el ámbito autonómico.
En las entidades locales y demás organismos obligados se designará, conforme a sus características organizativas propias, la "Unidad responsable de accesibilidad" de su ámbito.

Las entidades obligadas podrán certificar el cumplimiento de los requisitos de este real decreto en sus sitios web y aplicaciones para dispositivos móviles por una entidad de certificación cuya competencia técnica haya sido reconocida formalmente por la entidad nacional de acreditación (ENAC) o por otro organismo nacional de acuerdo al reglamento (CE) n.º 765/2008 del Parlamento Europeo y del Consejo, de 9 de julio de 2008, por el que se establecen los requisitos de acreditación y vigilancia del mercado relativos a la comercialización de los productos y por el que se deroga el Reglamento (CEE) n.º 339/93.

Cómo hacer tus documentos de Google doc más accesibles

Utilizar encabezados

Facilite a los demás la lectura de su documento al incluir encabezados. Los documentos organizados que incluyén encabezados ayudarán a los lectores a saltar a diferentes secciones de su documento. La estructura y los encabezados correctamente añadidos son muy importantes para que sus documentos se puedan entender.

Los títulos deben seleccionarse en función de su jerarquía en el documento. Por lo general, comienza el documento con un encabezado que describe el documento general, que sería el Título 1. Síguelo con un subtítulo, que sería el Título 2, y así sucesivamente. Cualquier estilo de encabezado ayudará a aquellos que usan un lector de pantalla a navegar a través de su documento.

Para convertir un artículo en un encabezado en Google Docs, siga los pasos a continuación:

• Seleccione el menú desplegable Estilos, ubicado a la izquierda del menú desplegable de fuentes, o vaya a Formato, Estilos de párrafo.
• Cambie de Texto normal a Título 1, Título 2 o Título 3, usando los niveles de título apropiados para su estructura de contenido.
• Un beneficio adicional del uso de encabezados es que se pueden usar para generar automáticamente una tabla de contenido o marcar elementos en su documento.

Añadir texto alternativo a las imágenes

Las imágenes pueden jugar un papel importante en Google Docs. La forma de hacerlos accesibles es agregar Texto Alternativo. El texto alternativo para imágenes es vital para garantizar que los usuarios con discapacidades visuales tengan acceso a la información incluida en estas imágenes. El texto alternativo debe proporcionar suficiente información para que los usuarios que no pueden verlos aún puedan entender lo que transmiten.
Para agregar texto alternativo a una imagen incrustada en un Google Doc, siga los pasos a continuación:

• Sube o inserta la imagen.
• Haga clic y resalte la imagen.
• Haga clic derecho en la imagen y seleccione Alt texto.
• En la ventana emergente, ingrese una descripción de la imagen en el campo Descripción.
• Haga clic en Aceptar cuando haya terminado.
• Si bien no hay reglas estrictas para determinar qué texto alternativo debería decir (depende de la imagen, su contexto, etc.), un simple truco consiste en imaginar la descripción de la imagen a alguien por teléfono.

Describe claramente los hipervínculos

Puede hacer que su Google Docs sea aún más accesible al mejorar la forma en que usa los hipervínculos en sus documentos. Los hipervínculos deben estar incrustados en un texto que los haga claros, concisos y significativos en el contexto. Los usuarios escanean visualmente las páginas en busca de enlaces para ayudarles a encontrar la información que están buscando rápidamente. Aquellos que usan lectores de pantalla pueden abrir una lista de todos los enlaces de su documento con solo tocar un botón; por lo tanto, los enlaces deben tener tanto sentido como sea posible.

Por ejemplo, un enlace debe decir " Subtítulos ocultos en las diapositivas de Google " en lugar de "Subtítulos ocultos en las diapositivas de Google. Haga clic aquí ".

Para agregar mejor un hipervínculo a un Google Doc, siga los pasos a continuación:

• Resalte el texto que desea hacer en un hipervínculo.
• Haga clic derecho en el texto y busque enlace.
• Inserte el enlace.
• Haga clic en Aplicar cuando haya terminado.

Utilice el color y el contraste adecuadamente

Colorear tus documentos es muy importante. Es fundamental que exista el contraste adecuado entre el texto de su documento y el fondo de su documento. Además, el color nunca debe usarse para resaltar elementos en su documento. Utilice el color más negrita para resaltar elementos. Siempre recuerda, lo que ves puede que no sea lo que otros ven.

Guía para hacer una revisión de accesibilidad

El objetivo del diseño accesible e inclusivo es hacer las cosas más fáciles para las personas, empatizar con sus necesidades y respetar.
Esto no solo se aplica a personas con discapacidad permanente o dificultades de aprendizaje. Cada uno tendrá diferentes necesidades en diferentes momentos y en diferentes circunstancias. Alguien podría verse afectado por su salud (puede estar cansado, recuperarse de un derrame cerebral o tener un brazo roto), su ubicación (podría estar en un restaurante ruidoso o en un área con wifi lento) o personalmente (puede haber olvidado sus gafas).

Diseñar para la accesibilidad no significa que la estética del trabajo deba sufrir: La accesibilidad nunca debe ser opcional, o una idea de último momento. Debe estar en el corazón del proceso de diseño, cada vez.

Visual

Use fuentes grandes y claras

Las fuentes Sans-serif (El término “sans serif” procede del francés y significa “sin remates”. Algunos ejemplos de fuentes sans serif son Helvetica, Frutiger, Optima y Futura 1001 fuentes) son a menudo preferidas por su legibilidad. Elija una fuente que tenga diferencias claras entre los caracteres (como mayúscula, minúscula y número) no pierda de vista los signos y los G en minúsculas.

Se recomienda un tamaño de punto mínimo de 12 puntos para imprimir.

Evita usar demasiados tipos de letra.

Los diseños que utilizan solo uno o dos tipos de letra suelen ser más fáciles de visualizar: muchos pueden crear un diseño visual confuso. Esto es malo para todos, especialmente para las personas con dificultades de lectura, como la dislexia.

Revisa tu color de texto

Asegúrese de que su tipografía sea visible para los lectores con baja visión. El negro sobre blanco suele ser la primera opción para una máxima legibilidad. Las personas con dislexia a menudo prefieren un fondo amarillo o crema, mientras que las personas con visión muy baja prefieren leer amarillo sobre negro.

Usa colores claramente contrastantes.

Evite el naranja con el rojo, por ejemplo: las personas con ceguera al color pueden no ser capaces de notar la diferencia entre ellos. Puede verificar el contraste de color de su trabajo utilizando un complemento como el Analizador de contraste de color, que simula diferentes tipos de ceguera de color, o ver su trabajo en escala de grises. Esto es particularmente importante en gráficos y tablas.

No confíe solo en el color para transmitir un mensaje.

Las personas con ciertos tipos de ceguera al color pueden no ver un mensaje de error rojo, por ejemplo. En caso de duda, utilice patrones de contraste y etiquetas claras para diferenciar su contenido.



Y otra cosa...
Revise su trabajo: use estas herramientas para ver cómo se ven sus diseños a las personas con ceguera al color, discapacidades visuales y más.

Texto

Usa un lenguaje claro y simple.

La escritura confusa, es una barrera para todos los lectores, pero puede ser particularmente difícil para las personas con dificultades de lectura o de procesamiento. Mantenga los párrafos y las oraciones cortas, use palabras conocidas y evite la jerga. Organice su escritura en un orden lógico. El objetivo es de ahorrarle tiempo a las personas y asegurarse de que no tengan que volver a leer su escritura para descifrar lo que quiere decir.

Alinear texto a la izquierda

Esto hace que sea más fácil para las personas ver dónde comienza cada línea. Evite justificar el texto, ya que esto crea espacios vacíos entre las palabras, e intente mantener las líneas hasta un máximo de 60 a 70 caracteres.

Uso de mayúsculas

Poner en mayúscula solo la primera letra de una oración es mucho más fácil de leer. La capitalización puede ser problemática para las personas con dislexia y deficiencias visuales, especialmente si las palabras o regiones completas están en mayúsculas. También puede resultar complicado para los lectores de pantalla, que pueden interpretar letras mayúsculas consecutivas como acrónimos.

Evita los saltos de línea múltiples

Cualquier espaciado adicional o saltos de párrafo serán leídos por el lector de pantalla como 'espacio' o 'retorno', lo que puede ser molesto para los oyentes.

Los simbolos

Ciertos símbolos no son reconocidos por todos los lectores de pantalla, así que use 'por ciento' en lugar de %.

Evitar el subrayado y la cursiva.

Puede ser difícil de leer para las personas con discapacidades visuales y dislexia, ya que pueden hacer que las palabras parezcan coincidir entre sí.

Y otra cosa…
Los lectores disléxicos a menudo experimentan caracteres invertidos, letras desordenadas o texto distorsionado saltando sobre la página, pero las fuentes especializadas pueden ayudar a contrarrestar esto.

Un estudio realizado por el experto en gráficos Dr Rob Hillier descubrió que las personas con dislexia generalmente prefieren las fuentes con pesos ligeros, letras perpendiculares y trazos uniformes. Luego desarrolló el tipo de letra Sylexiad : cada personaje es lo más distinto posible para ayudar a los lectores a distinguirlos.

Varias fuentes han seguido este ejemplo. OpenDyslexic es un tipo de letra libre que sigue un estilo similar, mientras que Lexie Readable pretende captar la claridad de Comic Sans.

Digital

Estructure su contenido de una manera lógica y significativa.

Esto permite a las personas adaptar el contenido de acuerdo con sus necesidades. Utilice siempre las etiquetas de encabezado HTML adecuadas para los encabezados y subtítulos, y use el HTML correcto para todos los elementos estructurales; estos serán recogidos por los lectores de pantalla, por ejemplo. Todas las páginas deben tener títulos claros y únicos.

Proporcionar alternativas de texto para contenido no textual

Todas las imágenes, gráficos y tablas deben incluir texto alternativo, una descripción de texto simple de lo que muestra el contenido. Esto se lee en voz alta a través del software de lectura de pantalla, que ayuda a las personas con discapacidades visuales a comprender el contenido.

Agrega subtítulos y otras alternativas para multimedia

Los subtítulos, las transcripciones de texto, la descripción de audio, el lenguaje de señas y los formatos de solo audio ofrecen una forma alternativa de transmitir la información.

Utilizar más de un sentido para transmitir información.
No confíe únicamente en la forma, el sonido, la posición o el tamaño. Por ejemplo, "Hacer clic en el botón de la derecha" no sirve para alguien que no puede ver. En su lugar, utilice redacción de textos claros para aclarar todas las instrucciones. Esto beneficiará a todos, no solo a las personas con discapacidades.

No confíes únicamente en el color.

Las instrucciones como 'Haga clic en el botón verde' pueden carecer de significado para las personas con ceguera al color, así que respalde esto con alguna información de aclaración. Además, tenga cuidado con los gráficos, como los gráficos circulares. Nunca confíe en el color para diferenciar los segmentos. En su lugar, agregue etiquetas o patrones.

Hacer enlaces fáciles de entender

Todos los enlaces deben estar claramente etiquetados con texto de anclaje descriptivo. Las personas que usan un lector de pantalla pueden elegir escuchar todos los enlaces en una página leída en una lista, lo cual no es de mucha utilidad si todos los enlaces tienen la etiqueta "Leer más" o "Haga clic aquí". En su lugar, intente 'Leer más sobre nuestra organización' o 'Visite nuestro blog'. Los enlaces que apuntan al mismo destino deben tener la misma descripción.

Haz que sea fácil escuchar el contenido

No utilice el contenido de audio que se reproduce automáticamente: puede impedir que los usuarios del lector de pantalla puedan navegar por su sitio.

Usa un teclado

Todas las partes de su sitio deben funcionar con comandos de teclado, incluidos formularios, menús y el carrito de compras. Intente desconectar el mouse para ver si aún puede navegar por el sitio, por ejemplo, utilizando las teclas de tabulación o de flecha. Asegúrese de que esta secuencia sea lógica y significativa.

Tenga cuidado con el contenido en movimiento

Cualquier cosa que se mueva, parpadee o se desplace debe tener una opción para pausarla, detenerla u ocultarla; idealmente, debería eliminar estos elementos por completo. Nunca debe agregar nada que parpadee más de tres veces por segundo, ya que esto podría causar convulsiones.

Reglas simples para usar imágenes de la manera más efectiva

Evita las imágenes puramente decorativas.

Las imágenes puramente decorativas rara vez proporcionan una experiencia positiva para los usuarios; en muchos casos, los usuarios simplemente los ignoran, pero en algunos casos, tales imágenes pueden abrumarlos y distraerlos. Por ejemplo, muchos sitios web corporativos son conocidos por usar fotografías abstractas de edificios en diseño. La idea detrás de eso es simple: dar a los visitantes el sentido de una corporación moderna. Desafortunadamente, tales fotos no dan ninguna información valiosa a cualquiera que visite un sitio web.

Prueba el significado de tus imágenes

Las imágenes, como cualquier otro elemento de la interfaz de usuario, deben probarse para determinar su utilidad. Es vital probar y ver que el mensaje que intenta transmitir utilizando imágenes es absolutamente claro para sus usuarios.

Tener presente las emociones del usuario

Es especialmente importante cuando los usuarios enfrentan problemas. Por ejemplo, si sus usuarios reciben un mensaje de error durante el envío del formulario, mostrar una cara sonriente de una persona junto al mensaje de error no creará una buena sensación.

Herramientas:

Si usa superposición de texto sobre la imagen, es importante probar la tasa de contraste de color para asegurarse de que el texto sea legible.
Texto en la imagen de fondo a11y check

A11y Color Palette El color es importante para cualquier diseño. Sin embargo, a veces el contraste entre los colores de fondo y de primer plano es difícil de leer, especialmente para las personas con discapacidad visual. (WCAG 2.1).


Cuando el punto de enfoque está oculto, la imagen pierde todo su valor. No hagas que los usuarios busquen el significado de la imagen.

Si desea contar una historia sobre su equipo, siempre es mejor tomar fotos de las personas que trabajan con usted en lugar de usar fotos genéricas de un equipo aleatorio. Y no se preocupe de que su foto no se vea demasiado pulida: cuando los visitantes vean esas fotos, entenderán que una persona real la tomó y eso ayuda a establecer una conexión humana.

No se olvide de las personas con discapacidades visuales que usarán lectores de pantalla para interactuar con su contenido. Proporcione un texto alternativo o un título para cada imagen importante para que los lectores de pantalla puedan brindar a los usuarios información significativa.

Annie: el primer dispositivo Braille de autoaprendizaje

Annie le permite a un estudiante aprender a leer, escribir braille por su cuenta. Un estudiante necesita un año completo para aprender lo básico de la alfabetización en braille (lectura, escritura) precisa de estar bajo supervisión constante. Annie hace que aprender braille sea divertido.
Los módulos de hardware táctiles diseñados para enseñar, junto con una suave voz humana que guía a los alumnos a través de las lecciones, eliminan la necesidad de supervisar constantemente.

Annie evalúa las respuestas dadas por los estudiantes de manera instantánea y brinda retroalimentación inteligente y correctiva.

Annie se lanzó a nivel mundial durante la VIEW Conference, Birmingham, en marzo de 2018. El dispositivo obtuvo un gran interés por parte de los asistentes.

Web del fabricante: Thinkerbell labs

La API de autenticación web, más conocida como WebAuthn, ahora ha alcanzado una versión estable

WebAuthn es lo que los expertos en seguridad llaman un sistema de autenticación sin contraseña y lo que ven como el futuro de la seguridad de la cuenta del usuario.

WebAuthn permite a los usuarios registrarse y autenticarse en sitios web o aplicaciones móviles utilizando un "autenticador" en lugar de una contraseña.

El "autenticador" puede ser una clave de seguridad o una identificación biométrica que se puede obtener desde los sensores de la PC o del teléfono inteligente, como huellas dactilares, escáneres faciales, escáneres de iris y otros.

El estándar ya es compatible con navegadores como Google Chrome, Edge y Firefox, y la versión preliminar de Safari de Apple . También es compatible con Android y Windows 10 .

Creación de enlaces válidos y accesibles.

El elemento de anclaje a menudo se cita como el elemento de construcción principal de la World Wide Web. Se utiliza para crear un enlace a otras páginas, a anclajes dentro de la misma página, a otros recursos (como un PDF) o a una dirección de correo electrónico.

Para ser un enlace válido debe tener:

• Un atributo href.
• texto que describe a dónde va el enlace, podría ser texto simple o el alt (texto alternativo) una imagen.
• Apertura y cierre de etiquetas.

Los textos de enlace poco útiles son "haga clic aquí", "leer más" y "enlace". Estos son problemáticos porque cuando una persona que usa un lector de pantalla navega usando por los enlaces, estos se leerán fuera de contexto. ¿A dónde esperaría que alguno de esos tres enlaces le guiará si los escuchara? Es imposible saberlo.

Piense en reestructurar su frase para eliminar 'haga clic aquí' o 'enlace' y luego rodee la parte significativa con el enlace.

El foco y teclado
Algunos desarrolladores / diseñadores ven la propiedad :focus de los enlaces como fea y la eliminan. Las personas que navegan utilizando el teclado requieren este estado de enfoque para realizar un seguimiento de dónde se encuentran. La mejor práctica es nunca eliminar los perfiles de enfoque.

Por defecto, un <a>elemento con un href puede ser activado por la tecla Enter. Tenga en cuenta que no debe anular esta funcionalidad.

LECTURA RECOMENDADA

Enlaces, Botones, Envíos y Divs.

Datos estadísticos de video marketing para 2019

·      Para 2019, el video representará el 80% del tráfico global de Internet.

·      50% de los consumidores creen que la duración correcta para un video explicativo es de 1 minuto. Y los videos de hasta 2 minutos de duración obtienen el mayor compromiso.

·      Los espectadores retienen el 95% de un mensaje cuando lo ven en un video, en comparación con el 10% cuando lo leen en texto.

·      Los comercializadores de video obtienen un 66% más de clientes potenciales calificados por año.

·      Los comercializadores de video logran un aumento del 54% en el conocimiento de la marca.

·      El 84% de los consumidores han comprado algo después de ver un video.

·      El video genera un aumento del 157% en el tráfico orgánico de los SERPs.

·      Los comerciantes que utilizan el video para promocionarse aumentan sus ingresos un 49% más que los usuarios que no utilizan video.

·      El 81% de los consumidores silencia los anuncios de video.

·      Los subtítulos aumentan los videos compartidos en un 15%, y un 26% más de clics de CTA.

·      El 85% de los usuarios de Facebook ven videos sin audio.

·      El 91% de los videos con subtítulos se ven hasta su finalización, en comparación con el 66% de los videos sin subtítulos.

·      Facebook cuenta con un promedio de 8 mil millones de reproducciones de video diarias.

·      El 65% de las personas que miran los primeros tres segundos de un video de Facebook mirarán durante al menos 10 segundos, y el 45% mirará durante 30 segundos.

·      Video marketing

·      El 77% de las universidades ofrecen cursos en línea.

·      El 86% de los colegios y universidades tienen presencia en YouTube.

·      El 68% de los educadores cree que el contenido del video estimula las discusiones.

·      El 66% cree que el video aumenta la motivación de los estudiantes.

·      El 55% cree que ayuda a los maestros a ser más creativos.

·      El 62% cree que el video ayuda a los maestros a ser más efectivos.

·      El 61% cree que los estudiantes prefieren el video.

En otras palabras, 2019 es el año del video.

¿Hay negocio para la accesibilidad?

Ya sea que una empresa comercial, educativa, sin fines de lucro o estatal, necesitan de una justificación para dedicar recursos como dinero o esfuerzo en apoyo de una política u objetivo organizacional específico. "Negocio" pretendo que en este artículo referirme a todos los tipos de organizaciones con el entendimiento de que diferentes aspectos serán relevantes según el enfoque y el propósito de la organización. Un ejemplo, el gobierno puede estar fuertemente motivado por aspectos legales y de equidad. Las empresas comerciales pueden ser más persuadidas por la innovación y las oportunidades de expansión del mercado. Las empresas educativas y sin fines de lucro pueden sentirse especialmente atraídas por la mejora de la marca.

Para crear un caso de negocio convincente, es importante resaltar los beneficios de accesibilidad más relevantes dentro de su entorno operativo específico. Hay beneficios tangibles e intangibles para las empresas que dedican recursos a la accesibilidad digital. Un argumento frecuente en contra es que el retorno directo de la inversión (ROI) es demasiado difícil de medir. El ROI es importante, por supuesto, pero no es la única manera de medir.

Las empresas que integran la accesibilidad tienen más probabilidades de ser empresas innovadoras e inclusivas que lleguen a más personas con mensajes de marca positivos.

Un estudio de investigación de compañías de Fortune 100 indica que la inclusión de la discapacidad, como parte de una estrategia global de diversidad, es una práctica común entre las empresas de alto rendimiento.

Cuando la accesibilidad es parte de la planificación estratégica, las empresas están mejor equipadas para el éxito.

La accesibilidad es buena para los negocios.
Muchas organizaciones se están dando cuenta de que la accesibilidad conlleva múltiples beneficios: reduce los riesgos legales, fortalece la presencia de la marca, mejora la experiencia del cliente y la productividad.