Comprender las WCAG 2.0

Ir al Contenido (Presione Entrar)

-

Presentación visual:
Comprender CC 1.4.8

1.4.8 Presentación visual: En la presentación visual de bloques de texto, se proporciona algún mecanismo para lograr lo siguiente: (Nivel AAA)

  1. Los colores de fondo y primer plano pueden ser elegidos por el usuario.

  2. El ancho no es mayor de 80 caracteres o signos (40 si es CJK).

  3. El texto no está justificado (alineado a los márgenes izquierdo y derecho a la vez).

  4. El espacio entre líneas (interlineado) es de, al menos, un espacio y medio dentro de los párrafos y el espacio entre párrafos es, al menos, 1.5 veces mayor que el espacio entre líneas.

  5. El texto se ajusta sin ayudas técnicas hasta un 200 por ciento de modo tal que no requiere un desplazamiento horizontal para leer una línea de texto en una ventana a pantalla completa.

Proposito de este Criterio de Conformidad

La intención de este Criterio de Conformidad es asegurar que el texto se presente de modo que pueda ser percibido sin que el diseño interfiera con su legibilidad. Las personas con ciertas dificultades cognitivas, de lenguaje o de aprendizaje, y algunos usuarios con baja visión no pueden precibir el texto y/o perder su punto de lectura si el texto se presenta de una manera que les dificulta su lectura.

Las personas con ciertas dificultades visuales o cognitivas necesitan tener la posibilidad de seleccionar el color del texto y el color de fondo. A veces ellos eligen combinaciones que no parecen demasiado intuitivas a quienes no tienen sus mismas dificultades. A veces son combinaciones con muy poco contraste; otras veces sólo pueden usar algunas combinaciones muy específicas de color. Para estas personas resulta muy importante tener el control sobre los colores y otros aspectos de la presentación de los textos.

Para las personas con determinadas dificultades de visión o de lectura, las líneas muy largas de texto se pueden convertir en una barrera importante debido que ellos tienen problemas para ubicarse y seguir el flujo del texto. Los bloques estrechos de texto les facilita poder continuar con la siguiente línea de texto en el bloque. Las líneas no deben superar los 80 caracteres o signos ((40 si es CJK), donde los signos son el elemento de escritura en el sistema de escritura del texto. Los estudios han demostrado que los caracteres en chino, japonés y coreano (CJK) son aproximadamente el doble de ancho que los caracteres no CJK cuando ambos tipos de caracteres se muestran con características que logran la misma facilidad de lectura, por lo que el ancho de línea máximo de los caracteres CJK es la mitad que los caracteres no CJK.

Las personas con ciertas deficiencias cognitivas tienen dificultades para seguir el texto cuando las líneas están muy unidas. Los espacios adicionales entre líneas y párrafos le permiten a estas personas ubicar mejor la línea siguiente y reconocer cuando llegaron al final de cada párrafo. Para ellos es aún mejor si existen diferentes opciones, por ejemplo, un espacio y medio y doble espaciado entre líneas. Por espacio y medio dentro de los párrafos nos referimos a que la parte superior de una línea está alejada un 150% de la parte superior de la línea de abajo en vez de lo que resultaría si el texto fuera de "espaciado simple" (el espaciado predeterminado de la fuente). En el espaciado entre párrafos que es 1,5 veces mayor que el espacio entre líneas queremos decir que el espacio entre la parte superior de la última línea de un párrafo está alejada un 250% de la parte superior de la primera línea del párrafo siguiente (es decir, que hay una línea de espacio en blanco entre los dos párrafos que es un 150% del espacio de una sola línea en blanco).

Las personas con ciertas dificultades cognitivas tienen problemas para leer los textos justificados por ambos márgenes. En los textos justificados, los espacios desiguales entre las palabras pueden provocar "calles" de espacios blancos que recorren varias líneas dificultando la lectura y, en algunos casos, haciéndola imposible. En los textos justificados también se pueden producir acercamiento exagerados entre algunas palabras, de modo que resulta difícil ubicar la separación de las palabras.

Cuando se brinda la posibilidad de ajustar el texto procesado (los caracteres de texto que han sido expuestas de manera que se pueden ver [frente a los caracteres de texto que todavía están en forma de datos como ASCII]) se está permitiendo que el texto sea ampliado sin necesidad de efectuar desplazamientos laterales para ver todo el contenido. Cuando esto es posible se dice que el texto fluye y permite, a las personas con baja visión y con problemas cognitivos, incrementar el tamaño del texto sin sentirse desorientadas.

El ajuste de los textos es, principalmente, una responsabilidad de las aplicaciones de usuario. Las aplicaciones de usuarios que cumplen con el Punto de Control 4.1 de las UAAG permiten a los usuarios configurar el tamaño de los textos. La responsabilidad de los autores es crear contenidos web que no impidan a las aplicaciones de usuario el ajuste del contenido y permitan que el contenido fluya dentro del ancho de la vista actual. Consulte Comprender el Criterio de Conformidad 1.4.4 Cambio de tamaño del texto para discusiones adicionales sobre el aumento de tamaño de los textos.

Los requisitos sobre el desplazamiento horizontal no se aplican a los dispositivos con pantallas pequeñas donde las palabras largas pueden mostrarse en una sola línea y necesitar un cierto desplazamiento lateral. Para el propósito de este requerimiento, los autores se deben asegurar que el contenido no necesitará desplazamientos horizontales en una pantalla de computadora o laptop estándar con la ventana del navegador a tamaño completo. Cuando se hace esta evaluación es mejor considerar las resoluciones de pantalla más comunes durante el curso de los últimos años ya que las personas generalmente mantienen su equipamiento por algunos años.

Siempre debe ser posible cortar las palabras, con la condición de que las palabras no sean tan largas que ocupen más de la mitad del ancho de una pantalla completa. Las URIs muy largas pueden superar los límites de una pantalla ampliada, pero no se lo considera un texto "para ser leído" y, en consecuencia, no estarían violando este requisito.

Este requisito no significa que el usuario no deba tener nunca la necesidad de usar un desplazamiento horizontal. Sólo significa que él no debe necesitar desplazarse de un lado a otro para leer una línea de texto. Por ejemplo, si una página consiste en dos columnas de texto con el mismo ancho, automáticamente cumpliría con este requerimiento. Al ampliar la página, la primer columna entraría por completo en la pantalla y el usuario sólo tendría que desplazarse verticalmente para leer el texto. Para leer la segunda columna, el usuario debería desplazarse hacia la derecha y hacer que la columna ocupe todo el ancho de la pantalla y así poder leer el texto sin necesitar más desplazamientos horizontales.

Beneficios específicos del Criterio de Conformidad 1.4.8:

Este Criterio de Conformidad ayuda a los usuarios con baja visión permitiéndoles ver el texto sin ser distraídos por las características de la presentación. Les posibilita configurar el texto de manera que les resulte más legible al darles el control sobre el color y tamaño de los bloques de texto.

Este Criterio de Conformidad ayuda a las personas con dificultades cognitivas, de lenguaje y de aprendizaje a percibir los textos y a no perderse en los bloques de texto.

  • Las personas con ciertas dificultades cognitivas pueden leer mejor los textos cuando eligen ellos mismos las combinaciones de color de primer plano y fondo.

  • Las personas con ciertas dificultades cognitivas pueden ubicarse mejor cuando los bloques de texto son estrechos y pueden configurar la cantidad de espacio entre las línea y los párrafos.

  • Las personas con ciertas dificultades cognitivas pueden leer los textos más fácilmente cuando el espacio entre las palabras es regular.

Ejemplos del Criterio de Conformidad 1.4.8

Las siguientes imágenes muestran ejemplos de texto con espacio simple, de espacio y medio y a doble espacio en un párrafo.

Example of single-spaced text. (no space between each line of text)Example of space-and-a-half text. (a space equal to half the height of a line of text line)Example of double-spaced text. (a space equal to the height of a line of text between each line)

Los ejemplos de signos incluyen "A", "→" (el símbolo de una flecha), and "さ" (un carácter en japonés).

Recursos relacionados

Los recursos tienen un propósito puramente informativo y no implican ningún aval.

Técnicas y Fallos para el Criterio de Conformidad 1.4.8 - Presentación visual

Cada elemento enumerado en esta sección representa una técnica o una combinación de técnicas que el Grupo de Trabajo WCAG considera suficientes para cumplir con este Criterio de Conformidad. Las técnicas enumeradas sólo satisfacen el Criterio de Conformidad si se cumple con todos los requisitos de conformidad de las WCAG 2.0.

Técnicas suficientes

Instrucciones: Dado que éste es un Criterio de Conformidad de muchas partes, se debe satisfacer una de las técnicas numeradas en cada uno de los siguientes requisitos.

Primer Requisito: Técnicas para asegurar que los colores de primer plano y fondo puedan ser seleccionados por el usuario

  1. C23: Especificar colores para el fondo y el texto de contenidos secundarios tales como banners, navegación y otros rasgos en CSS dejando los colores de fondo y texto del contenido principal sin especificar (CSS) OR

  2. C25: Especificar bordes y límites en la CSS para delimitar zonas de una página web, sin especificar los colores de fondo y texto (CSS) OR

  3. G156: Usar una tecnología que tenga aplicaciones de usuario de uso generalizado que puedan cambiar el fondo y primer plano de los bloques de texto OR

  4. G148: No especificar ningún color de fondo, no especificar ningún color de texto, y no usar ninguna tecnología que cambie esas opciones predeterminadas OR

  5. G175: Proporcionar una herramienta de selección de colores múltiples para los colores de fondo y primer plano

Segundo Requisito: Técnicas para asegurar que el ancho no sea mayor de 80 caracteres o signos (40 si es CJK)

  1. H87: No interferir con el cambio en el flujo del texto en las aplicaciones de usuario cuando la ventana es reducida (HTML) OR

  2. C20: Usar unidades de medida relativas para definir los anchos de columna de manera que las líneas tengan un promedio de 80 caracteres o menos cuando se amplía o reduce el tamaño del navegador (CSS)

Tercer Requisito: Técnicas para asegurar que el texto no está justificado (alineado a los márgenes izquierdo y derecho a la vez)

  1. C19: Especificar en la CSS la alineación a izquierda o derecha (CSS) OR

  2. G172: Proporcionar un mecanismo para remover la justificación del texto OR

  3. G169: Alinear el texto por un solo lado

Cuarto Requisito: Técnicas para asegurar que el espacio entre líneas (interlineado) es de, al menos, un espacio y medio dentro de los párrafos y el espacio entre párrafos es, al menos, 1.5 veces mayor que el espacio entre líneas

  1. G188: Proporcionar un botón en la página para incrementar los espacios entre líneas y párrafos OR

  2. C21: Especificar el espaciado de línea mediante CSS (CSS)

Quinto Requisito: Técnicas para asegurar que el texto se ajusta sin ayudas técnicas hasta un 200 por ciento de modo tal que no requiere un desplazamiento horizontal para leer una línea de texto en una ventana a pantalla completa

  1. No interferir con el flujo de texto en las aplicaciones de usuario cuando la ventana es reducida (futuro enlace, General) O

  2. G146: Usar diseño líquido Y usar medidas relativas a otras mediciones en el contenido a través de una las siguientes técnicas:

  3. C26: Proporcionar opciones dentro del contenido para cambiar a un diseño que no requiera que el usuario se desplace horizontalmente para leer una línea de texto (CSS)

Técnicas adicionales (recomendables) para 1.4.8

Aunque no se requieren para lograr la conformidad, las siguientes técnicas adicionales deben ser consideradas a fin de hacer más accesibles los contenidos. No todas las técnicas podrán ser utilizadas o resultarán eficaces en todas las situaciones.

  • Usar el efecto hover para destacar un párrafo, los elementos de una lista o las celdas de una tabla (HTML, CSS) (futuro enlace)

  • Presentar el texto con fuente sans serif o proporcionar un mecanismo para conseguirlo (CSS) (futuro enlace)

  • Usar listas verticales (numeradas o con viñetas) en lugar de listas en línea (futuro enlace)

  • Usar mayúsculas y minúsculas de acuerdo con las convenciones ortográficas del idioma de los textos (futuro enlace)

  • Proporcionar fuentes de gran tamaño de forma predeterminada (futuro enlace)

  • Evitar el uso de texto en imágenes raster (futuro enlace)

  • Evitar el ajuste de los textos a un tamaño menor al predeterminado en la aplicación de usuario (futuro enlace)

  • Proporcionar espacio suficiente entre las columnas (futuro enlace)

  • Evitar el texto alineado centralmente (futuro enlace)

  • Evitar bloques de texto en cursivas (futuro enlace)

  • Evitar el uso excesivo de diferentes estilos en las páginas individuales y en los sitios (futuro enlace)

  • Diferenciar visualmente los enlaces (futuro enlace)

  • Proporcionar viñetas expandibles (futuro enlace)

  • Mostrar/ocultar los puntos con viñetas (futuro enlace)

  • Poner un espacio em o dos espacios después de las oraciones (futuro enlace)

Términos clave

bloques de texto

Más de una oración de texto.

en una ventana a pantalla completa

En los ordenadores de sobremesa y portátiles más comunes, pantalla con la ventana maximizada.

Nota: En la medida en que la gente suele mantener sus computadoras durante años, es mejor no confiar en las resoluciones de los últimos modelos de monitores de sobremesa o de pantallas de portátiles, sino considerar las resoluciones más comunes en los últimos años a la hora de realizar esta evaluación.

mecanismo

El proceso o técnica para alcanzar un resultado.

Nota 1: El mecanismo puede proveerse explícitamente en el contenido, o se puede depender de que sea proporcionado por la plataforma o por las aplicaciones de usuario, incluyendo las ayudas técnicas.

Nota 2: El mecanismo debe satisfacer todos los Criterios de Conformidad para el nivel de conformidad declarado.