5 opções de cores que você absolutamente deve evitar ao projetar para a Web

A Web está se tornando cada vez mais visual. O bom conteúdo continua sendo rei, mas é melhor que o conteúdo seja embrulhado em um pacote visual atraente para se destacar.

Para profissionais de design, isso não é um grande problema. Eles estão completamente mergulhados na teoria das cores e na psicologia das cores.

Mas e quanto ao crescente número de usuários da web que estão tentando manter seu conteúdo da web atualizado com a crescente natureza visual da web? Mesmo aqueles artigos da web que resumem a teoria das cores e a psicologia das cores, embora excelentes em compartilhar os fundamentos da cor no design, podem ser mal interpretados por aqueles que não têm a formação que os profissionais gráficos têm, levando a possíveis decisões desastrosas.

Então, quais opções de cores você deve evitar em suas páginas da web?

Preto puro

Vamos começar com preto - preto puro - que é codificado como #000000 em HTML.

Surpreso? O preto está em toda parte, não é, como no texto na maioria das páginas da web, o onipresente vestidinho preto e o céu noturno?

Bem, preto puro é menos comum do que você pensa. Esse verdadeiro preto puro #000000 é na verdade uma cor não natural. Não existe na natureza. O preto puro requer a absorção de todos os espectros de luz, e isso simplesmente não acontece na natureza. As cores naturais são mais misturadas e suaves.

O preto puro, portanto, não é algo que nossos olhos estão acostumados a ver. É duro. Ele se destaca (o que faz parte do que torna aquele vestidinho preto tão popular). Então por que não usá-lo em web design? Afinal, artigos da web que abordam a psicologia das cores enfatizam sua conexão com glamour, sofisticação, poder e autoridade. Esses artigos estão errados quando incentivam o uso do preto?

Eles não estão nada errados. O preto pode ser usado para despertar algumas associações positivas poderosas na mente das pessoas. A chave é usar um preto que não seja preto puro .

Como o preto puro não é uma cor natural, é mais difícil para o cérebro processar. Aumente o seu preto de #000000 para #111111 ou um cinza muito escuro semelhante e você ainda terá os benefícios atraentes da cor preta sem sobrecarregar tanto o cérebro de seus visitantes.

Cores neon em elementos de interface

As cores neon também, embora atraentes, têm a mesma tendência de sobrecarregar o cérebro. Como cores que não aparecem na natureza, elas são desconhecidas para o cérebro e mais difíceis de processar do que cores mais suaves e misturadas.

Salve as cores neon de arregalar os olhos para destaques gráficos para fazer seu conteúdo visual aparecer em vez de em seus elementos de interface. E certifique-se de usá-los não apenas para chamar a atenção para o gráfico, mas para chamar a atenção do visitante para partes de sua página onde residem as principais informações.

Em outras palavras, mantenha as cores neon fora dos planos de fundo onde o texto será sobreposto, como planos de fundo para o texto principal, barras laterais, fitas de navegação ou botões.

Use cores mais naturais e levemente misturadas que são mais fáceis para os olhos como plano de fundo para seu conteúdo textual. Cores neon como texto ou em fundos de texto tendem a cansar os olhos. Isso pode deixar uma impressão negativa subconsciente do site e do que ele oferece, que é a última coisa que você deseja. Você quer deixar seu visitante com um sentimento positivo sobre o seu negócio.

Uma regra geral para evitar as duas primeiras opções de cores é evitar cores que na codificação HTML apresentem os extremos nos espectros de cores - os zeros e Fs, especialmente em texto e fundos de texto. Afaste-os ligeiramente das cores não naturais absolutamente puras e eles serão mais fáceis para a mente processar e deixar uma impressão mais favorável em seus visitantes.

Combinações de contraste excessivamente alto

Além de evitar cores muito puras, tome cuidado com certas combinações de cores.

Embora seja um grampo da temporada de Natal, o vermelho e o verde apresentam vários problemas no design do site - tanto que um pequeno poema entre os designers diz: "Vermelho e verde nunca devem ser vistos, sem uma cor no meio"

Isso se deve ao modo como o cérebro processa essas duas cores. O vermelho é registrado como a cor mais quente e estimula a atividade no cérebro. É a cor que mais rapidamente chama a nossa atenção. Vermelho agita o cérebro.

O verde, por outro lado, é registrado como uma cor fria. Isso acalma o cérebro. Colocar os dois juntos coloca o cérebro na posição desconfortável de processar um visual que simultaneamente tenta agitá-lo e acalmá-lo. Deixa o cérebro em conflito. Isso não é bom para criar uma impressão favorável.

Tal como acontece com o uso de cores neon no texto ou no fundo do texto, o uso de vermelho e verde juntos pode deixar seu visitante com uma impressão subconsciente negativa do que você oferece que não tem nada a ver com a oferta em si. Em vez disso, essa impressão negativa vem do desconforto interno de processar as cores conflitantes.

Vermelho e verde também têm um segundo problema. Culturalmente, no mundo ocidental, as pessoas estão acostumadas a associar vermelho a parar ou não, e verde a ir ou sim. Mais uma vez, força o cérebro a lidar com um conjunto contraditório de entradas que o deixa desconfortável. E quando o cérebro estiver desconfortável, ele transferirá essa sensação de desconforto para a sua oferta - não para o que você deseja.

Embora não seja um contraste tão extremo, o mesmo princípio se aplica à combinação de vermelho e azul e, em menor grau ainda, a qualquer combinação das chamadas cores secundárias, ou seja, roxo, verde ou laranja.

Vermelho e azul criam um choque entre uma cor muito quente e uma cor muito fria. As cores secundárias, que são misturas das cores primárias (roxo é uma mistura de vermelho e azul, verde uma mistura de azul e amarelo, laranja uma mistura de amarelo e vermelho) simplesmente não se misturam bem. Qualquer uma dessas combinações simplesmente é um contraste muito poderoso para o cérebro processar confortavelmente.

Mais uma vez, esforce-se por cores mais naturais e misturadas que evitem as combinações de esforço cerebral decorrentes do uso de cores que são diretamente opostas uma à outra na roda de cores ou que são opostas em termos de calor e frieza.

Combinações de contraste excessivamente baixo

Isso não significa, porém, que você deve usar apenas cores que são quase idênticas em matiz (cor) e valor (escuridão relativa). Você também pode ir longe demais nessa direção, criando um tipo diferente de problema para os visitantes.

Colocar texto claro em um fundo branco, como rosa ou amarelo ou azul claro ou lilás em branco, pode dificultar que os visitantes entendam o que o texto diz. O mesmo vale para texto escuro em um fundo escuro, como vermelho ou azul royal ou magenta em preto.

Outras combinações ruins específicas são amarelo com verde ou verde com amarelo e fundos vermelhos com preto, azul ou magenta. Você não apenas corre o risco de que um visitante daltônico não veja nenhum texto, mas também irrita os visitantes não daltônicos, fazendo com que eles se esforcem para ler o que você escreveu. E não estamos falando de impressões subconscientes aqui. Estamos falando sobre eles estarem conscientemente irritados com você por tornar seu site tão difícil para eles lerem.

Esse erro é especialmente prevalente quando você sobrepõe texto sobre imagens, como em uma imagem de cabeçalho grande na parte superior da página. Sempre certifique-se de que TODO o seu texto seja lido claramente em suas imagens de cabeçalho, não apenas a maior parte dele.

Planos de fundo multicoloridos

Os sites que oferecem plano de fundo texturizado gratuito para web designers são abundantes, e você pode sentir que eles farão com que seu site se destaque. Mas tenha cuidado se você optar por usar um. Planos de fundo texturizados correm o risco de estar ocupados e, assim, distrair os visitantes do seu conteúdo. E você enfrenta o mesmo perigo de o texto se perder em planos de fundo texturizados, como acontece com a sobreposição de texto sobre imagens.

Tenha cuidado na escolha de um plano de fundo texturizado. Evite os fundos chamativos e de cores conflitantes, populares nos primeiros dias da Internet. Esses planos de fundo geralmente eram compostos de pequenos desenhos repetidos com cores brilhantes e conflitantes, nas quais o texto se perdia facilmente.

A tendência hoje é para uma aparência sutil e natural que dá ao seu fundo uma sensação de profundidade sem distrair. E a regra geral para paletas de cores para sites é não usar mais do que três cores, definitivamente não mais do que quatro.

O mesmo aviso para ser cauteloso no uso de texturas se aplica ao uso de gradientes (um elemento gráfico em que a cor ou a escuridão de um plano de fundo muda gradualmente de uma parte do plano de fundo para outra). Evite usá-los para vários blocos de texto em uma página. E evite usar um gradiente que inclua a cor do seu texto, para que seu texto não se perca no gradiente. Sempre coloque seu texto em caixas ou em uma área clara de seu plano de fundo, com espaço suficiente de outro elemento visual para que seu texto se destaque claramente.

Conclusão

Escolher cores para um site claramente envolve mais do que escolher suas cores favoritas ou um conjunto de cores que você gostou em outro site. Envolve mais do que uma recomendação isolada de um artigo online, pois tudo o que há para saber sobre a escolha de cores sem aprender mais.

A cor é uma ferramenta muito poderosa na persuasão. Usado com cuidado, ele pode ajudar a direcionar os visitantes para uma ação que você deseja que eles realizem. Usado de forma descuidada, pode deixar os visitantes com uma vaga sensação de desconforto sobre o seu negócio ou até mesmo deixá-los conscientemente irritados com a dificuldade de uso do seu site.

Concentre suas escolhas de cores naquelas que são fáceis para o cérebro e continue aprendendo como escolher cores que funcionem bem juntas e você estará no caminho certo para projetar um site onde suas cores funcionem juntas com todos os outros elementos do seu site para atingir seus objetivos.