Uma imagem de fundo raramente preencherá a janela do navegador perfeitamente, a menos que corresponda à proporção exata da tela do visitante. Este é o comportamento esperado — as janelas do navegador vêm em inúmeros tamanhos e orientações, então o SeedProd oferece três opções de tamanho de fundo para controlar como a imagem é exibida. Entender qual opção usar ajudará você a obter o resultado desejado.

Opções de Tamanho de Fundo

Você pode alterar o tamanho da sua imagem de fundo editando as configurações de fundo da seção ou página no editor do SeedProd. As três opções disponíveis se comportam da seguinte forma:

Cobrir (Padrão)

A imagem é dimensionada para preencher completamente a área de fundo. Nenhum espaço vazio é mostrado, mas partes da imagem podem ser cortadas dependendo do tamanho e da proporção da tela do visitante.

Esta é a configuração padrão e funciona bem para a maioria dos fundos de herói em tela cheia, onde preencher a área é mais importante do que mostrar a imagem inteira. Para controlar qual parte da imagem permanece visível quando é cortada, ajuste a configuração de Posição do Fundo (ponto focal) — por exemplo, defini-la como Centro Centro mantém o meio da imagem em exibição.

Ajustar

A imagem é dimensionada para caber inteiramente dentro da área de fundo sem ser cortada. A imagem completa está sempre visível, mas se a proporção da imagem não corresponder ao contêiner, um espaço vazio aparecerá ao redor dela, preenchido pela cor de fundo.

Use Ajustar quando for importante que a imagem inteira esteja sempre visível — por exemplo, um logotipo, diagrama ou ilustração onde o corte removeria conteúdo significativo. Defina uma cor de fundo que complemente a imagem para preencher o espaço vazio.

Automático

A imagem é exibida em seu tamanho original sem dimensionamento. Se a imagem for menor que o contêiner, ela se repetirá por padrão; se for maior, ela transbordará e será cortada. Esta opção oferece o controle mais direto, mas requer que a imagem seja dimensionada precisamente para o contêiner.

Escolhendo a Configuração Certa

• Fundo preenche a área sem lacunas → use Cobrir e ajuste a Posição do Fundo para controlar qual parte da imagem é centralizada.
• Imagem completa deve estar sempre visível → use Ajustar e defina uma cor de fundo para preencher o espaço circundante.
• Imagem tem um tamanho fixo específico → use Automático e dimensione sua imagem para corresponder exatamente às dimensões do contêiner.

Recomendações de Tamanho de Imagem

Para obter os melhores resultados com a configuração Cobrir, use uma imagem de fundo que tenha pelo menos 1920 × 1080 pixels e exporte-a em um tamanho de arquivo apropriado para a web (geralmente abaixo de 300 KB para imagens JPEG). Uma imagem ampla e orientada horizontalmente será dimensionada e cortada de forma mais previsível em diferentes tamanhos de tela do que uma imagem quadrada ou vertical.

Se a sua imagem de fundo ainda não parecer correta após ajustar estas configurações, tente experimentar a opção Posição do Fundo para deslocar o ponto focal, ou use uma imagem de origem mais ampla que ofereça mais flexibilidade quando o corte ocorrer em telas mais estreitas.