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)

  • Se utiliza el texto para transmitir la información en lugar de imágenes de texto si se puede lograr la presentación visual deseada con las tecnologías utilizadas.

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

  • C22: Usar CSS para controlar la presentación visual del texto
  • G140: Separar información y presentación para múltiples vistas accesibles
  • C30: Permitir alternar entre texto e imágenes si se usan imágenes de texto

Recursos de apoyo

  • 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

Procedimiento de evaluación

  1. Paso 1. Identificar imágenes que contienen texto.
  2. Paso 2. Verificar si podrían sustituirse por texto real con estilos CSS.
  3. Paso 3. Confirmar que las excepciones (p. ej., logotipos) cumplen alternativas o requisitos mínimos.

Resultado esperado

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

Ejemplo

Ejemplo accesible:
<h2 class="titulo">Bienvenido</h2>
<style>
.titulo { font-family: 'Poppins', sans-serif; font-weight: 700; }
</style>

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

Ejemplo no accesible:

<img src="bienvenido.png" alt="Bienvenido">

Texto representado como imagen sin necesidad.

Otras herramientas de evaluación

  • Inspección manual HTML/CSS
  • Modo lector o zoom del navegador










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...