![5 Dicas para Usar e Abusar de Imagens como Background em Seu Site](https://static.wixstatic.com/media/bb1bd6_d342dec907a64736af13d74a34a9492c~mv2.jpg/v1/fill/w_715,h_409,al_c,lg_1,q_80,enc_avif,quality_auto/bb1bd6_d342dec907a64736af13d74a34a9492c~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_ecef722f7db1487290a8ed9425eda331~mv2.jpg/v1/fill/w_740,h_512,al_c,lg_1,q_85,enc_avif,quality_auto/bb1bd6_ecef722f7db1487290a8ed9425eda331~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_d5d8e20d422a4a0c9966d708473c5c36~mv2.jpg/v1/fill/w_117,h_63,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_avif,quality_auto/bb1bd6_d5d8e20d422a4a0c9966d708473c5c36~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_48bce2ac882342c38f1b09a312a55018~mv2.jpg/v1/fill/w_117,h_74,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_avif,quality_auto/bb1bd6_48bce2ac882342c38f1b09a312a55018~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_fd5ac6b9d8214a65a689a90e5b4411e0~mv2.jpg/v1/fill/w_117,h_79,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_avif,quality_auto/bb1bd6_fd5ac6b9d8214a65a689a90e5b4411e0~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_0f194c7205c74a1695d5f1949a502841~mv2.jpg/v1/fill/w_117,h_80,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_avif,quality_auto/bb1bd6_0f194c7205c74a1695d5f1949a502841~mv2.jpg)
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](https://static.wixstatic.com/media/bb1bd6_d2bf416a096b4d1e8cc6839e3c80b97f~mv2.jpg/v1/fill/w_117,h_76,al_c,q_80,usm_0.66_1.00_0.01,blur_2,enc_avif,quality_auto/bb1bd6_d2bf416a096b4d1e8cc6839e3c80b97f~mv2.jpg)
Pronto para levar seu negócio para o mundo virtual? Crie um site grátis com Wix!