Usa el contraste de color al diseñar tu sitio móvil [2023]

Cómo elegir los colores para una aplicación móvil

Si publicas contenidos utilizando plantillas que controlan los colores del texto y del fondo, no deberías tener que preocuparte por el contraste del texto. Tu diseñador o desarrollador web debería haberse encargado de ello.

“Texto que se ha convertido en una forma no textual (por ejemplo, una imagen) para conseguir un efecto visual determinado. Nota: esto no incluye el texto que forma parte de una imagen que contiene otro contenido visual significativo. Ejemplo: El nombre de una persona en una etiqueta con su nombre en una fotografía”.

Las directrices no establecen requisitos de contraste para líneas o datos en mapas, cuadros o gráficos. Sin embargo, si quiere que su contenido gráfico sea accesible, le recomendamos que se asegure de utilizar un contraste suficiente también para estos elementos.

Color de fondo de la aplicación móvil

Hay quien dice que las tendencias en diseño web van y vienen: no tiene sentido seguirlas. Es una pérdida de tiempo, dinero y recursos. Un día, una tipografía grande y atrevida causa un impacto considerable, mientras que otro día, una fuente pequeña y elegante sorprende al público.

Sin embargo, un buen sitio web que haga bien su trabajo (presentar la empresa, promocionar el producto y generar conversiones) no solo debe ser funcional, sino también visualmente atractivo. Tiene que cumplir las normas técnicas de la web, así como las expectativas del público objetivo, que suelen centrarse en algo fresco y emocionante.

Estar a la última tiene un enorme impacto en el aspecto comercial de los proyectos. Mejora la posición de la empresa en el mercado y crea una base sólida para sacar el máximo partido a las campañas. Genera confianza y añade credibilidad, elementos cruciales en el proceso de toma de decisiones del cliente. En realidad, aporta una larga lista de ventajas vitales para que las empresas sobrevivan en el competitivo mercado actual, desde crear un factor sorpresa hasta proporcionar una funcionalidad muy necesaria.

Diseño web contrastado

Ante todo, las personas con discapacidad forman parte de nuestra sociedad y todos merecen el mismo acceso a la información. Crear productos inaccesibles significa excluir al 16% de la población. Cada decisión que tomemos puede reducir las barreras para interactuar con los productos. También puede contribuir al sentimiento de pertenencia a la sociedad digital. Diseñar pensando en a11y permite y aprovecha toda la diversidad humana, gracias a la cual todos podemos ayudarnos mutuamente.

No sólo diseñamos para las personas con discapacidad, sino también para nuestros futuros nosotros. ¿Por qué? Nunca se sabe adónde te lleva la vida. Y no estoy diciendo que vayas a tener un accidente y acabar con algún tipo de discapacidad (pero oye, puede pasar). Pero tienes que tener en cuenta que hay escenarios en los que estamos temporalmente, o incluso situacionalmente, incapacitados. Echa un vistazo a continuación:

Las mismas soluciones que funcionan para las personas sordas pueden ser útiles para quienes trabajan en un entorno ruidoso, como un pub. Supongamos que has ido al oftalmólogo y te han puesto unas gotas en los ojos que te impiden ver bien durante 2 o 3 horas. Antes tienes que comprar un billete, buscas una aplicación en tu teléfono, pero te das cuenta de que no ves bien por culpa de esas gotas. El ajuste para personas con problemas de visión te vendrá de perlas.

Cómo crear una paleta de colores

Diseñar un sitio web que sea a la vez funcional y atractivo conlleva un montón de consideraciones importantes, como si los usuarios conectarían intuitivamente más con el turquesa o el cian, y si cualquiera de ellos funcionaría con la marca. Sin embargo, un elemento que a menudo se pasa por alto pero que es igualmente importante en el proceso de diseño es la accesibilidad: asegurarse de que todo el mundo pueda acceder al sitio, independientemente de sus capacidades.

Un ejemplo fantástico de diseño web accesible es el sitio de demostración de Umami para Drupal. (Drupal es un CMS de código abierto que se toma la accesibilidad muy en serio). Utilizaremos Umami (un sitio web de recetas) para ilustrar algunos de los siguientes ejemplos.

Según WebAIM, el contraste deficiente del texto es la barrera de accesibilidad número uno en el millón de sitios más visitados. Utilizar un contraste adecuado entre los distintos elementos de una página (por ejemplo, el texto y el fondo) es importante tanto para los usuarios miopes como para los daltónicos. (Yo también aprecio un buen contraste cuando intento leer mi teléfono junto a la piscina bajo un sol radiante después de tres margaritas).