5 Dicas para Usar e Abusar de Imagens como Background em Seu Site
Atualizado: 28 de mar.
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.
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.
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.
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.
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.
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.
Pronto para levar seu negócio para o mundo virtual? Crie um site grátis com Wix!
Por Equipe Wix
