Qual o Tamanho Ideal de Imagem para o Seu Site? Guia Prático
Você precisa atualizar uma foto no seu site e bate aquela dúvida: qual tamanho a imagem deve ter? Se enviar muito pequena, ela fica embaçada. Se enviar muito grande, o site fica lento. Neste guia, mostramos exatamente quais dimensões e formatos usar nos sites criados pela H3, de forma simples e direta.
Por que o Tamanho da Imagem Importa?
Imagens são, na maioria dos casos, os arquivos mais pesados de uma página. Uma foto enviada direto do celular pode ter 4 MB ou mais — enquanto uma imagem otimizada para web raramente precisa passar de 300 KB.
Usar o tamanho errado traz dois problemas:
- Imagem menor que o necessário: aparece pixelada ou esticada, passando impressão de desleixo ao visitante.
- Imagem maior que o necessário: deixa o site lento, prejudica a experiência do usuário e pode derrubar seu posicionamento no Google, que considera a velocidade de carregamento como fator de ranqueamento.
A boa notícia: você só precisa memorizar dois tamanhos.
Os 2 Tamanhos que Usamos nos Sites da H3
1. Slides e Imagens de Largura Total: 1920 x 1280 pixels
Use esse tamanho para imagens que ocupam toda a largura da página:
- Slides do banner principal (carrossel da home)
- Imagens de fundo de seções
- Fotos de destaque em capa de páginas
Os 1920 pixels de largura garantem nitidez mesmo em monitores grandes, sem exagerar no peso do arquivo.
2. Galeria de Fotos e Conteúdo Interno: 1000 x 667 pixels
Use esse tamanho para imagens que aparecem dentro do conteúdo da página:
- Galerias de fotos
- Fotos de produtos e serviços
- Imagens ilustrativas em textos e artigos
Esse formato é leve, carrega rápido e mantém ótima qualidade em qualquer tela.
Dica rápida: na dúvida, pergunte-se: "essa imagem vai ocupar a tela inteira?" Se sim, 1920 x 1280. Se não, 1000 x 667.
Qual Formato de Arquivo Usar?
.webp — Para Fotos e Imagens em Geral
O WebP é o formato moderno recomendado pelo próprio Google. Entrega a mesma qualidade visual de um JPG com arquivo até 30% menor. Resultado: site mais rápido sem perder qualidade.
Use para: fotos, banners, galerias, imagens de produtos e ilustrações.
.png — Para Vetores e Logos
O PNG suporta fundo transparente, essencial para logotipos e ícones que precisam se adaptar a qualquer cor de fundo.
Para logos, prefira SVG quando possível. Quando precisar de uma versão raster, use dimensões adequadas ao maior tamanho em que ela será exibida. O tamanho de 512 pixels de largura é algo que sempre encaixa.
Como Redimensionar e Converter Suas Imagens (Grátis)
Duas ferramentas gratuitas e online resolvem isso em segundos:
- Photopea: editor completo, parecido com o Photoshop, direto no navegador. Redimensiona e exporta em .webp.
- Watermarkly: conversor simples e rápido, ideal para transformar várias imagens em .webp de uma só vez.
O processo é simples:
- Abra a imagem na ferramenta escolhida
- Redimensione para 1920 x 1280 ou 1000 x 667, conforme o uso
- Exporte no formato .webp
- Pronto! A imagem está otimizada
Erros Comuns que Você Deve Evitar
- Enviar a foto direto do celular: sempre redimensione antes.
- Esticar imagem pequena: aumentar uma imagem de 500 pixels para 1920 não recupera qualidade — ela ficará borrada. Parta sempre de uma imagem igual ou maior que o tamanho final.
- Usar PNG para fotos: gera arquivos muito pesados. Reserve o PNG para logos e vetores.
Resumo Rápido
| Uso | Tamanho | Formato |
|---|---|---|
| Slides e imagens de largura total | 1920 x 1280 px | .webp |
| Galerias e conteúdo interno | 1000 x 667 px | .webp |
| Logotipos e vetores | Mínimo de 512 pixels de largura | .png |
Imagens otimizadas são só o primeiro passo — confira também nosso artigo sobre como otimizar a velocidade do seu site e sobre a importância do backup do seu site.
Ficou com Dúvida?
Se não tem certeza de qual tamanho usar em uma área específica do seu site, fale com a gente! É só chamar no WhatsApp que nossa equipe te orienta rapidinho.