Como usar imagens no design de sites?

Publicados: 2021-07-03

Neste artigo, discutiremos a maneira mais eficaz de usar imagens de design de sites em todo o seu design. Desenhar um site é uma forma de arte, especialmente quando se trata de imagens, que podem ser usadas para tornar o design do seu site mais interessante. Com isso dito, existem algumas regras que você deve seguir ao usá-los. Nesta postagem do blog, discutiremos 18 dicas para maximizar a eficácia das imagens em seu web design!


Imagens de design de sites: 18 dicas

1. Escolha imagens com uma boa resolução

Como regra geral, sempre use uma imagem de pelo menos 1200 x 800 px, a menos que tenha um bom motivo para não fazer isso. Quanto mais alta a resolução de suas fotos, mais nítidas elas ficarão em monitores de desktop e dispositivos móveis. Ter imagens de baixa qualidade é a maneira mais rápida de fazer sua marca parecer pouco profissional e perder uma venda potencial.

imagem mostrando resolução 1200x800 mostrando como usar imagens em web design

2. Limitar imagens grandes acima da dobra

As imagens são importantes, mas tudo tem seu lugar. A seção mais significativa do seu site é a área que eles podem ver sem precisar rolar. Como tal, não o desperdice usando uma imagem enorme que não oferece valor ou não converte visitantes.

site com uma imagem grande acima da dobra

3. Use imagens livres de direitos autorais

É importante usar imagens livres de royalties porque você não quer ter problemas legais com os proprietários das imagens que usar. Felizmente, existem muitos sites onde você pode baixar imagens livres de royalties, como Pixabay, Getrefe e Pexels. Você também pode encontrar gráficos gratuitos em sites como Unsplash, OpenClipart ou Gratisography.

Lembre-se de que é importante ler as informações de direitos autorais antes de baixar qualquer coisa dos sites acima. Isso se deve a restrições legais, como quantas vezes uma imagem pode ser usada e se a atribuição é obrigatória ou não.


4. Diminua o tamanho do arquivo

Quando você carrega uma imagem em seu site, o tamanho do arquivo provavelmente será maior do que o necessário. Infelizmente, esses arquivos demoram para carregar, o que diminui a experiência do usuário no seu site. Para corrigir esse problema, use ferramentas online como TinyPNG ou Image Optimizer para compactá-los sem perder qualidade.

Arquivo de imagem sendo convertido para um tamanho menor

5. Considere contratar um fotógrafo ou ilustrador

Um profissional fornecerá imagens de melhor qualidade, o que provavelmente resultará em uma experiência mais memorável para seus visitantes.

Se você tem recursos e orçamento para contratar alguém, vale a pena considerar - existem muitos fotógrafos ou ilustradores talentosos por aí que podem produzir imagens profissionais com pouca antecedência!

Também vale a pena mencionar que isso pode ser caro e demorado, então é melhor se isso for algo que foi planejado desde o início do seu projeto e não apenas uma reflexão tardia.

Pessoa segurando uma câmera

6. Use diferentes tipos de imagens

Faça uso de recursos visuais usando diferentes tipos de imagens para representar um produto ou serviço, como infográficos, gráficos, tabelas ou diagramas. Você também pode criar conteúdo visual, como vídeos animados, que são uma ótima maneira de explicar como seu produto ou serviço funciona.

Telefone com diferentes gráficos de pizza

7. Aproveite o contraste

Use totalmente o espaço em branco com imagens, colocando-as contra um fundo sólido de cor clara. O contraste vai chamar a atenção para o seu design.

Falando em contraste - muitos proprietários de sites cometem o erro de colocar texto claro em cima de imagens brilhantes, o que torna extremamente difícil de ler. Lembre-se de que tudo deve ser feito para ajudar o visitante, não apenas para parecer legal.

Pessoa com um suéter vermelho na neve mostrando contraste

8. Seja criativo!

Crie composições de fotos interessantes usando diferentes assuntos ou ângulos - não se conforme com pontos de vista enfadonhos! Experimente até encontrar algo que realmente chame a atenção dos espectadores.

pessoa com câmeras ao redor, em seguida, dividir a tela para o café em um círculo em uma mesa

9. Tenha cuidado para não exagerar ao editar suas imagens

Os efeitos são ótimos, mas usá-los em demasia pode ser desagradável para algumas pessoas. Isso ocorre porque as imagens excessivamente editadas carecem de autenticidade e podem ser vistas como um truque barato para fazer algo parecer diferente. Dito isso, não há nada de errado em adicionar efeitos sutis, como filtros preto e branco.

Uma imagem que foi editada em excesso

10. Adicione algum texto

Se você quiser que as pessoas interajam com suas imagens de uma maneira fácil, adicione algum texto! Dê-lhes instruções sobre o que devem fazer a seguir. Por exemplo, “clique aqui para obter mais detalhes”.

Além disso, certifique-se de adicionar texto alternativo a todas as suas imagens! Não só é bom para SEO, mas é compatível com ADA.

assine com Faça algo criativo todos os dias escrito nele

11. Nem todas as fotos são criadas iguais

Não use todas as fotos que você tem apenas porque tem boa exposição ou composição. Pode não funcionar bem no contexto do layout de design de seu site específico.

Pessoa com vestido xadrez e cabelo vermelho em pé na piscina

12. Não se esqueça da cor!

A escolha de cores complementares para suas imagens pode criar interesse visual, enquanto cores contrastantes podem torná-las realmente interessantes. Recomendo experimentar algumas combinações diferentes para obter o melhor efeito para o seu site.

Macrons rosa ao lado de uma banana amarela com a. fundo vermelho

13. Use imagens significativas

É importante saber por que você está usando uma imagem em primeiro lugar. É para fazer um visitante sorrir? É para transmitir uma ideia ou mensagem de forma mais eficaz? Tudo isso pode ser realizado com imagens, mas você deve saber qual é o seu objetivo antes de selecionar uma para que seja usada adequadamente e alcance o efeito desejado.

Bebê deitado em tapete fofo

14. Não use o banco de imagens para tudo

Pode parecer uma boa ideia usar fotos de estoque em seu design, mas nem sempre é. Freqüentemente, eles são muito genéricos e não adicionam nada de valor ou significado ao seu site. Essa pode ser uma área em que você deve investir algum dinheiro, pois isso vai render dividendos no longo prazo.

Retratos de funcionários WebCitz

15. Use imagens para contar uma história

As imagens podem ser usadas no lugar de marcadores ou listas numeradas. Eles são bons para ilustrar as etapas de um artigo, apresentando gráficos e tabelas, exibindo dados visualmente em vez de usar apenas palavras.

Um escritor de tipos Escrevendo histórias são importantes

16. Use imagens para quebrar blocos de texto

Freqüentemente, apenas produzimos parágrafo após parágrafo de conteúdo, sem nenhuma quebra visual entre eles. Isso pode ser exaustivo para o leitor e pode até tornar seu ponto menos claro, pois não é fácil acompanhar o que você está dizendo quando não há imagens que o esclareçam.

Basicamente, as imagens proporcionam aos leitores uma pausa visual necessária em relação ao conteúdo, o que lhes dá tempo para digerir o que acabaram de ler.

Pessoa de fora em um banco usando um iPad

17. Use imagens para enfatizar

Se você deseja que seus leitores se concentrem em uma parte de seu site ou postagem de blog, o uso de uma imagem pode ajudar a chamar a atenção deles e torná-la mais perceptível.

Limão com um azul por fora e amarelo por dentro em um fundo azul

18. Use imagens para educar

Pense nisso como uma outra maneira de seus leitores lerem o que você tem a dizer. As imagens são ferramentas poderosas que podem ajudá-los a entender a mensagem que você está tentando transmitir.

papel emoldurado com uma lista

Conclusão

Concluindo, é muito importante ter em mente que nem todas as fotos funcionarão bem no seu site. Você terá que experimentar para ver o que funciona melhor com as cores que está usando, o tipo de conteúdo em seu site, seu público, etc. Esperamos que este artigo sobre imagens de design de sites seja útil para educá-lo sobre a importância de imagens em todo o seu design da web.

Se você está usando suas imagens para adicionar sabor ao seu comércio eletrônico ou ao site da empresa, temos 15 dicas para web design comercial que podem ajudar sua empresa a chegar ao próximo nível!