Como escolher as imagens certas para o teu website

As imagens do website devem apoiar a tua mensagem, combinar com o tom da marca e parecer autênticas. Este capítulo aborda as imagens para websites e como usar isto no teu website e nos materiais da tua marca.

Rascunho

Atualizas a tua página inicial numa terça-feira à noite. O título está bem, as fotos estão bem, mas os visitantes continuam a sair em segundos. Começas a perguntar-te se as imagens para websites serão as peças que tens andado a ignorar. Muitas vezes são. Pequenas decisões visuais moldam as primeiras impressões mais depressa do que a maioria dos donos de negócio imagina.

As imagens do website devem apoiar a tua mensagem, combinar com o tom da marca e parecer autênticas. Este capítulo explica o que isto significa em linguagem simples, porque afeta o teu website e o teu marketing e como aplicar isto sem te perderes em jargão. Vais ver também como o tema «hero image» se encaixa no mesmo quadro. Vamos vê-lo passo a passo.

Imagens para websites na prática

As imagens do website devem apoiar a tua mensagem, combinar com o tom da marca e parecer autênticas.

Imagens genéricas de bancos de imagens podem prejudicar a confiança, se parecerem claramente encenadas.

As imagens de fundo do website têm de ser discretas, para o texto continuar legível.

Como aplicar as imagens para websites no teu site

Sempre que possível, prefere fotos reais da equipa ou do produto a imagens abstratas de bancos de imagens.

Começa por uma página, como a tua página inicial ou a landing page principal. Corrige primeiro o maior problema e depois leva o mesmo padrão para os outros modelos.

Combina este capítulo com fotografia com espaço negativo, para a base, e com fotos de bancos de imagens para websites, para o passo seguinte neste módulo.

Lista prática que podes usar hoje

Sempre que possível, prefere fotos reais da equipa ou do produto a imagens abstratas de bancos de imagens.

Quando reveres uma página, pergunta-te se as imagens para websites aparecem logo no primeiro scroll no telemóvel. Se não, reordena as secções antes de polires os detalhes.

Guarda capturas de ecrã antes e depois das alterações, para perceberes o que fez a diferença para as imagens para websites no teu site.

Partilha esta lista com quem atualiza o teu site, para que o tema «hero image» se mantenha consistente nas páginas novas.

Escolhe uma métrica para acompanhar este mês, como o tempo na página ou os formulários iniciados, para que as alterações de design se liguem aos resultados do negócio e não apenas ao gosto pessoal.

Como este tema se liga à tua marca em geral

As escolhas visuais raramente vivem numa só página. As imagens de fundo do website têm de ser discretas, para o texto continuar legível.

As tuas publicações nas redes sociais, os teus emails e as tuas peças impressas devem repetir a mesma hierarquia, as mesmas cores e as mesmas regras tipográficas que usas na web.

Quando os elementos visuais da marca se vão afastando uns dos outros, os clientes sentem uma discrepância subtil, mesmo que não saibam explicá-la.

Usa fotos de bancos de imagens para websites para comparares notas com um capítulo relacionado deste módulo.

Imagens genéricas de bancos de imagens podem prejudicar a confiança, se parecerem claramente encenadas.

Perguntas que muita gente ignora

Termos secundários como hero image e imagens de fundo para websites ajudam-te a procurar exemplos mais aprofundados e a comparar o teu trabalho com os padrões habituais.

As imagens de fundo do website têm de ser discretas, para o texto continuar legível.

Escreve uma alteração de antes e depois que vais testar numa página real esta semana. Pequenos ajustes medidos valem mais do que planos vagos.

Ensinar à tua equipa um vocabulário comum sobre as imagens para websites reduz os ciclos de revisão com designers e agências.

Ferramentas que facilitam as atualizações visuais

Não precisas de código à medida para resolver muitos problemas de layout e de estilo. Um editor visual permite-te ajustar espaçamentos, cores e tipografia enquanto vês a pré-visualização em telemóvel e em computador.

O WEMASY inclui um criador de websites com edição visual, para publicares alterações sem esperares por um programador a cada pequeno ajuste. Abre o criador de websites quando quiseres aplicar o que aprendeste.

Quando publicares atualizações, volta a ver fotografia com espaço negativo e imagens de fundo para websites, para que o módulo continue ligado na tua cabeça.

Já tens uma forma prática de olhar para as imagens para websites. Usa-a quando reveres o teu site, aprovares materiais de marketing ou briefares um designer. Continua com imagens de fundo para websites e fotos de bancos de imagens para websites para manteres o ritmo neste módulo.

Dominar as imagens para websites é uma competência que se constrói aos poucos. Volta a este capítulo depois de publicares uma melhoria, para que as ideias passem da leitura ao hábito. Pequenas revisões repetidas valem mais do que decorar todas as regras de uma vez. Guarda notas sobre o que funcionou com o teu público, para a próxima atualização ser mais rápida.

Perguntas frequentes

Quanto tempo leva a melhorar as imagens para websites?

A maioria das pequenas empresas vê páginas mais claras ao fim de algumas sessões focadas, depois de aplicar o essencial deste capítulo. Começa pela tua página inicial e depois estende as mesmas regras às páginas de serviços e de contacto.

Precisas de um designer para trabalhar nas imagens para websites?

Um designer ajuda em rebrandings complexos, mas muitas correções relacionadas com as imagens para websites podem ser feitas por ti, quando sabes o que procurar. Usa fotografia com espaço negativo em conjunto com este capítulo para teres orientações relacionadas.

O WEMASY pode ajudar-te a aplicar as imagens para websites no teu website?

O WEMASY inclui um editor visual no criador de websites, para ajustares o layout, as cores e a tipografia sem código. Abre o criador de websites para atualizares modelos e pré-visualizares as alterações no telemóvel.

Qual é o erro mais comum quando se trata das imagens para websites?

As pessoas tentam corrigir tudo de uma vez em vez de uma página de cada vez. Escolhe uma única prioridade, como a legibilidade ou o contraste, e depois vê imagens de fundo para websites para a melhoria seguinte.

Como é que as imagens para websites se ligam ao SEO?

Uma hierarquia visual clara e uma tipografia legível mantêm os visitantes mais tempo na página, o que reforça os sinais de envolvimento que os motores de pesquisa acompanham. Combina as correções de design com uma boa estrutura de conteúdo para obteres os melhores resultados.

Depois das imagens para websites, o que deves aprender a seguir?

Continua com fotografia com espaço negativo e imagens de fundo para websites neste livro, para construíres um sistema visual completo para a tua marca online.

Põe isto em prática
no teu próprio site.

Começa grátis com a WEMASY e cria o teu site em poucos minutos.