As imagens têm um peso muito importante na sua loja online. São indispensáveis para conquistar a confiança do cliente, que precisa de ver o produto como se estivesse numa loja física para finalmente se decidir a comprá-lo. Por isso, um ecommerce conta com uma grande quantidade de imagens que, se não forem exportadas com a resolução e a qualidade adequadas, podem tornar o carregamento mais lento e, consequentemente, levar o utilizador a abandonar a sua loja. Na Línea Gráfica explicamos-lhe como otimizar as imagens para que isso não aconteça. Continue a ler!
Assim, por exemplo, se a maior imagem de produto que tem for de 1000 px X 1000 px, deverá usar as imagens desse tipo com esse mesmo tamanho. Se, nesse caso, usar uma imagem mais pequena, ela aparecerá pixelizada. Ou seja, terá de adaptar cada imagem ao formato ou tamanho que tiver definido. Por outro lado, quanto ao peso dessas imagens, o recomendado é que não ultrapassem os 100 KB; caso contrário, aumentará o tempo de carregamento do seu ecommerce.
Agora só temos de reduzir o peso dessas imagens e substituí-las, por isso guarde-as no seu computador. Depois de as guardar todas, use uma ferramenta para comprimir imagens. Nós mostramos-lhe o Compresspng e o Compressjpg, mas pode usar qualquer outra, já que o funcionamento é muito semelhante e bastante intuitivo. Primeiro, carregue as suas imagens no Compresspng ou no Compressjpg, consoante o formato, clicando em Upload Files. Dependendo das imagens que carregar, a compressão demorará mais ou menos tempo. Quando terminar, descarregue-as em Download ZIP. Já tem as suas imagens comprimidas! Agora só tem de voltar a carregá-las no seu site. 
E se o que pretende é carregar imagens novas no seu site, basta exportá-las no formato adequado e com uma resolução de 72 ppp a partir de um programa de edição de imagem. No Photoshop e no GIMP, deve guardá-las através de Guardar para Web. Aparecerá um ecrã onde poderá escolher o formato; escolha o que mais lhe convier, de acordo com o que explicámos acima. Também pode verificar e alterar a resolução em Imagem > Tamanho da imagem. 
Em resumo: 
Porque é importante otimizar as imagens?
Já ficou claro que uma das principais consequências de o seu ecommerce não carregar a uma velocidade adequada, devido à resolução e ao tamanho das suas imagens, é os visitantes abandonarem a página. Como já dissemos mais do que uma vez, os seus utilizadores não estão dispostos a esperar quando sabem que há outras páginas que lhes oferecem o mesmo conteúdo com maior rapidez. Um site com carregamento lento é sinónimo de uma taxa de rejeição muito elevada. Além disso, as redes 3G e 4G de um smartphone nem de perto alcançam a velocidade da banda larga que chega a casa. Tendo isto em conta, e sabendo que cada vez mais utilizadores acedem à Internet a partir de dispositivos móveis, é fundamental não descurar a velocidade de carregamento das imagens da sua loja. Mas a questão não fica por aqui. O gigante da Internet também tem muito em conta a velocidade de carregamento de um site no que toca ao posicionamento SEO. Como já deve imaginar, o Google dispõe de um tempo limitado para rastrear o seu site. Isto significa que, quanto mais depressa a sua loja abrir, mais hipóteses terá o Google de rastrear um maior número de páginas do seu ecommerce e, com isso, mais possibilidades terá de surgir entre os primeiros resultados do motor de pesquisa. Mas comecemos pelo princípio…Que qualidade devem ter as imagens?
Como lhe temos vindo a contar, as imagens são um elemento fundamental em qualquer loja online. Por isso, queremos também que conheça os parâmetros que deve ter em conta na hora de escolher e otimizar as imagens do seu site.Resolução
Antes de mais, é preciso perceber que guardar uma imagem para a publicar na Internet não é o mesmo que guardá-la para impressão. São duas formas de visualizar uma imagem em suportes muito diferentes: num ecrã e em papel. Por isso, o mais importante é verificar, num programa de edição de imagem (como o Photoshop, o Illustrator ou o GIMP), que tem uma resolução de 72 ppp (píxeis por polegada). Quanto maior for este número, maior será a qualidade. Para a mostrar num site, 72 ppp é mais do que suficiente, ao passo que, para a imprimir num cartaz, por exemplo, seriam necessários cerca de 300 ppp.Formato
Certamente, ao guardar uma imagem, aparecem-lhe vários formatos e já lhe terão surgido perguntas como: o que pesa mais, PNG ou JPG? Por isso, é importante saber para que serve cada formato, já que alguns são mais úteis na hora de otimizar as imagens. Por trás de cada um há todo um mundo, mas não se preocupe: damos-lhe os dados necessários para saber quando usar um ou outro:- JPG: É o formato universal para fotografias, pois é o que melhor as comprime sem perder a tonalidade nem as cores originais. Por isso, é ótimo para imagens com muitos detalhes. Além disso, pode ajustar a qualidade de 0 a 100. Por exemplo, se guardar com qualidade 80, quase não notará diferença na nitidez, mas sim no peso da imagem, que ocupará cerca de 30% menos.
- PNG: Permite manter transparências, o que o torna o melhor formato para imagens de marca, como logótipos ou imagens com cores planas. A sua grande vantagem é que não perde muita qualidade na compressão. Mas há diferença entre PNG 8 e PNG 24? A diferença entre os dois é que o PNG 8 guarda no máximo 256 cores, enquanto o PNG 24 chega aos 16 milhões de cores. Recomendamos que use o PNG 8 apenas em imagens que não precisem de transparências e tenham poucas cores.
- GIF: Recorra a este formato apenas quando as suas imagens incluírem alguma animação. Tenha em conta que não comprime com boa qualidade, porque as animações incluem vários fotogramas, ou seja, guardam mais do que uma imagem.
- WEBP: este formato, desenvolvido pela Google há alguns anos, oferece imagens de alta qualidade, mas com um tamanho menor do que outros formatos, como PNG ou JPG. Por isso, ao otimizar enormemente o tamanho das imagens sem sacrificar a qualidade, é um formato muito adequado para sites.
Dimensões
Normalmente, tendemos a guardar a imagem no tamanho predefinido ou até num tamanho grande, por acharmos que assim ficará melhor no nosso site. Mas já deve ter percebido que a qualidade e a nitidez das suas imagens dependem sobretudo da resolução e do formato em que as exporta. Portanto, esqueça a ideia de guardar as imagens num tamanho grande: vão ficar muito mais pesadas, sem qualquer sentido, se a imagem for mostrada num tamanho bem mais pequeno na sua página. Aconselhamos, por isso, que exporte todas as imagens no tamanho real com que serão mostradas no seu site, ou seja, com as dimensões que usa no seu PrestaShop. Assim, se a imagem vai ocupar um espaço de 50 px x 70 px, ajuste-a a esse tamanho. Desta forma, conseguirá reduzir bastante o peso das suas fotografias sem que percam qualidade nem fiquem pixelizadas. Para quê ter uma imagem maior se os seus utilizadores a vão ver mais pequena?Que tamanho usar nas fotos de produtos?
Em Design > Configurações de imagem, no seu PrestaShop, pode filtrar por produtos e ver o tamanho de todas as imagens de produtos da sua loja. Assim, por exemplo, se a maior imagem de produto que tem for de 1000 px X 1000 px, deverá usar as imagens desse tipo com esse mesmo tamanho. Se, nesse caso, usar uma imagem mais pequena, ela aparecerá pixelizada. Ou seja, terá de adaptar cada imagem ao formato ou tamanho que tiver definido. Por outro lado, quanto ao peso dessas imagens, o recomendado é que não ultrapassem os 100 KB; caso contrário, aumentará o tempo de carregamento do seu ecommerce.
Ferramentas para otimizar as imagens
Mostramos-lhe uma série de boas práticas e ferramentas que farão com que a sua loja online carregue muito mais depressa. Se já tem a sua loja online criada, o primeiro passo é verificar a velocidade de carregamento. Para isso, recomendamos que a analise com o PageSpeed. É muito simples: basta introduzir o seu URL, clicar em analisar e aparecerão os resultados, divididos entre diagnósticos e oportunidades. Além disso, ao clicar nas setas da direita, verá como corrigir esses erros. Agora só temos de reduzir o peso dessas imagens e substituí-las, por isso guarde-as no seu computador. Depois de as guardar todas, use uma ferramenta para comprimir imagens. Nós mostramos-lhe o Compresspng e o Compressjpg, mas pode usar qualquer outra, já que o funcionamento é muito semelhante e bastante intuitivo. Primeiro, carregue as suas imagens no Compresspng ou no Compressjpg, consoante o formato, clicando em Upload Files. Dependendo das imagens que carregar, a compressão demorará mais ou menos tempo. Quando terminar, descarregue-as em Download ZIP. Já tem as suas imagens comprimidas! Agora só tem de voltar a carregá-las no seu site. E se o que pretende é carregar imagens novas no seu site, basta exportá-las no formato adequado e com uma resolução de 72 ppp a partir de um programa de edição de imagem. No Photoshop e no GIMP, deve guardá-las através de Guardar para Web. Aparecerá um ecrã onde poderá escolher o formato; escolha o que mais lhe convier, de acordo com o que explicámos acima. Também pode verificar e alterar a resolução em Imagem > Tamanho da imagem. Em resumo:
Módulo para otimizar imagens no PrestaShop
Como comentámos no início do artigo, melhorar a velocidade de carregamento não beneficia apenas o utilizador que navega tranquilamente na nossa loja PrestaShop. O Google, sempre ávido de sites de qualidade, valoriza tanto o tempo que um ecommerce demora a abrir que, se este carregar a uma velocidade aceitável, fá-lo-á aparecer nas primeiras posições. E o que significa isso? Que, se tiver uma loja online fantástica, mas a sua concorrência também tiver e, ainda por cima, carregar mais depressa, o Google vai colocá-la à sua frente nos resultados de pesquisa. Já sabe que oferecer comodidade, transparência e segurança é a base de qualquer loja online. Claro que sabe, e também compreendemos as dificuldades que isso implica. Por isso, e com o objetivo de apresentar todas as alternativas para melhorar a velocidade de carregamento, propomos-lhe a mais cómoda e eficaz. O Módulo para otimizar imagens no PrestaShop assinado pela Línea Gráfica é a ajuda de que precisa para transformar a sua loja PrestaShop num verdadeiro peso-pluma. Este módulo reduz o tamanho das imagens do seu site sem perder qualidade, através de um sistema intuitivo e muito fácil de usar:- Escolha a percentagem de redução que pretende para os ficheiros JPG e JPEG.
- Selecione o valor de redução dos ficheiros PNG.
- Selecione as imagens da sua loja que não quer comprimir. Um logótipo, por exemplo.
Ver o módulo de compressão de imagens!
Se procurava um impulso rápido para melhorar a velocidade e o posicionamento do seu site, encontrou-o. Verificar os seus resultados em tempo recorde e oferecer uma melhor experiência nunca foi tão acessível! E se, depois de tudo isto, ainda não sabe como melhorar a velocidade de carregamento no PrestaShop, não se preocupe: preparámos o guia definitivo passo a passo!E você, usa outras ferramentas para otimizar as suas imagens? Na Línea Gráfica somos especialistas em marketing digital e Partner Platinum PrestaShop, por isso, se precisar de ajuda para posicionar a sua loja, basta entrar em contacto connosco.
