Patrocinado por docxpresso.com

Modelo de contrato
para desarrollo informático

Envía tu curriculum
y te avisamos cuando se descarga

Propuesta de desarrollo
para web coporativa

Portada > Artículo | 14-01-2003 - Luis Villa

Empleo del color

Resumen: A la hora de utilizar color en diseño web hay que tener en cuenta su utilidad, su significado, su capacidad para comunicar y transmitir sensaciones y el entorno cultural, pero también las convenciones uniformemente aceptadas en el diseño de interfaces de aplicaciones informáticas.

Valoración media: 0,02 | Votos: 10401 | Lecturas: 54773

Color

El color se define negativamente como aquel aspecto de la sensación visual que no se debe a los atributos espaciales o temporales de una luz. El no referirlo como un atributo de la luz se debe a que no necesitamos luz para experimentar color.

El color en sí es una experiencia ya que depende de la percepción de las personas (y de los animales). Un mismo color puede ser percibido de diferentes maneras por diferentes personas por motivos diversos: edad, enfermedades o disfuncionalidades de la visión, como el daltonismo.

Por otra parte, su efecto emocional difiere según el entorno cultural. Como ejemplo de opuestos: para simbolizar el luto, la muerte en occidente tenemos el color negro mientras que en la cultura japonesa, para el mismo motivo, se utiliza el blanco.

El color tiene tres atributos cuyo juego permite crear variaciones:

Tono: calidad del color
Luminosidad: grado de blanqueza o reflectancia a la luz
Saturación: pureza del color, grado de fuerz/carga de un color concreto.

Una división de los colores diferencia Colores Cálidos como naranja, rojo, amarillo que transmiten sensación de intimidad, placer, cercanía, de los Colores Fríos como azul, violeta o verde, que producen una sensación de distancia, y frialdad. (Se llega a diferenciar un tipo frente a otro por su efecto sobre la presión sanguínea de la persona que percibe el color: los cálidos la aceleran, mientras los fríos la relajan).

Color: su utilización en pantalla

Los colores nos permiten organizar y agrupar la información en una pantalla, así como atraer la atención sobre elementos concretos. Para diferenciar elementos, conviene utilizar recursos redundantes para permitir la percepción de esas diferencias por los usuarios con deficiencias en la percepción del color, por ejemplo, no utilizar sólo un color rojo para destacar un elemento, sino acompañarlo de recursos redundantes como subrayados o recuadros.

Conviene utilizar colores de manera consistente. Ejemplo Amazon utiliza colores para ,marcar las diferentes secciones de un sitio: Ejemplo: Libros, verde; música, azul...

Los colores más utilizados en las aplicaciones informáticas son los grises y azules. Tonos fríos que transmiten relajación y más adecuados cuando vamos a pasar largas horas ante un monitor.

Curiosamente, las pantallas de error de los sistemas Windows son de un azul intenso. ¿El color que simboliza un error no es el rojo? Seguramente no reaccionaríamos de idéntica manera ante el mismo mensaje sobre un fondo de color rojo sangre.

Colores semánticos

Es importante conocer que el el diseño de interfaz de usuario de aplicaciones informáticas, hay colores con significado según qué aplicaciones y que permiten una mejor comprensión de los datos que estamos visualizando. Por ejemplo, el rojo en aplicaciones financieras indica un saldo deudor.

En contexto de interfaz de aplicaciones son convenciones en uso de color:

Gris: Estado de inactividad, deshabilitado.
Verde: Correcto, permitido, no crítico.
Amarillo: Advertencia, cuestión crítica, alerta.
Rojo: error, parada, error, prohibición.
Azul: en interfaz de navegador corresponde con el color por defecto de los hiperenlaces de una página web.

En el caso de las personas con discapacidades visuales relacionadas con la percepción de color se deben utilizar recursos adicionales para la comprensión.

Los significados del color

Rojo: es un color que destaca en cualquier composición. Es un tanto agresivo ejemplo: Ferrari Rojo. Transmite: excitación, pérdidas financieras, peligro, alto, error, sexualidad, pasión, sangre. Activa la circulación, eleva la presión arterial y acelera la respiración.

Amarillo: El amarillo es el color del sol, de la luz. Transmite sensaciones alegres pero también sirve para transmitir avisos, precaución. (Muy utilizado en las señales de tráfico en EE.UU.).

Verde: el color de la naturaleza, la vegetación. Transmite frescor, salud, los verdes azules son los favoritos de los consumidores. Simboliza "un paso más": correcto, avanzar (semáforos). Es un color sedante, ayuda al reposo y la vista.

Azul: el color de la credibilidad (en la mayor parte de los informativos el tono predominante de fondo es el azul, así como en comunicaciones corporativas o gubernamentales): transmite seriedad, credibilidad, serenidad, tranquilidad. En su justa medida, potencia la paciencia y la amabilidad.

Negro: color del luto en los paises occidentales: Misterio, lujo, poder, elegancia.

Púrpura: el color de la riqueza, del poder. (Empreradores Romanos, Cardenales de la Iglesia, Reyes...): riqueza, lujo, inteligencia, sofisticación, misterio.

Blanco: luto en los paises orientales. Transmite pureza, limpieza, luminosidad pero también vacuidad. Es muy utilizado en diseños minimalistas.

Gris: Es el color más neutro e incluso aburrido. Expresa elegancia, aburrimiento, vejez.

Visualización: errores a evitar en el empleo del color en monitores

Al diseñar para pantalla de ordenador, conviene evitar:

La utilización de colores demasiado saturados

Utilizar una paleta de colores extensa

Poco contraste de contenidos y elementos de lectura: Existe una tendencia de diseño de presentar en contenidos, los textos en tonos grisáceos sobre fondo blanco, lo que genera algunos problemas de legibilidad. ejemplo incorrecto, texto verde sobre fondo amarillo; ejemplo correcto: texto negro sobre fondo claro.

Puntúa este artículo 1 punto 2 puntos 3 puntos 4 puntos 5 puntos


Artículos más leidos en Alzado.org

Qué es un problema. Metodología para el diseño

Bájate estos documentos ejemplo de propuesta web

Philip Kotler: los 10 principios del Nuevo Marketing

Fuentes, tipos de letra y recursos tipográficos


© Alzado.org | Algunos derechos reservados. Licencia Creative Commons