psicología del color aplicada al diseño web
TRANSCRIPT
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
1/17
Psicología del Color aplicada al Diseño Web
porVerónica Valenzuela | 13/10/2015
Los colores forman parte de nuestra vida, de hecho a veces guían
nuestras decisiones casi sin que nosotros nos demos cuenta. Cada uno
de ellos transmite unos sentimientos, que pueden cambiar nuestra forma
de actuar. Son muy poderosos, así que… ¿Estás preparad@ para usarlos
en tu web?
A lo mejor hay por ahí algún “despistaillo” que no se ha dado cuentade que los colores forman parte de nuestra vida. Tanto, que a veces
son los encargados de transmitir emociones y conseguir que varíe
nuestro estado de ánimo.
ada color va unido a uno o varios sentimientos y viceversa, a cada
uno de los sentimientos podemos aplicarle un color. !i hoy me levanto
triste, el día está gris y me visto con ropa en tonos t"rreos,
seguramente sea más difícil que el día vaya a mejor. !i por el
contrario, cam#io los tonos t"rreos de mi ropa por unos vivos,
http://octuweb.com/psicologia-color-aplicada-al-diseno-web#authorhttp://octuweb.com/psicologia-color-aplicada-al-diseno-web#author
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
2/17
posi#lemente poco a poco vaya encontrando algo de positivismo. $
ese peque%o gesto que hacemos a diario, lo podemos e&trapolar a
todos los ám#itos de la vida.
¿Qué significado tiene cada uno de los colores?
'ue el cielo es a(ul y la hier#a verde no es ningún descu#rimiento. !i
os digo “amor” todos vais a pensar en rojo, pero y )si os digo
“cam#io”* !eguro que muchos estar"is pensando en el naranja+
omo decíamos, cada una de las emociones lleva asociado a un color
por lo que a la hora de dise%ar nuestra e#, tenemos en cuenta lo
que queremos transmitir, la elecci-n del color adecuado nos puede
ayudar a conseguirlo.
)acemos un resumen de la psicología de los colores principales*
Azul: /a(, tranquilidad, sosiego+ 0n color muy usado en eldise%o porque todas las cualidades que transmite son positivas.!in em#argo es un mal color para llamar la atenci-n porque nodestaca.
Verde: 1ás que un color es un sentimiento y una manera deser. !uele estar unido al paso anterior que lleva al 2n de unproceso, por lo que es muy usado en los #otones que validan.
Rojo: fuer(a, pasi-n+ 1uy útil para llamar la atenci-n, perohay que usarlo en su justa medida pues podemos pareceragresivos.
Naranja: 3l representante del cam#io por e&celencia, y comoveremos a continuaci-n el mejor para llamar la atenci-n so#realgo.
Amarillo: 3l color más am#iguo de todos, pasa de la alegría ala envidia con solo un cam#io de tonalidad. Al ser tan inesta#lehay que tener cuidado cuando lo usamos en el dise%o.
Rosa: 3s un color del que no se puede decir nada malo. 3stámuy unido en el dise%o a lo infantil y lo femenino.
Violeta: 0n color arriesgado porque va unido a lae&travagancia. /ero ya sa#"is, el que no apuesta no gana4
Negro: olor del lujo y la elegancia. 5uen color para el dise%opues puede com#inarse con todos los colores.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
3/17
Blanco: olor de la pure(a y la sencille(, al igual que el negrocom#ina con todos los colores.
Gris: Aunque es un color casi sin carácter, es un #uencomplemento, pues quita algo de peso al color negro.
Marrón: !i con algo podemos relacionar este color, sería a lacalide( del hogar. 3n el dise%o está muy unido a alimentos quetienen ese mismo color.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
4/17
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
5/17
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
6/17
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
7/17
nuestro color corporativo. !iempre que se cree contraste conestas llamadas a la acci-n , es un #uen momento paraintroducir el color corporativo.
Color de los links: a menudo usamos el color corporativo para
lins o títulos en nuestra página e#, pero cuidado4 !i tu colortiene fuer(a y so#re todo un alto contraste, enhora#uena,puedes utili(arlo. 3n el caso de que esto no sea así, lo siento,pero de#es #uscar un dise%o diferente para aplicar a losenlaces. /odemos su#rayarlo o ponerle fondo pero siempre hayque tener en cuenta que no podemos perder la legi#ilidad delte&to. olores como el amarillo o el verde claro no suelenfuncionar Baunque depende de la tonalidad7
Fondo de la we: para el fondo de la e# tenemos variasopciones, principalmente podemos usar una te&tura o patr-n oun fondo plano. !in em#argo, antes de tomar una decisi-nde#es sa#er esto@ la mejor com#inaci-n entre te&to y fondo, laque crea contraste y da una legi#ilidad más alta es la del te&toen negro y el fondo en #lanco. 3so es así, por mucho que nosduela. 8os patrones molan, pero úsalos siempre como fondo enuna e# en la que el te&to vaya so#re #lanco, en un dise%o detarjetas por ejemplo.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
8/17
:e la misma manera, tra#ajar so#re fondos negros o oscuros no es
una #uena opci-n. 8a legi#ilidad del te&to so#re fondos negros es
peor y la vista tienda a cansarse con más facilidad. !i nuestros
colores e# son el #lanco y el negro, podemos usar este ultimo en el
footer o en el menú, lugares donde escri#iremos menos pala#ras, que
por ejemplo, como fondo para los artículos.
Conclusiones
$a que los colores van unidos a nuestros sentimientos+ usemos esto
a nuestro favor4 omo veis, si dise%amos pensando en los colores,
conseguiremos que nuestra e# sea más cercana a nuestro pú#lico y
por lo tanto nos ayudará a conseguir nuestros o#jetivos.
0na ve( sepamos el color que mejor encaja con nuestro pú#lico
o#jetivo, solo nos queda de2nir con e&actitud nuestro color principal y
encontrar una gama de colores que com#inen de forma arm-nica con
"l, teniendo siempre en mente la accesi#ilidad y legi#ilidad de
nuestros contenidos.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
9/17
5 reglas sobre el color:
el éxito de un diseño
web profesional
El diseño de una página web se basa no sólo en la composición o en
las formas, si no también en la combinanción de colores. Muchos
publicistas incluso indican que la asociación de los colores a una
marca es tan fuerte, que una mala combinación puede llevar al
fracaso.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
10/17
Ha que saber elegir los colores cuidadosamente, pues una visita
decide en cuestión de segundos si se queda o no en la página
web. !unque no ha reglas absolutas, tener en cuenta algunas
directrices puede audarnos a encontrar un diseño armónico.
"!#n no tienes una página web$ Elige tudiseño
%imdo es un sistema para crear fácilmente páginas web tiendas
online. Elige un diseño, añade el contenido en & minutos estará
online.
'rear página web
1. Identifica el público
obetivo de tu página web
(a importancia de elegir colores en base al p#blico al que nos
dirigimos radica en que la !a"or#a de los colores están asociados a
deter!inados grupos. (a página tiene ante todo que atraer
convencer a la visita. Es por eso que ha que seleccionar colores con
los que la visita se sienta identificada.
http://es.jimdo.com/dise%C3%B1os/http://es.jimdo.com/dise%C3%B1os/
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
11/17
)i el p#blico al que queremos llegar es a un p#blico másculino,
podemos utili*ar colores oscuros +como grises o negros o colores
fr-os +a*ules verdes. El p#blico femenino se identifica más con los
colores como violeta o p#rpura mientras que el p#blico /oven se
identifica más con colores planos llamativos como el naran/a o el
verde.
$. %nciende las e!ociones
0na de las propiedades de los colores es la de trans!itir
sensaciones. (os colores estimulan nuestro cerebro nos evocan
tranquilidad, seguridad, confian*a, pasión, misterio... Esto es mu
interesante desde el punto de vista del Mar1eting, a que no es
necesario dar argumentos para convencer sobre las propiedas o
beneficios de un producto o servicio.
En el siguiente art-culo puedes leer más sobre las asociaciones de
colores, marcas sensaciones.
2ero o/o3 muchas de estas asociaciones tienen un fundamento
cultural. 2or e/emplo, vestir de negro por e/emplo es ir de luto en
nuestra sociedad, mientras que en 4ndia el color del luto es en blanco.
5enlo en cuenta en las relaciones internacionales de tu negocio.
http://www.puromarketing.com/3/10927/elegir-color-adecuado-para-marca-imagen-nuestro-negocio.htmlhttp://www.puromarketing.com/3/10927/elegir-color-adecuado-para-marca-imagen-nuestro-negocio.html
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
12/17
&. '(ué colores seleccionar)
6tro de los aspectos a la hora de escoger los colores para nuestra
marca para nuestra página web es el equilibrio. *a ar!on#a de
colores " el equilibrio +ace que un diseño sea !ás o !enos
efectivo. "2ero qué colores tenemos que seleccionar$ 2or lo general,
se recomiendan respetar una de estas tres reglas3
7. ,olores de la !is!a ga!a cro!ática es decir, diferentes
tonos de un mismo color.
8. ,olores co!ple!entarios aquellos situados pró9imos en la
gama cromática
:. ,olores opuestos3 son aquellos situados /usto en el lado
opuesto de la gama cromática que audan al contraste.
6tra de las recomendaciones es no abusar de los colores: dos o tres
es suficiente siempre es bueno que haa un color predo!inante.
-. %fectividad del color: el contraste
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
13/17
El contraste de color se produce al combinar dos colores que no estánrelacionados. Esto permite por e/emplo, resaltar te9tos o imágenes.
'ombina colores claros colores oscuros para lograr este efecto
visual.
5. ,o!posición " peso de
colores;racias a los colores a las formas podemos dirigir la mirada de lavisita as- resaltar determinados elementos.
En la composición se dice que los colores cálidos, los oscuros o
tierras, pesan más que los colores fr-os, claro so pesados.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
14/17
:. /ea aire " espacios en blanco para que la mirada descanse.
'0odo listo)
• ")abes a quién es tu p#blico ob/etivo con qué color se siente
más identificado$
• "'on qué color se identifica tu marca tu página web$
• "'uál de las tres reglas de la combinación vas a seguir$
• "Están los elementos colores de tu página contrastados es
el te9to legible$
• "Has pensado en qué elemento vas a resaltar en tu página
web$
-mo 3legir los olores /ara un !itio Ce#
3scrita por@ Alfredo 5i((occhi
Dace#oo !"#
Titter !#"
EoogleF $%
312
http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/http://www.ideaschicago.com/author/lfredb/http://void%280%29/http://void%280%29/http://void%280%29/http://void%280%29/http://void%280%29/http://void%280%29/https://plus.google.com/share?url=http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/https://plus.google.com/share?url=http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/https://plus.google.com/share?url=http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/http://www.ideaschicago.com/author/lfredb/http://void%280%29/http://void%280%29/https://plus.google.com/share?url=http://www.ideaschicago.com/como-elegir-los-colores-para-un-sitio-web/
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
15/17
uando se crea un sitio e#, la elecci-n de los
colores es una tarea delicada, a pesar de parecer fácil. !eleccionar una correcta
paleta cromática es importante para comunicar e2ca(mente el mensaje, crear
conciencia de marca y alcan(ar a nuestra audiencia.
8os investigadores coinciden en que los colores producen sensaciones que la
mente humana interpreta.
3l esquema de colores que utili(a su sitio e# pueden ser una herramienta muy
e2ca( para lograr que sus visitantes se sientan c-modos e interactúen con su
sitio e#, reali(ando una compra o solicitando un servicio.
Asimismo una paleta de colores err-nea puede hacer que el visitante nopermane(ca en su sitio ni siquiera unos segundos.
A pesar de que no somos muy conscientes de esto cuando visitamos un sitio
e#, los colores Gjunto al contenido y los otros elementos visualesG son los quedeterminan si nos quedamos o nos vamos.
)-mo elegir los colores*
ualquiera que sea su actividad, le presentamos unos pocos consejos que le
serán de utilidad a la hora de comen(ar su sitio e#@
H. 0tili(e una paleta de colores que se relacione con su
o#jetivo
ay que elegir los colores pensando en nuestra audiencia. 8as
personas de diferentes edades tienen diferentes reacciones a los colores.
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
16/17
/or ejemplo las personas de cierta edad se encuentran generalmente mas
conforta#les en sitios e# con colores más so#rios y moderados. 8os colores
mas relajantes les resultan más atractivos.
8os j-venes, por el contrario, apreciarán los colores más vivos y #rillantes.
acer la distinci-n entre pú#lico adulto y joven mediante el uso de los colores
apropiados para cada categoría es importante.
Tam#i"n tenga en cuenta la temática de su sitio e#. 8os colores tierra por
ejemplo son usados muchisimo en restaurantes latinos. 3l marr-n, el terracota,
el amarillo y el naranja funcionan muy #ien para este o#jetivo. 8os colores con
una #ase verde se relacionan con el pensamiento conservacionista y ecol-gico.
3l negro es muy apreciado como fondo para sitios relacionados con actividades
musicales o nocturnas.
?. 3sta#le(ca un fuerte contraste entre el fondo de unapágina y el te&to.
3l color del te&to de#e estar en contraste con el color de fondo. 3sto es muy
importante porque el contenido escrito es normalmente el aspecto más
relevante de un sitio e#. 0n te&to de alto contraste es el más fácil de leer, y el
te&to negro so#re un fondo #lanco es mejor com#inaci-n para facilitar lalectura. Además del #lanco, otros colores efectivos de fondo son el gris claro y
el negro.
!i lo que promocionamos es un determinado producto, lo mejor es destacarlo
usando un fondo de gran contraste para que el producto sea el centro de
atenci-n.
=. 3lija una paleta de colores y úsela en todo el sitio.
3sta es la manera de darle uniformidad y sentido de
unidad a nuestro sitio e#. ;o use demasiados colores diferentes, con tres o
-
8/18/2019 Psicología Del Color Aplicada Al Diseño Web
17/17
cuatro es su2ciente. Todo el resto de#ería estar en la gama de estos colores
principales. A mis clientes le muestro una paleta de colores o les sugiero visitar
sitios donde para elegir una paleta de su agrado.
erramientas y !itios Iecomendados@
checmycolours.com Jnteresante utilidad para descu#rir los colores utili(adospor un sitio e# de nuestro agrado.colorcom#os.com om#inaciones de colores para sitios e#.colourlovers.com /ara divertirse navegando a trav"s paletas de colores creadaspor los usuarios. Kfrece tam#i"n patrones de colores organi(ados por categoríascomo #odas, hogar, moda, negocios, etc. 0sted puede hacer su propia paletaonline4colorschemedesigner.com /aletas de colores monocromáticos,
complementarios, triadas, etc.cssdrive.comLimagepalette ;os permite su#ir una imagen y nos devuelve lapaleta de colores correspondiente.
onclusi-n
ay que pensar en forma inteligente al elegir un esquema de colores para un
sitio e#. 3s #ien importante conocer nuestra audiencia o target y su posi#le
actitud hacia los colores. :e la misma manera es esencial elegir colores que
tra#ajen armoniosamente juntos, para crear una #uena impresi-n est"tica. /or
último, un sitio e# cuyo contenido no puede ser leido fácilmente de#ido a la
falta de contraste entre el te&to y el fondo deja a los visitantes y clientes
potenciales con una muy mala impresi-n de nuestro negocio.
http://www.checkmycolours.com/http://colorcombos.com/http://www.ideaschicago.com/www.colourlovers.comhttp://www.ideaschicago.com/www.colourlovers.comhttp://colorschemedesigner.com/http://www.cssdrive.com/imagepalette/http://www.checkmycolours.com/http://colorcombos.com/http://www.ideaschicago.com/www.colourlovers.comhttp://colorschemedesigner.com/http://www.cssdrive.com/imagepalette/