5 Erros comuns de design em interfaces de web

5 Erros comuns de design em interfaces de web

Nossa equipe de designers notou alguns erros comuns de design que as pessoas cometem ao criar sites. Veja a lista de prós e contras aplicáveis a qualquer ferramenta ou serviço que você usa.

5 erros comuns do design da página de destino para evitar

      

1. Evite baixo contraste entre texto e imagem

Deve haver contraste suficiente entre texto e fundo. Para dar boa leitura na peça, coloque um filtro sobre a imagem. O preto é uma cor popular, mas você também pode usar cores que façam mais sentido com a identidade visual do site.

2. Muitos estilos em uma página

Muitos estilos tipográficos e de design em uma mesma página fazem com que ela não pareça profissional e difícil de ler. Para evitar isso, limite-se a uma única fonte e a duas opções de saturação, por exemplo, normal e negrito.

PARA NÃO FAZER
Por causa de muitos estilos de tipografia, não está claro onde a ênfase do layout está.

PARA FAZER
Uma fonte, uma cor e dois tipos de saturação. A tipografia na página parece limpa e clara.

3. Blocos de cores pequeno

Evite enfatizar elementos de página com blocos estreitos de cores. Isso simplesmente não funciona. Por exemplo, os títulos já estão bem marcados graças ao seu tamanho, tipo de saturação e preenchimentos. Gostaria de destacar um ponto específico em uma página? Use um plano de fundo colorido para o bloco inteiro, incluindo um cabeçalho e um texto menor relacionado.

PARA NÃO FAZER
Os títulos colocados em um plano de fundo colorido separam a continuidade da página e dão a impressão que são elementos separados.

PARA FAZER
O título e um texto relacionado compartilham o mesmo plano de fundo. Ele mostra que eles pertencem ao mesmo conjunto lógico.

4. Texto sobre uma parte essencial de uma imagem

Evite cobrir partes significativas ou pequenos detalhes de uma imagem com texto. Dessa forma, você irá perder leitura da imagem e tornar o texto ilegível. Tente posições diferentes para as linhas, como centralizá-las ou alinhar o texto à esquerda ou colocá-las verticalmente.

PARA NÃO FAZER
Este título fica exatamente sobre o rosto da mulher. Com tantas interferências, é difícil ler o texto.

PARA FAZER
A imagem e o texto são fáceis de ler, formam uma boa composição e não escondem nenhum elemento importante.

5. Mau uso da hierarquia visual

Para que a hierarquia de informações seja claramente visível em uma página, o título na capa deve ser maior do que o restante dos títulos ou pelo menos do mesmo tamanho, especialmente se o título for longo, por exemplo.

PARA NÃO FAZER
O título no cabeçalho é desproporcionalmente menor que o cabeçalho seguinte, o que é confuso. Por quê? Faz o segundo título parecer mais importante.

PARA FAZER
O título no cabeçalho é maior que o do bloco seguinte, portanto, a página inteira parece consistente

O mesmo princípio se aplica à hierarquia visual dentro de um bloco lógico. O título deve ser o maior elemento da página, seguido por um subtítulo menor e menos proeminente. Em seguida, os títulos de recursos a seguir devem ser visivelmente menores que o título e com o mesmo peso. As fontes menores devem ser usadas para descrições de recursos.

Isso ajudará os visitantes do site a distinguir entre as informações mais importantes e menos importantes.

 

*Esse post foi traduzido de: https://uxplanet.org/common-webpage-design-mistakes-59eed9831bd7

Tem mais dicas lá 😉

5 Erros comuns de design em interfaces de web
5 (100%) 1 vote

Achou isso interessante? Compartilhe

Philippe Botelho
Por Philippe Botelho

Graduado em Design pela UFSC, cinéfilo e motociclista. Acredita que o Design dá ao mundo algo que ele não sabia que sentia falta. Na Híbrido atua como UI/UX Designer. 

COMENTÁRIOS

CONECTE-SE

Vamos conversar SOBRE O SEU NEGÓCIO?

Quer ficar antenado no mundo do ecommerce?

Faça parte da nossa base de conhecimento.