Veremos a seguir as três primeiras técnicas que iremos discutir nesse tópico sempre mostrando alguns exemplos de bom uso dessas técnicas para deixar mais claro o como podemos aplica-las durante uma criação de layout.
1. Contraste
Usar contraste entre os elementos que compõem um site ajuda os usuários a distinguir diferentes seções do mesmo e possibilita também a aplicação de destaques especiais em elementos importantes da página.
Ryan Keiser
No site do designer Ryan Keiser 
temos um exemplo do uso do contraste para causar impacto nos visitantes e atrair a visão do usuário para o menu de navegação na lateral direita.
Post Pixel
No site da Postpixel temos um exemplo de contraste no topo do site e quando olhamos o layout vemos que este efeito faz com que os elementos “saltem da tela” e tornem-se um ponto que certamente não passará despercebido aos olhos do visitante.
2. Gradientes
A utilização de gradientes na composição do layout é importante para criar sensações de profundidade e iluminação nos elementos, porém deve ser utilizado com moderação evitando ao máximo contrastes muito fortes de cores dentro do gradiente .
Orca Bay Sea Foods
Veja como o gradiente é usado de forma sutil na parte superior do site, no quadrado temos a cor inicial e a cor final do gradiente vertical da página, perceba que quando olhamos para as cores separadamente do gradiente temos uma visão melhor da diferença de tonalidade.
News Berry
Também um exemplo de gradiente vertical mais curto, passando a sensação de que o banner está saltando acima do plano do restante do site.
Guifx
Nesse caso o gradiente foi utilizado para criar a sensação de profundidade no botão “Home” da página.
3. Espaçamento entre as letras
Este efeito que também é conhecido como “kerning” e possui duas funções: melhorar a capacidade de leitura do texto de acordo com o contexto visual no qual está inserido ou ser utilizado como elemento gráfico capaz de traduzir um evento. Veja os exemplos:
Veja como a palavra abaixo transmite melhor a idéia que se deseja passar. Usar este efeito simples pode dar um toque especial na mensagem que se deseja passar e pode até mesmo transmitir uma sensação ao usuário.
Espaçamento entre as letras
E o espaçamento entre linhas?
Este tipo de espaçamento também é muito importante para otimizar a leitura e proporcionar mais leveza ao seu design, deixando-o mais limpo e agradável. Veja a diferença no exemplo abaixo, perceba como um maior espaçamento entre as linhas possibilita uma leitura muito melhor.
Espaçamento entre linhas
Nos próximos artigos vamos discutir mais algumas técnicas para enriquecer o design do seu site deixando-o mais atrativo e aumentando sua taxa de conversão.
Até a próxima!
Loading ...