El color és una eina molt poderosa en el disseny de llocs web. Atreure l'atenció, expressar significat, crear desig, dirigir la conversa: tot això i més es pot assolir mitjançant un ús intel·ligent i estratègic del color. Igual que el disseny i el to del seu idioma, el color que veuen els seus visitants al seu lloc web determina com se senten sobre això i si tornaran o no.
Què fa que el color sigui important per al disseny de llocs web
Els colors ajuden a augmentar el reconeixement de la seva marca i també inciten els visitants del seu lloc a prendre mesures. Qualsevol judici que facin inconscientment sobre la seva marca pot estar basat en la paleta de colors del vostre lloc. Per tant, quan una empresa de disseny de llocs web se senti per primera vegada per dissenyar el seu lloc web, primer consideren 2 coses: les emocions que la seva marca voleu evocar i les filosofies i els contextos culturals amb què voleu alinear-se. Aquest és el primer pas per prendre decisions de color significatives en el disseny dun lloc web.
1. Psicologia del color: els colors desperten emocions
La psicologia del color fa referència a l'efecte que els colors poden tenir en les emocions, els sentiments i els comportaments d'una persona. Si bé les regles aquí no estan escrites en pedra, les persones se senten atretes en part per certs colors degut a com els fan sentir. El context aquí és molt important. El vermell pot significar por i perill per a alguns, i passió i entusiasme per a altres. Quan es fa servir el color en el disseny del lloc web, s'ha d'integrar a la perfecció amb tots els altres elements del lloc: tipografia, text i imatges.
Aquí hi ha alguns colors i les seves emocions associades. Un cop més, encara que no estan escrits en pedra, aquestes són associacions generals i tenen una influència genuïna a l'audiència. Això hauria d'ajudar-lo a triar colors en funció de com voleu que us sentiu la vostra audiència i quines accions voleu que preneu.
- vermell : poder, amor, perill, passió, excitació.
- Taronja : diversió, calidesa, comoditat, llibertat, alegria
- Blanc : pau, claredat, puresa, neteja.
- blau : calma, competència, confiança, pau, fiabilitat, lògica.
- porpra : luxe, sofisticació, misteri, lleialtat, creativitat
- Rosa : gentilesa, sinceritat, cura, calidesa.
- Verd : salut, naturalesa, prosperitat, abundància.
- Marró : naturalesa, protecció, seguretat, suport.
- groc : felicitat, creativitat, optimisme, amabilitat.
- Negre : elegància, control, poder, sofisticació, depressió.
2. Context Cultural
Tot i que els diferents colors poden tenir diferents significats per a diferents persones, de vegades els colors també tenen un significat cultural. A molts països occidentals, el negre s'associa amb la mort i el dol, mentre que el mateix color és el blanc a molts països orientals. De manera similar, el color vermell està associat amb l'atenció i la urgència a les cultures occidentals, mentre que moltes cultures orientals l'associen amb la sort. El context és fonamental per a la selecció del color. Sovint, és possible que vulgueu triar els colors de la seva marca segons el mercat al qual voleu dirigir-se. Depenent d'on estigui basat el seu mercat, els colors al vostre lloc web poden enviar missatges molt diferents.
Per descomptat, aquest no és necessàriament el cas, especialment quan es tracta de marques significativament grans i populars les imatges de les quals ja estan arrelades a la nostra psique general. El vermell de Coca-Cola o KFC, per exemple, generalment ja no portarà connotacions negatives considerant com són de populars i coneguts.
Conceptes bàsics de la teoria del color
La teoria del color és un conjunt de principis que són útils per comprendre i crear paletes i combinacions de colors complementaris. Aquests principis fonamentals poden ajudar-lo realment a crear una paleta que s'adapti a les necessitats exactes de la seva marca.
– Colors primaris : aquests són 3 en nombre: vermell, blau i groc.
– Colors secundaris : es creen barrejant colors primaris: verd (groc + blau), taronja (groc + vermell) i morat (blau + vermell).
– Colors Terciaris – Són combinacions creades en barrejar colors primaris i secundaris.
– Tints, Matisos, Tons – Tots els colors esmentats anteriorment s'anomenen “colors purs”. No obstant això, aquests colors es poden treballar més per crear-ne d'altres. Crea tints afegint blanc als colors purs, fent-los més clars i menys intensos. Crees ombres afegint-los carències, fent que els colors siguin més pesats i intensos. Utilitza tant el blanc com el negre en diversos graus per crear tons a partir de colors purs.
– Contrast : el contrast és la diferència percebuda entre dos colors quan es col·loquen un al costat de l'altre. Com més gran sigui el contrast, més es destaquen dos colors entre si. Aquest és un principi molt important, ja que els diferents nivells de contrast poden crear un món de diferència al vostre lloc web. El text en color sobre un fons de contrast baix pot causar problemes de llegibilitat. El contrast també pot cridar latenció sobre elements específics (o fins i tot desviar latenció delements específics si sutilitza de manera intel ligent) a la seva pàgina web i fer que es destaquin visualment.
Models de color
En disseny gràfic, els colors també es descriuen fent servir models de color. Això és perquè hi ha milions de colors i és impossible anomenar-los a tots per separat. Aquests estàndards es van crear per permetre'ns descriure fàcilment els colors usant valors.
– Model RGB : aquest és el model utilitzat quan es treballa amb dissenys a la pantalla. RGB significa vermell, verd i blau. A cadascun d'aquests colors se li assigna un valor que va de 0 a 255 i les diferents combinacions ens porten els diferents colors. Els colors sovint es presenten com a codis de color: números de codi hexadecimals de 6 dígits. És un model de color “additiu”.
– Model CMYK : aquest model s'utilitza amb finalitats d'impressió. Representa cian, magenta, groc i negre, i cada color es descriu pel percentatge d'aquests colors constituents. És un model de color “sustractiu”.
– Model LAB : LAB significa Lightness, A Channel i B Channel. És un model una mica més complex. Consisteix en un factor de lluminositat que va de 0 a 100, un component A a l'eix verd-vermell i un component B a l'eix blau-groc. Això fa que la descripció del color s'acosti molt més a l'aproximació humana en comparació dels models RGB o CMYK.
Creació de paletes de colors
El primer color que tries per al teu lloc web és el color principal de la teva marca (Vermell per a Coca Cola, per exemple). Aquí és on la psicologia del color es torna particularment útil. Utilitza el color en funció de les emocions i la personalitat que voleu transmetre. Després d'això, crea una paleta de colors escollint colors harmonitzats amb el color base. Aquí és on entra en joc una roda de colors.
– Roda de colors: la roda de colors és una eina que sutilitza per mostrar la relació entre els colors. És bàsicament una il·lustració abstracta que organitza diversos tons de color en un cercle.
Amb lajuda duna roda de colors, hi ha 5 tipus principals de paletes de colors que pot crear:
– Paleta anàloga: els colors anàlegs es col·loquen un al costat de laltre en una roda de colors. Tenen un baix contrast entre si i encaixen bé proporcionant un efecte subtil.
– Paleta monocromàtica : aquestes paletes es basen en un sol color que es destaca, combinat amb elements de diferents tons i matisos. Aquesta paleta pot ser molt agradable a la vista. No obstant això, per evitar una sensació monòtona, podria ser una bona idea incloure elements de color complementaris i fins i tot contrastants a la pàgina web.
– Paleta de tríada : aquesta paleta utilitza 3 colors que estan espaiats uniformement a la roda de colors. Aquesta tècnica s'ha d'usar de manera intel·ligent, no només per triar colors que combinin bé, sinó també per fer-los servir d'una manera que no sembli massa desordenada i sorollosa.
– Paleta complementària : aquesta paleta utilitza colors dels extrems oposats de la roda de colors. Això es pot fer servir de manera efectiva per crear estils artístics d'alt contrast que cridin l'atenció sobre seccions específiques de la seva pàgina web.
-Paleta complementària dividida : aquesta paleta és similar a les paletes complementàries, però amb un color addicional que es col·loca al costat d'un dels colors complementaris a la roda de colors. Quan es fa servir de manera intel·ligent, aquest estil és efectiu per crear una aparença més natural sense massa soroll.
Eines útils per a la inspiració
La inspiració per a noves paletes de colors es pot trobar a tot arreu, des de llocs web rivals fins a la natura i l'aire lliure. També ajuda a mantenir-se actualitzat sobre les darreres tendències de marca. Aquí hi ha algunes eines útils que poden ajudar a començar amb noves idees de color immediatament.
– Pinterest - pinterest té una quantitat impressionant didees de paletes de colors creades per diversos dissenyadors de tot el món. Aquests poden servir com a gran font d'inspiració.
– Pantone - Pantone és el líder de la indústria al camp del color. Utilitza un índex de color físic que identifica tota mena de matisos de tots els colors separats. Totes les darreres tendències de color en el disseny i la moda generalment provenen de Pantone.
- Llocs web de creació d'esquemes de color: hi ha nombrosos llocs de color dedicats per a dissenyadors que lajudaran a fer combinacions de colors i explorar entre paletes de la forma que desitgi. Aquesta és una excel·lent manera dexperimentar i crear noves paletes vostè mateix. Els llocs web com Adobe Color Wheel , Color Collective y Disseny de llavors són excel·lents per obtenir inspiració instantània.
Si bé el color per si mateix no és el més important en el disseny de llocs web, segurament hi juga un paper important. Quan s'utilitza correctament, els colors que representa es poden convertir en un identificador de la seva marca. Amb els consells i trucs esmentats anteriorment, no hauria de tenir problemes per utilitzar estratègicament el color en el disseny del seu lloc web amb el millor efecte.
