Tipografía

Crear y diseñar contenido accesible es más que solo elegir una fuente fácil de leer. Incluso con familias de fuentes accesibles, las personas con baja visión, cognitivas, idiomas y discapacidades de aprendizaje pueden tener dificultades para procesar el texto debido a otros elementos, como variaciones de fuente, tamaño, espaciado y interletraje, por nombrar algunos. En este módulo, se analizarán consideraciones de diseño básicas para que tu contenido sea más inclusivo y llegue a más personas.

Tipo de letra

Un factor importante que puede afectar en gran medida la accesibilidad del texto es el tipo de letra. La tipografía y el estilo que elijas pueden influir en el diseño de cualquier página.

Las personas con trastornos de lectura, aprendizaje y atención, como la dislexia y el trastorno de déficit de atención con hiperactividad (TDAH), así como las personas con visión reducida, pueden beneficiarse si se usan tipos de letra accesibles.

Elige los tipos de letra comunes La forma más rápida de crear un diseño accesible es elegir un tipo de letra común (por ejemplo, Arial, Times New Roman, Calibri, Verdana y muchos otros).

Muchos estudios de tipos de letras que realizan pruebas a personas con discapacidades demuestran que los tipos de letra comunes generan velocidades de lectura más rápidas y un nivel de comprensión más profundo en comparación con los tipos de letra poco comunes. Si bien estos tipos de letra comunes no son intrínsecamente más accesibles que otros tipos de letra, algunas personas con discapacidades tienen más facilidad para leerlos porque tienen mucha experiencia trabajando con estos tipos de letra (o utilizándolos).

Además de elegir un tipo de letra común, asegúrate de evitar los tipos de letra ornamentados o escritos a mano, así como los que solo usan mayúsculas y minúsculas. Estos tipos de letra especiales con diseños cursivas, formas extravagantes o características artísticas como líneas finas pueden verse bien, pero para algunas personas con discapacidades son mucho más difíciles de leer que los tipos de letra comunes.

Interletraje y características de las letras

La investigación sobre si los tipos de letra serif o sans serif son más fáciles de leer no es concluyente, pero ciertos números, letras o combinaciones pueden confundir a las personas con discapacidades cognitivas y de aprendizaje basado en el lenguaje. Para las personas con este tipo de discapacidades, cada letra y número deben estar definidos claramente y tener características únicas, por lo que las letras no se confunden con un número.

Las infracciones comunes de la legibilidad son la “I” mayúscula (India), la “l” minúscula (lechuga) y el número “1”. Del mismo modo, los pares de letras como b/d, p/q, f/t, i/j, m/w y n/u a veces pueden girar de izquierda a derecha o de arriba abajo para algunos lectores.

La legibilidad de la copia también disminuye cuando el interletraje o el espaciado entre letras es demasiado ajustado. Presta especial atención al interletraje, especialmente entre el par de letras problemático r/n. De lo contrario, palabras como "hilo" podrían cambiar a "ñame" o "stern" a "raíz", lo que cambiaría por completo el significado de la copia.

Las colecciones de tipos de letra de código abierto, como Google Fonts, pueden ayudarte a seleccionar el tipo de letra más inclusivo para tu próximo diseño. Si usas productos de Adobe, puedes incorporar familias de fuentes accesibles de socios de fundación directamente en tus diseños, lo que incluye Google Fonts seleccionadas.

Cuando busques tu próximo tipo de letra, presta especial atención a lo siguiente:

  • Usa fuentes comunes siempre que sea posible.
  • Evita usar fuentes elaboradas o escritas a mano, y aquellas con una sola mayúscula inicial.
  • Elige un tipo de letra con características únicas, presta especial atención a la I mayúscula, la l minúscula y la 1.
  • Revisa ciertas combinaciones de letras para asegurarte de que no sean exactamente iguales entre sí.
  • Verifica el interletraje, especialmente entre el par de letras r/n.

Tamaño de fuente y estilo tipográfico

A menudo, las personas suponen que seleccionar una familia de fuentes accesible es suficiente para crear contenido inclusivo, pero también es importante tener en cuenta el tamaño de la fuente y la forma en que se define el estilo del texto en una página.

Por ejemplo, es posible que las personas con visión reducida o daltonismo no puedan leer parte del texto si es demasiado pequeño, con una AT (como el zoom del navegador) para leer el texto. Mientras que otros usuarios, como los que padecen dislexia o trastornos de la lectura, pueden tener problemas para leer el texto en cursiva. Los lectores de pantalla suelen ignorar los métodos de estilo, como la negrita y la cursiva, por lo que la intención de estos estilos no se transmite a los usuarios ciegos o con visión reducida.

Qué no debes hacer
h2 {font-size: 16px;}
h2 {font-size: 1rem;}

Dado que no puedes predecir cuáles son las necesidades de cada usuario, cuando agregues fuentes a tus productos digitales, asegúrate de tener en cuenta los siguientes lineamientos:

  • Los tamaños de fuente base se deben definir con un valor relativo (%, rem o em) para permitir un cambio de tamaño sencillo.
  • Limita la cantidad de variaciones del tipo de letra, como color, negrita, MAYÚSCULAS y cursiva para aumentar la legibilidad. En su lugar, usa métodos para enfatizar palabras en tu copia, como asteriscos, guiones o destacar una palabra individual.
  • Siempre que sea posible, usa lenguaje de marcado en lugar de texto en imágenes. Los lectores de pantalla no pueden leer texto incorporado en imágenes (sin agregar código adicional), y el texto incorporado también puede pixelarse cuando los usuarios con visión reducida lo amplían.

Estructura y diseño

Si bien el tipo de letra, el tamaño de la fuente y el estilo tipográfico son importantes para la tipografía accesible, la estructura y el diseño del texto de una página pueden ser igualmente importantes para la comprensión del usuario.

Los diseños complejos pueden ser un verdadero obstáculo para las personas con visión reducida o problemas de lectura, y para los 6.1 millones de personas de EE.UU. con TDAH. Estos tipos de discapacidades hacen que sea más difícil para las personas mantener su lugar y seguir el flujo del texto debido a la falta de recorridos lineales claros, encabezados faltantes y elementos no agrupados.

Un aspecto importante de los diseños de diseño accesibles es hacer que los elementos fundamentales se distingan entre sí y agrupar elementos similares. Si los elementos están demasiado cerca, puede ser difícil saber dónde comienza y termina un elemento, en especial si tienen un estilo similar.

Piensa en tu copia como una colección de viñetas individuales en un esquema. Esto te ayudará a planificar la estructura general de la página y te permitirá usar encabezados, subtítulos y listas cuando corresponda.

Espaciado

El espaciado entre párrafos, oraciones y palabras también es importante, ya que ayuda a los lectores a mantener su enfoque en el texto y contribuye a la comprensión visual general de la página. Las líneas extensas de texto pueden ser una barrera para los lectores con discapacidades, ya que tienen problemas para mantener su lugar y seguir el flujo del texto. Un bloque de texto estrecho hace que sea más fácil para los lectores pasar a la línea siguiente.

Alineación del contenido

Otra frustración para muchas personas con discapacidades es leer copias justificadas. El espaciado desigual entre palabras en un texto justificado puede hacer que "ríos de espacio" se formen en la página, lo que dificulta la lectura de la copia.

La justificación del texto también puede hacer que las palabras se agrupen o estiren de forma poco natural, por lo que los lectores pueden tener dificultades para ubicar los límites de palabras.

Afortunadamente, existen lineamientos claros sobre el espaciado y herramientas como la buena altura de línea y la calculadora de proporción dorada para que nuestra copia sea más accesible. La incorporación de estas pautas ayuda a las personas con trastornos de déficit de atención, lectura y visión basadas en la visión a centrarse más en el texto y menos en el diseño.

Prácticas recomendadas para la estructura y el diseño

Cuando consideres la estructura y el diseño, asegúrate de:

  • Usa elementos como encabezados, subtítulos, listas, números, bloques de comillas y otras agrupaciones visuales para dividir la página en secciones.
  • Usa párrafos, oraciones y espacios entre palabras claramente definidos.
  • Crea columnas de texto que no superen los 80 caracteres de ancho (40 caracteres para logotipos).
  • Evita la alineación de párrafos justificada, ya que crea "ríos del espacio" dentro de la copia.

Conclusiones de tipografía accesibles

La tipografía accesible se puede resumir a las elecciones de diseño de sentido común en función de tu conocimiento de las necesidades de los usuarios. Si tienes en cuenta este módulo mientras diseñas y compilas tu contenido, será de gran ayuda para comunicarte claramente con una mayor cantidad de personas.

Verifica tus conocimientos

Pon a prueba tus conocimientos sobre medición de accesibilidad

Para un texto legible, siempre debo usar un contraste alto entre la copia y el fondo.

Verdadero.
Si bien el contraste alto puede ser valioso para algunas personas con discapacidad visual, otras pueden padecer discapacidades que dificultan la lectura del contenido de contraste alto.
Falso
Algunas personas con discapacidades no podrán leer tu contenido si el contraste es demasiado alto. Si puedes, permite que la configuración del sistema operativo del usuario determine el contraste.

¿Qué fuentes son las mejores para mejorar la accesibilidad?

Fuentes del sistema como Arial y Verdana.
Los tipos de letra comunes generan velocidades de lectura más rápidas y un mayor nivel de comprensión en comparación con tipos de letra poco comunes.
Tipos de letra accesibles.
Las colecciones de tipos de letra accesibles como Google Foundry en Adobe Fonts pueden ayudarte a seleccionar el tipo de letra más inclusivo para tu próximo diseño.
No importa.
Puedes afectar la legibilidad con la selección de la fuente. Evita usar secuencias de comandos complejas y fuentes de arte.