Teoria del color en web 2

Teoria del color en web

Usabilidad

Rueda de color
• Aunque las combinaciones de colores pueden parecer
complicadas, todas suponen ciertas "reglas". Estas directrices
facilitan la comprensión de qué colores funcionan entre ellos
para añadir interés y contraste a una web.

Color generator
• El motivo por el que existen las ruedas de
color es que la gente las utilice. Las ruedas y
herramientasde colores como el Color
Generator en línea facilitan la elección del
color, incluso a diseñadores sin experiencia.
• - Paletton.com
• http://coolors.co
• http://colorschemedesigner.com

Combinaciones de color
•
•
•
•
.

monocromáticas
Complementarias
triádicas
tetrádicas.

• La filosofía de Nielsen de arquitectura web
esencial tiene las ventajas de la accesibilidad y
usabilidad, la mayoría delos diseñadores web
quieren añadir un toque personal a sus webs
con muchos elementos de diseño.
Afortunadamente, un diseñador puede añadir
color a una web sin perder accesibilidad y
usabilidad si la web está diseñada teniendo en
cuenta estas capacidades.

Colores, tonos y matices
• Los colores, o tonos, se han dividido
tradicionalmente en colores primarios, secundarios
y terciarios. Loscoloresprimarios son el rojo, el
amarillo y el azul, y se denominan primarios porque
no hay que mezclar colores para conseguirlos. Si
queréis traducir estos colores en colores web,
podéis reproducirlos utilizando sus equivalentes
• hex (hexadecimales) #ff0000, #ffff00 y #0033cc
como se muestra en la figura 1:

• Aunque los colores web son diferentes de los
colores normales "de los pintores", puedeser
útil tener una rueda de colores y tenerla a
mano mientras aprendéis las diferentes
combinaciones de colores. Además, una rueda
de colores os mostrará todos los colores,
tonos y matices para empezar a ver las
posibilidades de colores de las que disponéis.

A continuación, se enumeran algunos términos
importantes que hay que aprender:
• Tono (tint): el color resultante cuando se
añade blanco.
•Tonalidad (tone): el color resultante cuando se
añade gris.
• Matiz (shade): el color resultante cuando se
añade negro.

• Las flechas de la figura 2 indican cosas diferentes, a saber:
• Lado más exterior: color terciario de amarillo naranja (amarillo
+ naranja).
• Segundo lado: tono de este color terciario (blanco añadido).
• Tercer lado: tonalidad del color (gris añadido).
• Lado másinterior: matiz sobre la rueda imprimida (negro
añadido).
• Como se puede ver en la rueda de colores anterior, la cantidad
de blanco, gris y negro añadido a un color es mínima, pero
suficiente para alterar el color original y crear lo que se conoce
como combinación de colores monocromática.

Combinaciones de colores monocromáticas
• Las combinaciones de colores existen desde
hace siglos, de manera queno hay que
reinventar la rueda de colores. Aunque el
color de la web sea diferente del color
imprimido, los conceptos son los mismos. Sólo
es necesario cambiar los números
hexadecimales por nombres de colores y
hacer que coincidan lo máximo posible.

• Una combinación de colores
monocromática equivale a un color y todos
sus tonos, tonalidades y matices. Aunque esta
combinación es la más sencillade utilizar, para
muchos diseñadores no aporta mucho interés
al diseño de una web. En vez de eso, quizá os
atraiga explorar otras combinaciones para
añadir variedad a vuestros enlaces, imágenes
y banners.

Combinaciones de colores complementarios
• La siguiente familia de combinaciones de
colores que cabe descubrir es la combinación
de complementarios, donde se emparejan los
colores que seencuentran directamente
opuestos entre ellos en la rueda de colores

El caso de Greenpeace USA

• Greenpeace USA ) es uno de los muchos sitios que
utilizan una combinación de colores con contraste.
Sí, se puede ver amarillo y naranja, pero los colores
predominantes son el verde y el rojo, dos colores
que están directamente opuestos entre ellos en la
rueda de colores. Con este método de colores...