• 0k
  • 0
Web Design \ 26 de Março de 2015

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site

Você vem buscando uma forma de cativar imediatamente a atenção dos visitantes de seu site? Se sua resposta é ‘sim’, então um dos métodos mais eficientes para cativá-los com sucesso, é usar em seu site, imagens como backgrounds (planos de fundo) de tela inteira, devido ao seu forte impacto visual.

Agora, para conseguir o efeito desejado com um background de tela inteira, é necessário fazer muito mais do que simplesmente o upload de uma bela fotografia. Na realidade, se você não prestar atenção a algumas orientações importantes, sua imagem de fundo pode acabar por causar problemas ainda mesmo na fase de criação.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site

A seguir, as dicas do Wix para conseguir o efeito tão desejado:

Imagens, Só Grandes e de Alta Qualidade!

Não importa o elemento visual que você vai usar para o background do seu site, no entanto, é preciso usar a melhor versão possível deste arquivo. O truque para os backgrounds de site é usar um arquivo grande o suficiente para que sua aparência fique profissional em todas as telas, sem no entanto ser um arquivo pesado demais e que vá sobrecarregar o tempo de carregar o site. Como princípio básico uma resolução de 72 dpi (“dots per inch” ou em português “pontos por polegada”) é suficiente, mas pode experimentar também com 96 dpi. Para os sites do Wix, o tamanho recomendado para a imagem do plano de fundo é de 1250 x 800 ou qualquer tamanho acima desde que esta proporcionalidade seja respeitada.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site_2

Compreendendo o Contraste de Cores

Mesmo que sua imagem de background seja absolutamente deslumbrante, você não pode esquecer que é para funcionar como um plano de fundo, o que significa que há outros elementos no site que precisam chamar a atenção dos visitantes. Uma forma de se certificar que o restante do conteúdo está claramente visível e legível é usar um contraste forte de cores para acentuar o texto e botões para garantir que o conteúdo não ficará perdido no background.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site_3

Equilíbrio

Se a imagem do plano de fundo de tela inteira inclui diversos detalhes (como uma foto com muitas pessoas, uma paisagem urbana, diversos produtos agrupados, etc.), você precisa se certificar de que o conteúdo da imagem e o conteúdo fora da imagem (menu de navegação, textos, apps, links para as redes sociais e tudo mais o que você tem no site) estejam equilibrados um com o outro. Comece por fazer o upload da imagem do background e depois adicione o restante dos elementos do site de forma a que haja uma harmonia entre todos esses elementos.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site_4

Trabalhando com Formas

Uma maneira excelente de equilibrar o conteúdo com o background de tela inteira é usar formas e banners para criar uma faixa extra entre o plano de fundo e o conteúdo do site. Se você quiser adicionar um balão de texto, mas acha que ficou gritante demais junto com a imagem do plano de fundo, então tente adicionar uma outra forma, preencha com uma cor que vá criar um bom contraste e aí sim, adicione o texto. Assim esta forma vai funcionar como uma zona de separação que manterá seu design limpo e ordenado.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site_5

Verifique o Comportamento da Imagem em Diferentes Telas e Dispositivos

Nem todos os visitantes do seu site usam os mesmos dispositivos e os mesmos browsers. Por isso, você, como designer e dono do site, precisa se certificar que seu background tenha uma aparência boa no maior número possível de formas de visualização. Para browsers da web, teste o seu plano de fundo pelo menos nos browsers mais comuns – Chrome, Firefox e Internet Explorer. Teste ainda sua versão mobile num tablet e dispositivo mobile. Se você, por acaso, tiver um desktop com aquelas belíssimas telas grandes (ou conhece algum sortudo que tenha), não esqueça de testar lá também. A ideia é experimentar e ver se seu plano de fundo funciona no maior número possível de tamanhos de tela.

5 Dicas para Usar e Abusar de Imagens como Background em Seu Site_6

É verdade, você sabia que pode até usar diferentes backgrounds em diferentes páginas do site?

Pronto para levar seu negócio para o mundo virtual? Crie um site grátis com Wix!


Receba o
No Conforto da Sua Casa!

Assine o Wix Blog e não perca nenhuma novidade!

Hmmm, that's not a valid email address.

Aproveite! \ 

Receba em primeira mão dicas atualizadas sobre como
promover seu negócio, Web Design, SEO e do Wix!

Hmmm, that's not a valid email address.