resolução de imagem

saudações @taquinhomartins,

vendo seu link, não vejo nenhum problema com as imagens, seja na página da Loja, seja na página do produto.

algo que por vezes é necessário é configurar o tamanho das miniaturas (thumbnail) para que sejam menores que o tamanho de exibição na página. pois se o tamanho da miniatura for menor, isso obriga a página a “esticar” a imagem, o que gera imagens visualizadas de forma “feia”, pixelada.

bom sempre ter a documentação do tema Storefront, disponível no link abaixo

https://docs.woocommerce.com/documentation/themes/storefront/

pois além dos guias básicos de instalação, configuração e personalização, possui orientações que ajudam a ter a melhor experiência possível com o tema.

boa sorte e sucesso!

pelo contrário, eu não acessei por celular, apenas pelo desktop.

nesse caso há duas possibilidades:

1) você consertou, mas não vê o resultado devido cache de seu navegador. nesse caso, ou limpe o cache de seu navegador e recarregue a página ou acesse seu link em uma janela privada (que justamente não carrega nenhum cache)

2) a resolução de sua tela de desktop está pequena e com isso o tema, que é responsivo, está mostrando não a versão para desktop, mas a mobile. pois essa definição é feita através de valores de resolução de tela. com essa visualização mobile em uma tela grande, o site está esticando as imagens e você está vendo as imagens feias.

pode ver na imagem abaixo minha visualização de seu site e dados fornecidos pela função Inspecionar do navegador. no meu monitor, que uso com resolução de 1600×900, a caixa onde fica a imagem tem 231.3×231.3px de dimensão, sendo que a miniatura (thumbnail) tem 324x324px. ou seja, perfeito, pois as dimensões da imagem tem que ser maior que a da caixa. pois se for o contrário, o sistema estica a imagem para o tamanho da caixa e isso gera imagens com aspecto de baixa resolução ou pixeladas.

para ver a imagem em tamanho maior, clique com o botão direito do mouse (usuários Linux e Windows) e escolha opção para “Ver imagem”. ou acesse em,
https://i.paste.pics/7fe0dd70e1e86145df114d4bf54937cf.png

então por favor verifique especialmente o cache de seu navegador.

por favor nos informe se deu certo.

• Esta resposta foi modificada 5 anos, 3 meses atrás por Ralden Souza.

se está falando da imagem que está no centro do printscreen que passei, é uma visão ampliada da sua imagem, que está em destaque sob uma cor azul. como essa imagem está ampliada, sim, ela perde resolução, pois está sendo vista em um tamanho maior que seu tamanho original. (lembrando que uso resolução 1600×900 em meu monitor).

a visualização de sua imagem, na posição original na página da loja, a meu ver está perfeita. mas se não está gostando, precisa considerar os seguintes pontos:

1. a qualidade da imagem com 72dpi, tamanho 1000×1000 que está enviando está perfeita? porque se a qualidade dela já estiver baixa, a miniatura acompanha a qualidade.

2. está usando um plugin de otimização de imagens? se sim, precisa ver que configurações está usando, pois dependendo das configurações que usou, há maior ou menor perda de qualidade. então precisa optar por uma configuração com menor perda de qualidade (mas que, por consequência, também não diminui tanto o tamanho da imagem)

3. acesse Aparência > Personalizar > Layout > acredito que seja aqui que estão algumas configurações (não tenho certeza, não uso esse tema, cabe a você procurar). verifique as configurações de imagens, se houver a opção, aumente a resolução das miniaturas.

4. acesse Configurações > Mídias > e veja as configurações de miniaturas e médio aqui, se for o caso amplie as resoluções.

a partir de tentativas e verificações (se usa plugin de cache, limpe o cache após as alterações), você poderá ver se ficou como deseja. mas lembrando que ao ampliar resoluções, aumenta o tamanho das imagens e isso influencia na velocidade de carregamento do site. (a vida é feita de escolhas…)

boa sorte.