Definir el mensaje antes de elegir la paleta
Un punto verde puede significar disponible, terminado o seleccionado. Su significado no está dentro del color: depende del contexto que entiende la persona. Antes de diseñar un estado, escribamos qué debe saber el visitante y qué puede hacer después. El color decorativo puede crear ambiente sin transmitir instrucciones. Cuando diferencia información o señala una acción, conviene que esa diferencia siga siendo comprensible mediante otra señal visible. Así la paleta refuerza el mensaje sin convertirse en su única vía.
Poner nombre a los estados
En una lista de solicitudes, « En revisión », « Falta información » y « Enviada » dicen más que tres círculos de colores. Un símbolo estable ayuda a explorar la lista, pero una forma desconocida también necesita explicación. Mantengamos el mismo vocabulario en la tarjeta, el detalle y la confirmación. Para indicar una selección, una marca y un texto claro evitan depender únicamente del fondo. Las instrucciones deben nombrar la acción: « Pulsa Guardar » resulta más útil que « Pulsa el botón azul ».
Convertir el error en una ayuda concreta
Un borde rojo no explica qué ha fallado. Junto al campo, mostremos un mensaje que describa el problema y permita corregirlo: « Escribe una dirección de correo completa ». Conservemos los datos válidos para no obligar a repetir trabajo. La implementación también debe asociar el mensaje con el campo y comunicar su estado no válido a las tecnologías de apoyo. Esa relación técnica no sustituye el texto visible; quien no distingue ciertas tonalidades puede no utilizar un lector de pantalla.
Diseñar gráficos que no exijan adivinar tonos
Si dos líneas representan servicios diferentes, situemos sus nombres cerca cuando el espacio lo permita. También pueden distinguirse con marcadores o trazos diferentes, siempre sin saturar el dibujo. Una leyenda de cuadrados coloreados por sí sola mantiene el mismo problema. Comprobemos que cada etiqueta se relaciona claramente con su serie en móvil. Cuando los valores sean necesarios para tomar una decisión, una tabla accesible o un resumen complementario ayuda a consultar la información sin depender de la imagen.
Separar contraste y significado
WCAG 1.4.1 aborda el uso exclusivo del color para comunicar información. El contraste no textual es una comprobación distinta. Un indicador muy contrastado puede seguir sin explicar si una reserva está confirmada; una palabra clara puede ser ilegible sobre un fondo inadecuado. Revisemos por separado el significado, la percepción visual y la semántica del componente. Añadir un icono no constituye por sí mismo una evaluación de accesibilidad ni permite afirmar que toda la página cumple la norma.
Revisar el recorrido completo
Probemos una solicitud vacía, una respuesta con error y una confirmación correcta. Si dejamos de distinguir los colores, ¿sabemos qué cambiar y qué ha ocurrido? Una vista en escala de grises sirve como exploración inicial, no como simulación completa de la visión ni prueba de conformidad. Combinémosla con mediciones de contraste, navegación con teclado y revisión de los estados accesibles. Al cerrar el trabajo, documentemos textos, símbolos y comportamiento de los componentes. Una regla compartida resulta más fiable que corregir cada pantalla cuando el problema ya ha llegado a producción.