Contraste desempenha um papel importante no sucesso do design de qualquer site. Contraste adequado garante uma experiência de usuário de qualidade e facilidade de leitura que contribuirá para o sucesso de longo prazo do site.
Websites que são muito baixos em contraste podem ser difíceis de ler e usar, o que terá um impacto negativo no sucesso de qualquer site. Os problemas de contraste de cores ruins geralmente são fáceis de identificar; muitas vezes você pode simplesmente olhar para uma página em um navegador da web e ver se um texto é difícil de ler devido a opções de cores de contraste ruins.
Embora seja fácil determinar quais cores não funcionam bem juntas, pode ser desafiador decidir quais cores funcionarão bem em contraste com outras e dentro do design de um site. Este gráfico mostra uma variedade de cores e como elas contrastam como cores de primeiro e segundo plano. Você pode ver alguns pares eficazes, bem como um par ruim que deve ser evitado ao escolher cores para os projetos do seu site.
Nem todos os contrastes fortes são bons contrastes
Uma coisa que você deve observar no gráfico é como algumas dessas cores podem ser muito brilhantes e aparecer de maneira vibrante em uma cor de plano de fundo específica, como azul sobre preto, mas são rotuladas como escolhas de contraste ruins. Isso ocorre porque a combinação de cores, apesar de seu contraste, ainda resulta em texto difícil de ler. Se você fosse criar uma página em todo o texto azul em um fundo preto, seus leitores teriam a fadiga ocular muito rapidamente.
Existem regras e práticas recomendadas para o contraste, mas como designer, você deve sempre avaliar essas regras para garantir que elas funcionem em sua instância específica.
Padrões de marca e opções de cores contrastantes
O contraste é apenas um dos fatores a considerar ao escolher cores para o design do seu site. Ao selecionar as cores, você provavelmente também deve estar atento aos padrões da marca para o cliente, seja uma empresa, outra organização ou até mesmo um indivíduo. Embora as paletas de cores possam ser consistentes com as diretrizes de marca de uma organização, elas podem não se traduzir bem para apresentações on-line.
Por exemplo, verduras amarelas e brilhantes são terrivelmente desafiadoras para usar efetivamente em sites. Se essas cores estiverem nas diretrizes de marca de uma empresa, elas provavelmente precisarão ser usadas apenas como cores de destaque, pois é difícil encontrar cores que contrastem bem com uma delas.
Da mesma forma, se as cores da sua marca forem preto e branco, isso significa um grande contraste, mas se você tiver um site com longas quantidades de texto, um fundo preto com texto branco fará com que a leitura seja uma experiência estonteante, apesar da força inerente contraste entre preto e branco. Neste caso, é aconselhável inverter as cores, usando texto preto em um fundo branco. Isso pode não ser tão visualmente interessante, mas é uma escolha de contraste e legibilidade muito melhor.
Ferramentas on-line
Além do seu próprio senso de design, existem algumas ferramentas on-line que você pode usar para testar a escolha de cor do seu site. CheckMyColors.com irá testar todas as cores do seu site e informar sobre a relação de contraste entre elementos na página.
Além disso, ao pensar sobre as opções de cores, você também deve considerar a acessibilidade do site e as pessoas que têm formas de daltonismo. O WebAIM.org pode ajudar com isso, assim como o ContrastChecker.com, que testará suas escolhas em relação às Diretrizes de Acessibilidade ao Conteúdo da Web (WCAG).
