2526UdL1.4.1-C-001

De WCAG Wiki

Edición de la página como formulario

1. Información básica

Id del criterio: 1.4.1 - Uso del color (Nivel: A)
Título del subcriterio: 1.4.1-C
Universidad participante: UdL
Curso académico: 2025-26

Enlace directo a la página del subcriterio en la wiki https://wikiwcag.udl.cat/Principio_1/1.4_Distinguible/1.4.1-C



2. Ejemplos prácticos

2.1. Ejemplo NO accesible

2.1.1. Evidencia en imagen y enlace:
a) Imagen

b) Enlace de donde se ha obtenido la imagen:
https://www.donpiso.com/blog/que-es-el-ibi-todo-lo-que-necesitas-saber-sobre-el-impuesto-de-bienes-inmuebles/

2.1.2. Código HTML:

<img decoding="async" class="alignnone size-full wp-image-5617" src="https://www.donpiso.com/blog/wp-content/uploads/2019/12/1-Recaudacion-IBI-Espana.png" alt="1-recaudacion-ibi-espana" width="1996" height="819" srcset="https://www.donpiso.com/blog/wp-content/uploads/2019/12/1-Recaudacion-IBI-Espana.png 1996w, https://www.donpiso.com/blog/wp-content/uploads/2019/12/1-Recaudacion-IBI-Espana-300x123.png 300w, https://www.donpiso.com/blog/wp-content/uploads/2019/12/1-Recaudacion-IBI-Espana-768x315.png 768w, https://www.donpiso.com/blog/wp-content/uploads/2019/12/1-Recaudacion-IBI-Espana-1024x420.png 1024w" sizes="(max-width: 1996px) 100vw, 1996px">



Explicación del problema detectado:
El texto alternativo o alt no explica en detalle la imagen que se ve en la página, solo el nombre de donde lo ha sacado "alt="1-recaudacion-ibi-espana"". No explica que se ve, que color (que solo hay un color sólido) y la información que hay dentro.

Indica a que personas con discapacidad afecta y explicación de las barreras que causa
Este error afecta en la visibilidad de personas de baja visión parcial o perdida de visión total. El texto alternativo no da la información suficiente para que un lector de pantallas pudea transmitir la información necesaria y al ser un color sólido puede que cree dificultades de visualización para diferentes grados de daltonismo.


2.2. Ejemplo Accesible

2.2.1. Evidencia de imagen:
a) Imagen

b) Enlace de donde se ha obtenido la imagen:
No se ha indicado ningún enlace.


2.2.2 Código HTML:

<h1>Tabla accesible</h1> <img src="Gráfica de barras.jpg" alt="Gráfica de barras que muestra diferentes frutas en diferentes colores y su cantidad correspondiente">



Explicación de la solución aplicada:
Al poner un texto alternativo o <alt> en el cual se detalla al máximo las etiquetas y información que contiene el diagrama facilita su comprensión.