Aplicación y uso de colores en la web

La palabra color viene del latín colōris, y se define como una experiencia sensorial, en la cual los objetos reflejan o absorben longitudes de onda de luz dependiendo del material del que estén hechos, dando como resultado  los colores que percibimos a través de los ojos, después de lo que se puede considerar un trabajo conjunto entre la retina y el cerebro humano.

Por: Laura Delgado Londoño

Todo lo que refiere a la utilización de el concepto de color es relativo a su entorno de aplicación, en este caso especifico toda la aplicación de color en el tema web y digital son el encabezado principal que permitirá fundamentar su aplicación, ya que esto tendrá una influencia bastante grande en como los usuarios perciban y que sensación les cause; y aunque puede llegar a ser un tema subjetivo para cada usuario por sus preferencias, también existen algunos criterio objetivos para obtener equilibrio y armonía en una creación web o digital.

 

Aunque no se establecen normas estrictas, existen conceptos fundamentales que se deben tener en cuenta en la aplicación web del color, como:

  1. El numero de colores en página:

    Se puede decir que 6 o más colores puede llegar a ser demasiados en la web si existe gran contraste entre ellos, pero también puede ser una opción si la relación entre ellos es adecuada. Es importante resaltar que siempre será mejor tener pocos colores que mucho, así como también establecer una cantidad mínima de colores que se deben usar, en este caso 3 colores podría ser un numero equilibrado en el cual se involucren, un color primario, uno secundario y un destacado para resaltar aspectos concretos.

  1. Relación entre colores:

    Según su posición relativa en el Círculo Estándar de Color, los colores pueden ser:”webusable.com

  • Colores Análogos: Para un color dado, sus colores análogos son aquellos que se encuentran a ambos lados del mismo en el círculo de color.
  • Colores Complementarios: Son aquellos que se encuentran opuestos en el círculo de color (por ejemplo el amarillo y el violeta). Usados juntos producen un gran contraste destacando mucho uno sobre el otro. Su efecto puede ser llamativo y hasta agresivo.
  • Colores Monocromáticos: Son aquellos que se encuentran aislados, sin presencia de otros colores. Usados producen sensación de unidad, homogeneidad y robustez. Se puede evitar la monotonía utilizándolos con diferente luminosidad (más clara y más oscura).
  • Colores Complementarios Adyacentes: Dado un color, sus complementarios adyacentes son los colores análogos de su color complementario.
  • Colores Triada: Tres olores constituyen una Triada cuando sus tonos son equidistantes en el Círculo Estándar de Color.
  • Esquema Cromático Monótono: Un esquema de color monótono lo constituyen un único tono de color junto a sus posibles variaciones en términos de tintes, luminosidad y saturación.
  • Esquema Acromático Monótono: Un esquema de color acromático monótono es un caso particular del esquema de color monótono constituido sólo por colores neutros dentro de la gama del negro al blanco.
Círculo cromático
  1. Contraste entre colores:

    El contraste entre dos colores lo hace la diferencia que existe entre ambos, así que cuanto mayores sean las diferencias en términos de tono, luminancia y crominancia, podremos distinguir un mayor contraste y así esto permitirá elegir con mayor eficiencia la sensación que se va a transmitir a los usuarios.

La Teoría del Color define muchos tipos de contraste y, aunque algunos no son especialmente aplicables a páginas web, es muy interesante conocerlos para profundizar en el conocimiento del efecto de los colores.” webusable.com

  • Contraste de Tono: Está relacionado directamente con las distancias entre dos colores dentro del Círculo Estándar de Color; así, cuanta mayor es la distancia entre dos colores dentro del círculo, mayor es el contraste entre ambos.
  • Contraste de Luminancia (o de Valor): Permite crear grandes contrastes con el mismo tono de color sólo mediante el brillo de luz. En general este tipo de contraste, aún siendo grande, es agradable al ojo humano, con lo que usarlo en diseños web suele ser trabajar sobre seguro. Como contrapartida, no arriesgar en la combinación de tonos, puede significar apostar por un diseño convencional, poco impactante.
  • Contraste de Saturación: El contraste de saturación con frecuencia es el más adecuado para resaltar aspectos de la página web de una forma moderada, poco estridente. Un efecto interesante se obtiene utilizando áreas con diferentes saturaciones con un fondo gris: se produce una sensación de transparencia que puede ser muy apropiada en ciertas circunstancias.
  • Contraste Simultáneo: Es un efecto creado por nuestro sistema visual que, dado un color predominante, tiende a requerir su color complementario. Este efecto puede obtenerse combinando dos colores brillantes pero que no sean complementarios, o, simplemente, utilizando un color brillante sobre un background neutro (un color de la gama de los grises).
  • Combinación de contrastes: Es lo más frecuente, sobre todo cuando se trata de resaltar textos

  1. Los colores y el texto:

    Anteriormente se habla de la importancia de el contraste de los colores para lograr un buen efecto, y es de suma importancia cuando se trata de escribir y resaltar un texto, que garantice tanto su legibilidad como su equilibrio con el resto del diseño, así mismo se debe tener en cuenta que muchos de estos usuarios que lean el texto pueden tener disfunciones en la vista y que es de vital importancia la debida aplicación de colores en los textos.

Todos los aspectos nombrados anteriormente son pilares fundamentales que al ser tenidos en cuenta a la hora de aplicar un diseño web, pueden garantizar no solo una gran acogida por parte del usuario, sino también un excelente desempeño de todos los aspectos que complementan el diseño, además también es importante conocer no solamente la identidad de la marca a tratar, sino también cómo funcionan los colores en los usuarios, que significado tienen y que uso se les debe dar a nivel de diseño, para lograr un complemento ideal y armónico para los usuarios.

  • Rojo: es un color altamente visible y considerado emocionalmente intenso por lo cual es usado para estimular a las personas a tomar decisiones rápidas. Generalmente se usa en los sitios web como color “destacado”, es aconsejable no seleccionar este color como color principal.
  • Naranja: este color suele usarse para llamar la atención sobre algún elemento particularmente importante del diseño; si bien es un color cercano al rojo, no es tan agresivo como éste. Suele utilizarse como color predominante en sitios relacionados al turismo o empresas jóvenes con una visión de negocio más desestructurada.
  • Amarillo: estimula la actividad mental y genera energía; es un color asociado a la vitalidad. Este color es muy usado como color secundario o destacado por su estridencia natural, sin embargo, actualmente es común verlo como color principal en sitios relacionados a e-commerce, o en páginas de comunidades y ONGs.
  • Verde: es el color de la naturaleza. Simboliza prosperidad, armonía y fertilidad, sugiere estabilidad. Se usa en sitios relacionados a ecología, finanzas y medicina.
  • Azul: es un color asociado a la estabilidad, a la sobriedad y a la seguridad; es por ello que se usa frecuentemente como color principal en sitios de corporaciones tradicionales, grandes empresas consolidadas en el mercado y sitios gubernamentales
  • Negro: está asociado al poder, al estatus y al lujo. Se utiliza principalmente en sitios relacionados a objetos de lujo, orientados a un target de alto poder adquisitivo. Puede verse frecuentemente en sitios de artículos electrónicos de alta gama, bodegas y joyerías.

Elegir y determinar correctamente las aplicaciones de el color en un diseño web garantizara una efectiva comunicación no solo de la marca sino también de aquello que se requiere transmitir de forma destacada.

Cibergrafía

  1. http://sobreconceptos.com/color
  2. http://www.webusable.com/coloursMix.htm
  3. http://sobrecolores.blogspot.com/2010/12/que-es-el-circulo-cromatico.html
  4. http://desarrolloydisenoweb.grupocreartel.com.ar/
  5. http://www.mariaclaudiacortes.com/
  6. http://www.pinturayartistas.com/los-7-contrastes-de-colores-de-johannes-itten/

Anuncios

Un comentario en “Aplicación y uso de colores en la web

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s