Principio 1/1.4 Distinguible/1.4.5-A

De WCAG Wiki

1.4.5-A. Evitar imágenes para representar texto

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • Si se puede conseguir la presentación visual deseada usando sólo texto y estilos, no se deben emplean imágenes para representar dicho texto

Comprensión del criterio

Descripción resumida

Siempre que sea posible, el contenido textual debe presentarse como texto real, no como imágenes de texto. El texto real puede ampliarse, personalizarse, ser leído por tecnologías de apoyo y mantener nitidez con zoom, lo que no ocurre con imágenes de texto.

Objetivo

Garantizar que el contenido textual sea accesible, escalable y legible para personas con baja visión y que pueda ser leído por herramientas de asistencia.

Importancia de cumplir el criterio

El texto dentro de imágenes pierde nitidez al ampliar, no se puede personalizar y puede no ser accesible para lectores de pantalla. El uso de texto real permite adaptación visual, mejora la legibilidad y potencia la accesibilidad.

Referencias WCAG

Recursos de apoyo

Consejos
  • Usar CSS para decorar y dar estilo al texto en lugar de usar imágenes.
  • Evitar imágenes de texto salvo en casos excepcionales como logotipos o marcas.
  • Proveer texto alternativo completo si se incluye una imagen de texto necesaria.
  • Definir imágenes decorativas mediante CSS.

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Localizar las imágenes cuyo contenido es susceptible de ser transmitido mediante texto y estilos.
  2. Paso 2. Verificar que el contenido de la imagen está disponible con texto y estilos.

Resultado esperado

El texto se representa mediante texto real y estilos, no mediante imágenes, excepto en casos justificados como logotipos.

Ejemplo

El texto se estiliza con CSS, no se inserta como imagen.
HTML: 

<h2 class="titulo">Bienvenido</h2>
<p>El texto se estiliza con CSS, no se inserta como imagen.</p>

CSS: 

.titulo {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
}

Otras herramientas de evaluación

  • Inspección del navegador: revisar el código para identificar si el contenido que parece texto es realmente una imagen (p. ej., <img>, background-image) en lugar de texto HTML.
  • Revisión visual: comprobar si el “texto” pierde nitidez al hacer zoom; las imágenes de texto suelen pixelarse mientras el texto real no.
  • Prueba de aumento: aumentar el tamaño del texto y verificar si el supuesto texto escala correctamente (las imágenes de texto normalmente no lo hacen).
  • Lectores de pantalla: (NVDA, JAWS, VoiceOver) comprobar si el texto es anunciado; si es imagen, dependerá de alt y puede no ser accesible.
  • Herramientas de inspección de contraste: comprobar que el supuesto texto cumple contraste; si es imagen, la verificación puede fallar o ser menos fiable.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.4.5-A. Evitar imágenes para representar texto

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.4_Distinguible/1.4.5-A&oldid=3710»