Resposta rápidao tamanho ideal de imagem para loja virtual é a maior largura em que o seu tema exibe a imagem, multiplicada por cerca de 2 para telas de alta densidade. Na prática: miniaturas de vitrine entre 600 e 800 px, foto de produto quadrada entre 1000 e 1600 px e banners entre 1400 e 1920 px de largura. Mantenha a mesma proporção em todo o catálogo.
Cada plataforma tem sua tabela de medidas recomendadas, e cada tema muda um pouco essa tabela. Nuvemshop, Shopify, Tray e WooCommerce falam números diferentes, e o lojista fica com a impressão de que precisa decorar todos. Não precisa.
A lógica por trás do tamanho ideal de imagem para loja virtual é a mesma em qualquer plataforma: descobrir quanto espaço a imagem ocupa na tela, preparar um pouco mais do que isso para telas nítidas e não passar daí. Este guia mostra como medir no seu próprio tema e como preparar o catálogo uma vez só.
Por que não existe uma medida única
A mesma foto aparece em vários lugares da loja, em tamanhos diferentes:
- Vitrine e categoria: miniaturas em grade, de 2 a 5 por linha.
- Página de produto: a foto principal, grande, muitas vezes com zoom.
- Carrinho e busca: miniaturas pequenas.
- Banner da home: imagem larga, de ponta a ponta.
Além disso, cada tema define a largura do conteúdo. Um tema com área central de 1200 px exibe a foto de produto menor do que um tema de largura total. Por isso, a recomendação genérica da plataforma é só um ponto de partida.
O que acontece quando a medida está errada
| Situação | Sintoma na loja | Consequência |
|---|---|---|
| Imagem muito maior que o espaço | Página lenta, sobretudo no 4G | Mais tempo de carregamento |
| Imagem menor que o espaço | Foto borrada ou serrilhada | Produto com cara de amador |
| Proporções diferentes no catálogo | Vitrine desalinhada | Tema corta partes do produto |
| Banner sem versão para celular | Texto do banner ilegível | Mensagem perdida |
A velocidade importa para o comprador e para o Google. Segundo o web.dev, um Largest Contentful Paint bom fica em até 2,5 segundos, e numa página de produto o maior elemento costuma ser justamente a foto principal.
Como descobrir o tamanho ideal no seu tema
Em vez de confiar numa tabela, meça. Leva cinco minutos e vale para o catálogo inteiro:
- Abra a página de produto no computador, com a janela maximizada.
- Clique com o botão direito na foto principal e escolha "Inspecionar".
- Veja a largura exibida na caixa que aparece sobre a imagem (por exemplo, 620 × 620).
- Repita na vitrine e no banner da home.
- Multiplique por 2. Telas de celular e notebooks modernos têm densidade de pixels 2x ou mais; uma foto exibida a 620 px fica nítida com cerca de 1240 px.
- Some o zoom, se o tema tiver: a largura da foto ampliada passa a ser a referência.
- Anote a proporção (quadrada 1:1, retrato 3:4 ou 4:5) e use a mesma em todo o catálogo.
Tabela de referência para começar
Se ainda não mediu, estas faixas costumam funcionar na maioria dos temas:
| Uso | Largura de referência | Proporção comum |
|---|---|---|
| Miniatura de vitrine | 600 a 800 px | 1:1 ou 3:4 |
| Foto da página de produto | 1000 a 1600 px | 1:1 ou 3:4 |
| Foto com zoom | 1600 a 2000 px | Igual à da página |
| Banner de página inteira (computador) | 1400 a 1920 px | Definida pelo tema |
| Banner para celular | 750 a 1080 px | Mais alto que largo |
| Logo | Altura de 2x a exibida | Livre, com transparência |
Repare que a miniatura e a foto da página podem vir do mesmo arquivo: muitas plataformas geram as miniaturas automaticamente. O que você controla é o arquivo de origem.
Pasta Mágica
Coloque o catálogo inteiro na medida certa
Defina a largura do seu tema uma vez e redimensione centenas de fotos preservando a proporção. Foto pequena não é ampliada.
Preparar uma vez, usar em todos os lugares
O erro mais caro é preparar imagens caso a caso: uma medida para o lançamento, outra para a promoção, outra quando muda o tema. O caminho mais simples é ter um padrão fixo de saída.
Fotos de produto
Defina uma medida-mestra, por exemplo, 1600 px no lado maior, proporção quadrada. Todas as fotos novas passam por esse padrão antes de subir. Se as fotos chegam do fornecedor em tamanhos variados, o guia de como redimensionar fotos de produto para o catálogo inteiro mostra como lidar com as pequenas demais.
Banners
Banner é peça de design, não de catálogo. Crie no editor já na medida do tema e, se o tema aceitar, produza a versão para celular separadamente, com o texto maior.
Sites próprios: várias larguras da mesma imagem
Em loja feita sob medida, o ideal é oferecer várias larguras do mesmo arquivo e deixar o navegador escolher a adequada para cada tela. A MDN explica como funcionam as imagens responsivas; o passo a passo prático está em imagens responsivas com srcset.
Erros comuns ao definir a medida
- Medir com a janela pequena. O tema reorganiza a página conforme a largura da tela. Meça com a janela maximizada e, depois, no celular.
- Esquecer o zoom. Se o cliente pode ampliar a foto, a medida de referência é a da foto ampliada, não a da página.
- Ampliar foto pequena para "caber" no padrão. Aumentar 700 px para 1600 px não cria detalhe; só borra. Melhor pedir a foto original ao fornecedor.
- Trocar de tema e não revisar. Tema novo, medidas novas. Refaça a medição antes de subir a próxima coleção.
Medida certa ainda não é peso certo
Com a medida resolvida, falta o peso. Uma foto de 1600 px pode ter 200 KB ou 2 MB, dependendo do formato e da qualidade. As duas coisas andam juntas:
- Medida define quantos pixels a imagem tem.
- Formato (WebP, JPEG) e qualidade definem quantos bytes cada pixel custa.
Para o peso, veja como comprimir imagens para loja virtual. Se a loja já está lenta, comece pelo diagnóstico de loja virtual lenta por causa das imagens.
Antes e depois: um catálogo de 300 produtos
Imagine uma loja com 300 produtos e 4 fotos cada, vindas de fornecedores diferentes: 1200 arquivos entre 800 e 5000 px, com proporções variadas.
| Etapa | Antes | Depois do padrão |
|---|---|---|
| Medida | 800 a 5000 px | 1600 px no lado maior |
| Proporção | Misturada | Quadrada em todo o catálogo |
| Vitrine | Desalinhada | Grade uniforme |
| Novas coleções | Ajuste foto a foto | Mesmo fluxo, sempre |
Feito à mão, ajustar 1200 arquivos leva dias. Com um fluxo em lote, a regra é definida uma vez e aplicada a todos.
Perguntas frequentes
Depende do tema, mas uma referência comum é foto quadrada entre 1000 e 1600 px de lado para a página de produto, o que permite zoom e telas de alta densidade. O jeito certo de decidir é medir a maior largura em que o seu tema exibe a foto e multiplicar por 2.
Banners de página inteira costumam ser exibidos com 1400 a 1920 px de largura no computador. A altura varia muito entre temas. Confira a recomendação do seu tema e prepare uma versão separada para celular, se ele permitir.
Pode, mas o upload fica lento, o armazenamento cresce e você depende do redimensionamento automático da plataforma. Subir já na medida certa costuma deixar a loja mais rápida e previsível.
Precisam ter a mesma proporção e, de preferência, a mesma medida. Fotos com proporções diferentes deixam a vitrine desalinhada, porque o tema corta ou encaixa cada uma de um jeito.
Não. Acima da largura em que o tema exibe a imagem, cada pixel a mais só aumenta o peso. Uma foto de 4000 px numa vitrine de 400 px envia muito mais dados do que a tela usa.
Como automatizar isso com a Pasta Mágica
A Pasta Mágica para e-commerce aplica a medida do seu tema a todo o catálogo, com bibliotecas de imagem tradicionais, sem IA mexendo no produto.
- Crie sua conta em pastamagica.com.br/cadastrar e teste com fotos reais.
- Escolha Redimensionar imagem e informe a largura ou a altura que você mediu no tema. A proporção é preservada e fotos menores não são ampliadas.
- Encadeie Comprimir imagem com qualidade em torno de 80. Para site próprio, use Conjunto responsivo (srcset), que gera várias larguras (por padrão, 320 a 1920 px) em WebP.
- Solte as fotos ou a pasta inteira. Cada arquivo é conferido pelo conteúdo, não pela extensão.
- Acompanhe arquivo por arquivo e baixe tudo pronto, um a um ou em ZIP.
Cada automação mostra o custo em créditos antes de rodar, e se uma etapa falhar a reserva volta sozinha. Os limites de cada plano estão na tabela de preços.
Pasta Mágica
Meça uma vez, aplique ao catálogo inteiro
Redimensione e comprima todas as fotos da loja num fluxo salvo, pronto para cada nova coleção.
