Color

El color es tanto un fenómeno físico como una percepción.

Como fenómeno físico es una pequeña porción visible del espectro

electromagnético. La luz visible tiene una longitud de onda de 400 a 700
nanómetros. Diferentes longitudes de onda corresponden a diferentes colores
del arcoíris.

Longitud de onda Color

610-700 nm Rojo
480-610 nm Verde
450-480 nm Azul
Si se combinan equitativamente las tres longitudes de onda surge el blanco. De
otra manera la ausencia total de luz es el negro.

Cuando la luz golpea la retina del ojo, esta puede estimular tres tipos de conos,
que perciben el color: Unos para el rojo, otros para el verde y otros para el azul.
En los rangos límites de un color y otro se ubican las combinaciones de ellos.
del azul al verde se encuentra el rango del amarilllo por ejemplo.

El ojo humano es más sensible al rango de verde y mucho menos al rango de

azul. La mayoría de las luces y colores en la vida real son una mezcla de las
tres longitudes de onda. De acuerdo a la cantidad que haya de cada rango, el
cerebro interpreta la mezcla final como un color determinado.

La manera en que el cerebro percibe el color se explica a través de la teoría del

triestímulo. Basado en que físicamente existen tres tipos de conos, se concluye
que cuando los tres perciban iguales cantidades de luz, el cerebro interpretará
esta mezcla como luz blanca.

Modelos del color.

Una persona normal puede percibir alrededor de 1 a 2 millones de colores, por

lo cual es prácticamente imposible describir un color específico sin utilizar un
modelo de color. Un modelo de color es un sistema de representación para
describir un color más precisamente de lo que podría hacerse con nombres y
adjetivos.
 Existen cuatro modelos de color útiles para el
diseño web:

1. RYB: Red-Yellow-Blue.

P rimer modelo de color creado en 1613 por

Francis Aguilon. Define como colores primarios
al rojo, amarillo y azul. Isaac Newton los ordena
en un patrón circular. Este modelo de color aun
se utiliza por artistas para crear esquemas de
color.

2. RGB: Red-Green-Blue.

El modelo RGB describe a los colores como una mezcla de rojo, verde y azul. Es
un modelo de color aditivo, en donde mezclar dos colores da uno más brillante.
Por ello este tipo de modelos se usan para describir colores que emanan de
cuerpos fluorescentes como luces, televisores. y monitores de computadora.

Al mezclar los tres rayos de color primarios se obtienen en sus superposiciones

de dos colores el cyan, amarillo y magenta. Donde se superponen los tres se
forma el blanco, y donde no hay luz, está el negro. Por su propia naturaleza lo
que se vea en un monitor depende de la luz del cuarto en el que se vea. En un
cuarto oscuro, los colores serán más vivos y por ende sus cambios más ligeros
serán notables, mientras que en un cuarto bien iluminado sucederá lo
contrario.

Este modelo de color tiene algunas variantes en cuanto a los valores numéricos
que tiene. En algunas aplicaciones sus valores van del 0 al 255. En otras, se
expresa como un porcentaje.
 3. CMYK: Cyan-Magenta-Yellow-blacK.

Modelo de color diseñado para los objetos que reflejan

la luz. Es sistema de color sustractivo en el que la
mezcla de dos colores da un tercero más obscuro. Esta
es el área de la pintura y la tinta para impresión. Así la
mezcla de dos de los colores primarios da el azul,
verde o rojo y los tres superpuestos dan un gris oscuro
como resultado en vez del negro que teóricamente
debería resultar. Para obtener el negro se debe de imprimir con tinta negra.

Este modelo de color es el utilizado por las impresoras de color, llamado

impresión a cuatro colores. Cuando se imprime una imagen a color, ciertos
controladores convierten los valores RGB de la imagen a otros CMYK para
poder imprimirla.

4. HSB: Hue-Saturation-Brightness.

Es el sistema más parecido a los tradicionales

basados en pintura. Matiz es el nombre del color
(rojo, azul, naranja) que se presentan en un
arreglo circular, donde cada color tiene un valor
entre 0 y 360.

La saturación se refiere a la pureza del color. Un

color puro sin mezclarse con otro, es un color
totalmente saturado. Al contrario, un color pálido
incluye gran cantidad de blanco mezclado por lo
que está pobremente saturado.

La saturación tiene valores de porcentaje. El blanco, los grises y el negro tienen

saturación cero.

El brillo describe el tono del color en una escala que va de blanco a negro,
siendo el blanco el máximo brillo. Al igual que la saturación sus valores van del
0 al 100%.

Relacionando las tres variables resulta que a menor brillo, hay un menor rango
de saturación y el matiz se vuelve más pequeño. Esto se debe a que los
humanos somos menos capaces de percibir diferencias de matiz y saturación
en los colores oscuros.

Comparando los cuatro modelos

El modelo RGB está orientado al hardware, debido a que los puntos de un
monitor brillan en colores rojo azul y verde. De manera similar el modelo CMYK
está pensado a la tecnología porque describe los colores de la tinta.

El objetivo de crear el sistema HSB y otros similares fue obtener una manera
de describir los colores fácilmente. Tanto en RGB como en CMYK es muy difícil
para el cliente reconocer un color en términos numéricos, por lo que era
frustrante conseguir un color determinado sin la ayuda de algún asistente. En
cambio el sistema HSB es más cercano a las descripciones que hacen los
clientes.

Cada sistema de colores tiene una gama o rango de expresión de colores, pues
no todos los colores pueden ser expresados en todos los modelos de color.
CMYK tiene una gama de colores más pequeña que el RGB o el HSB,
provocando que no pueda reproducir colores con alta saturación y brillo. Esto
se comprueba con algunos colores brillantes en la pantalla que al imprimirse
resultan en un tono más oscuro, pues el color esta fuera de la gama CMYK

Esquemas de armonía de color.

Un esquema de c olores efectivo puede aumentar considerablemente el

atractivo de un sitio web. Los esquemas de armonía de color son
combinaciones de colores que suelen ser agradables. Existen cuatro esquemas
de armonía de color:

1. Monocromático.
2. Complementario.
3. Análogos.
4. Triádico.

Cada uno de ellos tiene una metodología sistemática para escoger los colores
que combinan efectivamente.Los esquemas de color se basan en las mezclas
entre colores primarios según la posición que tienen en la rueda de color. De
las mezclas surgen colores secundarios y terciarios, duplicándose cada vez. Los
12 colores resultantes pueden considerarse calientes o fríos. Lo calientes son
los colores del sol (amarillo, naranja y rojo) y los colores de los cuerpos de agua
(lagos, océanos) son fríos (verde y azul).

Esquema Monocromático.

En el esquema monocromático todos los colores tienen el mismo matiz,

variando únicamente en saturación y brillo. Además aumenta el sentido de
uniformidad en el diseño general de una página web. Es posible crear páginas
atractivas usando pocos tonos.

http://www.iusacell.com.mx/
http://www.u3.com/smart/default.aspx

http://portableapps.com/apps

Esquema Complementario.

Usa un par de matices complementarios. Dos

colores son complementarios si están opuestos
en la rueda de color. Los colores de un esquema
complementario pueden tener cualquier
saturación o brillo, siempre y cuando pertenezcan
a uno de los dos matices.

De los dos matices uno debe de ser el dominante,

que debe de llenar áreas grandes de la interfaz y
el otro se debe usar para resaltar pequeñas
áreas.

http://www.pan.org.mx/

http://www.pemex.com/

http://www.presidencia.gob.mx/

Esquema Análogo

Dos o más colores cuyos matices están cerca en

la rueda de color. Los esquemas análogos
asemejan los esquemas de colores encontrados
en la naturaleza, como el pasto, el pelaje de un
animal o una puesta de sol.

Las combinaciones de color en un esquema

análogo son más interesantes si los colores no
tienen la misma saturación y brillo.

http://selenguolatraba.com/
http://www.nokia.fr/

http://www.movistar.com.mx/

Esquema Triádico

Triada: Los tres colores que lo componen están

dispuestos más o menos a la misma distancia en
la rueda de color.

Este esquema usa colores cuyos matices forman

una triada. Por ello ofrece una amplia variedad al
elegir colores y puede provocar emoción, sin
embargo, puede volverse tan fuerte que interfiera
con la comunicación textual de la página. Una
forma de evitarlo es elegir colores que varíen en
saturación y brillo.

http://a.viary.com/home

Se recomienda limitar el número de colores para texto y fondo a siete, además

del blanco y negro.

Todos los esquemas de color pueden ser de utilidad en situaciones en las que
un cliente tiene ciertas especificaciones sobre el uso de colores, como por
ejemplo.

• Cuando el cliente quiere que el color de su logo predomine en el sitio.

• Universidades que prefieren que la página inicial y el subsitio
administrativo tengan los colores institucionales.

En estos casos, una vez conocidos los colores que se deben usar, un esquema
de armonía de color ayudan a elegir que otros colores que se verán bien. De la
misma manera cuando se tiene control total en el sitio, los esquemas de color
ayudan a darle un mejor acabado y profesionalismo al mismo.

Color en el Texto y en el Fondo.

Para permitir que el texto sea legible, los colores deben de proveer comodidad
y velocidad al leer. En general se debe buscar un gran contraste entre los
colores de texto y fondo. Las mejores opciones son el texto negro con fondo
blanco o gris claro.

El texto oscuro en un fondo claro es mejor al texto claro en fondo oscuro, por
ello se recomienda usar texto oscuro en un fondo blanco o algún otro que como
en los ejemplos anteriores, tenga alto brillo y baja saturación.
Del otro lado están las combinaciones menos efectivas: aquellas que de
acuerdo al sistema RGB varían únicamente en la cantidad de azul, como el
amarillo y el blanco. Esto se debe a la poca sensibilidad del ojo humano al
espectro de luz azul.

En cuanto al contraste es mejor no usar combinaciones muy brillantes y

saturadas como el rojo-verde, rojo-azul, magenta-cyan, pues provocan
cansancio visual.

http://www.havenworks.com/

El color como organizador y atractor de atención.

Los colores pueden ayudar a organizar visualmente una página web. Basados
en el principio de proximidad de la psicología Gestalt, los colores pueden dividir
los niveles de navegación.

http://a.viary.com/halloffame

http://www.glittergraphicsnow.com/es/

De la misma manera los colores pueden organizar la página en distintas áreas,

diferenciando la barra de navegación, los titulares y la información general. De
esta forma se da mayor estructura al sitio.

http://www.ciudaddelasideas.com/

http://www.softonic.com/

Otra manera de usar los colores es para llamar la atención del usuario. Los
colores brillantes y saturados también pueden llamar la atención. En la vida
real un rojo saturado puede dar signos de peligro o el naranja de los signos de
tráfico permite que los conductores vean fácilmente los señalamientos. De la
misma manera en un sitio los colores brillantes y saturados compiten por la
atención del usuario y deben ser usados con moderación. Se recomienda
aplicarlos a pequeñas áreas de la pantalla

http://free.avg.com/

http://pixlr.com/

Conclusión.

1. Los colores generalmente deben ajustarse a las elecciones del cliente y

las armonías de color dan opciones para elegir colores que son
compatibles con los deseados por el cliente.
2. Usar colores adecuados para texto y fondo mejorará la legibilidad.
3. Usar el color para organizar el texto y centrar la atención del usuario
resultará en una mejor navegación.
4. Bien usado, el color mejora tanto la usabilidad como el atractivo de un
sitio.