Ejemplos de contraste de color

Ejemplos de contraste de color

Contraste de color para el verde

Un aspecto importante del color en la Web, tanto para los usuarios con baja visión como para los daltónicos, es el contraste suficiente entre el primer plano (texto o gráficos) y el fondo. El máximo contraste es el negro frente al blanco, pero esta combinación puede considerarse demasiado abrumadora (podría causar deslumbramiento). Se pueden utilizar otros colores -como el azul marino, el verde oscuro o el granate para los oscuros, y los pasteles para los claros- para atenuar el contraste.

Sin embargo, algunos diseños modernos son tan «sutiles» que el contraste puede resultar insuficiente para algunos lectores. Algunos ejemplos son el contraste entre el gris claro y el gris medio, los pasteles medios y los oscuros, o el blanco y el cian claro (azul-verde). Si piensa utilizar una paleta de colores sutil, se recomienda utilizar un analizador de color para asegurarse de que hay suficiente contraste.

En la mayoría de las pruebas en línea, se introduce el código de color hexadecimal de los colores de primer plano (texto) y de fondo, y el comprobador genera un resultado numérico. Por lo general, un número o ratio bajo indica que el contraste es insuficiente.

El contraste de muchos colores vivos (por ejemplo, rojo/verde, azul/naranja, etc.) no pasa la prueba de contraste porque son similares en valores en términos de oscuridad de luminosidad. Consulte la página Trabajar con colores vivos para obtener más detalles.

Leer Más  Alien skin blow up

Rueda de contraste de colores

Dos colores de diferentes segmentos de la rueda del color son colores contrastados (también conocidos como colores complementarios o enfrentados). Por ejemplo, el rojo pertenece a la mitad cálida de la rueda del color y el azul a la mitad fría. Son colores que contrastan.

En la ciencia y la teoría del color, existen definiciones precisas de los colores contrastados y complementarios y de cómo aparecen en la rueda del color. En el diseño gráfico y otros campos, utilizamos una interpretación más flexible. Los colores no tienen que ser directamente opuestos ni tener una separación determinada para ser considerados contrastados o complementarios. En el diseño, se trata más de la percepción y la sensación.

También es posible que veas estos colores opuestos denominados colores complementarios, que generalmente se refieren a cada uno de un par de colores que están directamente o casi directamente opuestos en la rueda de color, como el púrpura y el amarillo.

Los rojos y los verdes son colores contrastantes. Cuantos más colores de transición separen dos colores, mayor será el contraste. Por ejemplo, el magenta y el naranja no son un par tan contrastado como el magenta y el amarillo o el magenta y el verde.

Colores de bajo contraste

El contraste de los colores es un problema común de accesibilidad web que a menudo se pasa por alto. Las personas con baja visión o daltónicas pueden tener dificultades para distinguir el texto del color de fondo si el contraste es insuficiente. Hay casi tres veces más personas con baja visión que con ceguera total; y una de cada doce personas tiene algún tipo de deficiencia cromática. Por lo tanto, es fundamental tener en cuenta un contraste adecuado entre el texto y el fondo.

Leer Más  Rayos de luz photoshop

Para la conformidad con el nivel AA, el criterio de éxito 1.4.3 de las WCAG 2.0 recomienda que el texto normal tenga una relación de contraste mínima de 4,5:1 y que el texto grande (de 18 puntos o 14 puntos en negrita) tenga una relación de contraste mínima de 3:1. Estas proporciones se han calculado científicamente para garantizar que el texto pueda ser leído por las personas con baja visión moderada y que el contraste sea suficiente para quienes tienen deficiencias cromáticas. Una pregunta habitual que se hacen los diseñadores de páginas web al abordar el contraste de colores es qué colores deben evitar. No se trata tanto de evitar los colores como de garantizar que los colores utilizados en el diseño web tengan el contraste adecuado.

Generador de contraste de colores

En pocas palabras, el contraste es la diferencia entre dos colores. En una página web, la cantidad de contraste necesaria varía según las diferentes partes de la página. Por lo general, se desea un alto contraste entre el texto y su color de fondo. Pero un contraste demasiado alto entre los elementos de diseño puede dar una impresión de desorden y desorden. El blanco y el negro crean el mayor contraste posible.

Los colores pueden contrastar en tono, valor y saturación, pero hay muchos tipos diferentes de contrastes que han sido definidos por los teóricos del color a lo largo de los años. Algunos de ellos quizá no sean directamente aplicables al diseño web, pero veamos algunos de los más importantes.

El contraste de tonalidad es el que se relaciona más directamente con las combinaciones de la rueda de color descritas anteriormente. Cuanto más alejados estén dos colores entre sí, mayor será el contraste. Esto significa que la combinación de colores complementarios tiene el mayor contraste, mientras que la combinación análoga tiene el menor. En el caso del texto, un contraste de tono por sí solo no suele ser suficiente para que el texto sea tan legible como se desea. En ese caso, es posible que desee combinar el contraste de tono con alguna otra forma de contraste.

Leer Más  Canon 18-135 is stm

Entradas relacionadas

Esta web utiliza cookies propias para su correcto funcionamiento. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Más información
Privacidad