Icono de Doceo Software: soluciones para gestión de documentos, firma electrónica, facturación y albaranes digitales.

Accesibilidad

¿Cómo elegir colores accesibles?

Diseñando para todos: accesibilidad y experiencia de usuario en tus aplicaciones de gestión

Dibujo humorístico que muestra a una persona sentada frente a un ordenador, con el fondo 'NoTienesTiempo_fondo', transmitiendo una sensación de prisa o falta de tiempo." Esta es la opción más cercana al original.

Quiero contactar con un experto...

¡Pruébalo gratis!

26/01/2026

Equipo de Doceo Software

En DoceoSoftware apostamos por la accesibilidad y el diseño universal como pilares de nuestras soluciones. Por eso, nuestras aplicaciones incorporan una selección inteligente de colores: al elegir el color de fondo que desees, el sistema ajusta automáticamente el color del texto para garantizar un contraste accesible, legible y conforme a las buenas prácticas de usabilidad.

Aun así, creemos que es importante explicar cómo funciona el contraste de color y por qué es clave para una buena experiencia de usuario. Hoy queremos hablaros de Doceo InTime, nuestra solución de control horario, y de cómo podéis organizar botones y colores en vuestra interfaz pensando en accesibilidad y diseño inclusivo.

¿Sabías que los colores que elijas para tu aplicación pueden influir directamente en que algunas personas puedan utilizarla correctamente o no? A continuación, te mostramos cómo elegir combinaciones de color que beneficien a todos: personas con o sin problemas de visión, usuarios de mayor edad o quienes trabajan en condiciones de iluminación complicadas.

Diseño universal: qué es y por qué importa

La accesibilidad consiste en diseñar interfaces que puedan ser usadas por cualquier persona, independientemente de sus capacidades, edad o contexto. El diseño universal busca que el software sea comprensible, usable y eficiente desde el primer momento, sin soluciones especiales ni ajustes posteriores.

Aplicar accesibilidad significa tener en cuenta elementos como:

  • Compatibilidad con lectores de pantalla
  • Contrastes de color adecuados
  • Textos legibles y tamaños correctos
  • Navegación clara e intuitiva

Estos principios no solo ayudan a personas con discapacidad, sino también a usuarios mayores, a quienes trabajan con poca luz o a quienes usan el móvil en movimiento.

En muchos países, la accesibilidad es obligatoria para webs y aplicaciones de servicios públicos, comerciales o educativos. Incluso cuando no lo es, aplicarla mejora la experiencia y reduce errores.

Nuestro Doceo InTime permite configurar los botones a tu gusto, con colores a medida. Pero, ¿cómo asegurarte de que tus colores son accesibles?

¡Facil! En doceostore y doceo Intime, la configuración de colores para botones de control horario y etiquetas documentales es totalmente automática. El sistema integra una herramienta que genera estas tonalidades respetando siempre el ratio de contraste necesario. Por ello, no requiere supervisión manual: cualquier botón que crees cumplirá directamente con los estándares de accesibilidad, garantizando una legibilidad óptima sin esfuerzo adicional.

¿Te gustaría saber más?
Quiero contactar con un experto...

¡Pruébalo gratis!

Cómo elegir colores accesibles

Aquí tienes un paso a paso sencillo:

1. Selecciona tus colores

  • Decide el color de fondo del botón
  • Decide el color del texto o icono

2. Comprueba la relación de contraste

La relación de contraste entre el color de fondo y el de texto debe ser suficiente para que cualquier persona pueda leerlo.

  • WCAG 2.1 recomienda una relación mínima de 4,5:1 para texto normal y 3:1 para texto grande.

Herramientas gratuitas para comprobarlo:

3. Introduce los valores en la herramienta

  • Copia los colores de tu aplicación (HEX o RGB)
  • Pégalos en la herramienta
  • Comprueba el ratio de contraste que te da la herramienta
Copia de pantalla como se selecciona un color para la comprovación de su contraste para accesibilidad

Para verificar la accesibilidad cromática con WebAIM Contrast Checker, sitúa la aplicación a la derecha y tu web a la izquierda. Usa el Color Picker para capturar el color del texto (Foreground) y el del fondo (Background).

Si el ratio resultante es igual o superior a 4.5:1, el contraste es correcto según los estándares de lectura. Si es inferior, es necesario ajustar los tonos para garantizar la legibilidad. Así cumplirás con las pautas básicas de accesibilidad web.

4. Ajusta si es necesario

  • Si el contraste no cumple el mínimo, cambia el color de fondo o del texto
  • Repite la comprobación hasta cumplir el estándar

5. Aplica los colores

  • Configura los botones en tu panel de control con los colores verificados
  • Asegúrate de mantener coherencia visual entre botones, iconos y textos
Copia de pantalla con propuesta de colores para que el contraste sea accesible

Para elegir colores accesibles, te sugerimos estas opciones:

  • Para mantener el texto blanco: usa el fondo #6D7E00.
  • Para mantener el tono del fondo: usa el texto #717171.

Ambas combinaciones garantizan el contraste mínimo legal de 4.5:1.

Diseñar con accesibilidad y diseño universal no solo es una obligación en muchos casos, sino también una mejora para todos.

Con pequeños pasos como comprobar los colores y su contraste, puedes hacer que tu control horario sea más intuitivo, cómodo y usable, incluso en condiciones complicadas de luz o para personas con dificultades visuales.

En DoceoSoftware, creemos que un software accesible es un software mejor, y con Doceo InTime puedes empezar a aplicar estos principios hoy mismo.

Si ha llegado hasta aquí, quizá sea el momento de contactar con nosotros 🙂



      FORMULARIO DE INCIDENCIAS


      Datos del usuario

      *Debe ser cliente para acceder a este servicio.

      Detalles de la incidéncia







      Powered by
      RESERVA TU FECHA


        Elige una franja horaria para tu asesoramiento exprés


        Para personalizar mejor el asesoramiento, respóndenos brevemente









        *La prueba gratuita de 30 días actualmente está disponible para Doceo BioSign F2F, BioSign Mobile, BioSign Delivery, BioSign Forms, Store y Virtual Office, POD (albaranes de entrega), REG (Registro de entrada y salida). Para eCompulsa, FacCert, BCode, iPDF, Ademptio, eFACT realizamos una demostración con sus documentos para resultados 100% reales y ajustados a su empresa. Confidencialidad garantizada. Su prueba gratuita puede demorarse según la cantidad de demandas existentes. No se preocupe, le incluiremos en una lista de espera y nos pondremos en contacto con usted muy pronto.

        Powered by
        Icona de Doceo Software: solucions per a la gestió de documents, firma electrònica, facturació i albarans digitals
        Desarrollado por  GDPR Cookie Compliance
        Resumen de la privacidad

        Este sitio web utiliza cookies para proporcionarle la mejor experiencia de usuario posible. La información de las cookies se almacena en el navegador y realiza funciones como reconocerle cuando vuelve a la página web y ayuda al equipo a comprender qué secciones del sitio web le parecen más interesantes y útiles.