Publicidade
Aprenda como compactar imagens sem perder a qualidade para o seu site
16 de Setembro de 2015

Aprenda como compactar imagens sem perder a qualidade para o seu site

Dentro de cada arquivo de imagem JPG, JPEG, PNG, GIF ou outra extensão, há metadados e informações repetidas. O trabalho da compressão de imagem é retirar essas informações redundantes para diminuir o peso do arquivo. Por exemplo, vamos imaginar um pixel qualquer de uma imagem. Possivelmente, a cor ou o valor desse pixel será igual a de vários outros elementos dentro da mesma imagem. Quando a imagem é comprimida, em vez de ela possuir vários pixels iguais e repetidos, ela guarda apenas um valor desse pixel, que é reproduzido para os outros semelhantes, economizando tempo de carregamento.

Há vários benefícios para quem mantém um site com as imagens com tamanhos otimizados. Em primeiro lugar, quanto mais leve for sua página, mais rapidamente ela será carregada para os visitantes. E é importante manter as páginas sempre o mais leve possível, tendo em vista que as velocidades de conexão variam muito.

Publicidade

Pode ser que o seu site esteja abrindo rápido para você, mas é recomendado que se faça um teste em ferramentas online para descobrir o quão rápida está sua página de fato.

O Google oferece a ferramenta Page Speed Insights, no Search Console. Outras plataformas como WebPageTest e Pingdom também permitem que você analise o tempo de resposta de sua página e quais são os arquivos que estão demandando um maior tempo de carregamento, desde imagens a scripts e plugins

Sites lentos e com imagens altamente pesadas. A não se que a imagem seja o foco do negócio, como sites de fotógrafos e estúdios, não faz sentido deixar os arquivos consumindo um maior espaço. Por outro lado, até mesmo sites de fotografia podem otimizar seu tempo de carregamento. Caso a opção ainda seja manter as imagens em qualidade suprema, é possível otimizar o site utilizando imagens de miniatura menores e que podem ser ampliadas, aí sim em alta qualidade, com a intervenção do visitante.

Mesmo assim, as diferenças podem ser incrivelmente sutis. A não ser que você esteja precisando de uma imagem para impressão, não há nada que impeça que você comprima essas imagens.

A velocidade de carregamento do site é um dos critérios levados em consideração pelo Google e que pode definir – favoravelmente ou não – seu posicionamento na SERP.

O critério é oficialmente relevado pelo Google desde 2010. Segundo um post no Webmaster Central Blog, sites rápidos geram uma maior satisfação por parte da audiência, o que facilita conversões e eventuais retornos. Outro detalhe, de acordo com estudos internos do Google, é que visitantes passam menos tempo em sites que são lentos.

Uma outra prova de que o Google leva a sério esse quesito é em relação a nova logo da empresa, divulgada em 2015. Além das características visuais, que tiveram uma modificação relevante, o que chamou a atenção também foi seu peso. A nova logo do Google possui 305 bytes, um peso consideravelmente menor se comparado aos 14.000 bytes da logo antiga.

Há duas formas de compressão:

Lossless (sem perda de dados)

Comprimir imagens em lossless é a opção perfeita para quem precisa da qualidade máxima a todo custo. Geralmente usada por fotógrafos, a compressão de imagens lossless é feita com arquivos de extensões com mais recursos, como TIFF e PNG.

Lossy (com perda de dados)

O formato de compressão recomendado para web resulta em uma pequena queda da qualidade. Tão pequena que é pouco notada pelo olho humano. Em lossy, você pode otimizar a imagem em até 90% de seu tamanho original, dependendo dos casos. JPG, JPEG e GIF são os formatos mais conhecidos de imagens com esse tipo de compressão.

5 sites em que você pode compactar as imagens online:

1 – Kraken.io

O Kraken é uma plataforma compressora que oferece uma forma fácil de se fazer a otimização de imagens, direto do navegador. A web interface do Kraken permite que você faça o upload de qualquer imagem para ser comprimida e baixada logo depois, tanto em Lossy como em Lossless.

A ferramenta possui um plano gratuito que permite upload a imagens de até 1mb. Há também planos pagos que oferecem outras regalias como redimensionamento de imagens e armazenamento na nuvem.

2 – JPEGmini

O JPEGmini é outra plataforma com webinterface gratuita. O diferencial é que você, após fazer o upload do arquivo, pode compará-lo com o original antes de fazer o download.

Também há um plano pago do JPEGmini, que permite upload de arquivos com até 50mb e integração com o Adobe Lightroom.

3 – Smush.it

O Smush.it é uma solução bem completa para compressão de imagens e que carrega três formas de otimização.

É possível comprimir as imagens fazendo upload direto no site, preenchendo um campo com as urls das imagens ou instalando uma extensão para o Firefox.

E ainda há uma terceira forma. Com o plugin WP Smush.it, para WordPress, você pode otimizar todas as imagens que já estão em seu diretório com poucos cliques.

4 – TinyPNG

Apesar da nomenclatura, a plataforma também aceita outros arquivos de imagens além de PNG. O TinyPNG permite o upload de até 20 arquivos simultâneos, com peso máximo de 5mb cada.

A plataforma também possui plugins para WordPress e Magento.

5 – Compress PNG

Assim como as plataformas anteriores, o Compress PNG possui uma web interface para upload de arquivos. Com o máximo de 20 arquivos simultâneos, após a compressão você pode baixar todas as imagens em um arquivo compactado.

Além de PNG, a minimalista plataforma otimiza arquivos JPG, JPEG e PDF.

Bônus: Comprimindo imagens no Photoshop

É bastante recomendável o uso de alguma das plataformas mencionadas acima para manter o seu site leve sem que as imagens percam qualidade em demasia.

No entanto, antes ainda desse processo, você pode otimizar as imagens em softwares bem conhecidos e utilizados no meio, como o Photoshop.

Para comprimir as imagens no Photoshop, utilize o comando “Salvar para web” (Alt+Shift+Ctrl+S). Esse comando permite exportar imagens otimizadas para internet. Você pode fazer um controle bem refinado sobre a imagem ao analisar os previews antes mesmo de exportá-la para o formato web.

Cuide a qualidade, pois nessa ferramenta, dependendo de quão baixo for o nível, pode ocorrer perdas visíveis. Portanto, faça os testes e veja até qual ponto a redução de tamanho da imagem não comprometerá o produto final.
Outro detalhe importante é cuidar as dimensões das imagens. Não há necessidade de salvar imagens com dimensões maiores ao máximo que o layout permite.

Usar as imagens comprimidas e nas dimensões certas pode poupar um bom tempo de carregamento de seu site e, consequentemente, melhorar a experiência do usuário e o desempenho no ranqueamento do Google.

Texto: Resultado Digitais

Foto: Flickr.com

WhatsApp
Junte-se a nós no WhatsApp para ficar por dentro das últimas novidades! Entre no grupo

Ao entrar neste grupo do WhatsApp, você concorda com os termos e política de privacidade aplicáveis.

    Newsletter


    Publicidade