Como otimizar imagens p/ melhorar o desempenho do seu site

Como otimizar imagens para melhorar o desempenho do seu site

Buscando dicas para otimizar as imagens do seu site e deixar ele voando? Pois confira à seguir as melhores dicas da nossa equipe para aplicar ainda hoje no seu site!

Anúncio

As imagens são elementos essenciais para tornar o seu site mais atraente, informativo, e profissional. No entanto, elas também podem afetar negativamente o desempenho do seu site, se não forem otimizadas adequadamente.

Imagens grandes, pesadas e em um formato não adequado, podem aumentar o tempo de carregamento da página, consumir mais largura de banda, e prejudicar a experiência do usuário.

Por isso, é importante otimizar as imagens do seu site, para que elas sejam carregadas mais rápido, ocupem menos espaço, e se adaptem aos diferentes dispositivos dos visitantes.

Neste artigo, vamos lhe mostrar como otimizar as imagens do seu site, usando dicas e técnicas simples e eficazes. Você vai aprender a escolher o formato correto, reduzir e compactar o seu tamanho e converter para um formato adequado antes mesmo de subir para o seu site.

Ao aplicar essas dicas e técnicas, você vai melhorar (e muito) o desempenho do seu site, aumentar a satisfação dos seus leitores, e melhorar o seu ranqueamento nos mecanismos de busca, como o Google e o Bing, por exemplo. Vamos lá?

Escolhendo o formato correto da imagem

O primeiro passo para otimizar as imagens do seu site é escolher o formato correto de imagem para cada tipo de conteúdo.

Existem vários formatos de imagem disponíveis na web, mas os mais comuns são JPEG, PNG, GIF, e WebP. O formato GIF é o pior de todos em termos de desempenho web e deve ser evitado a qualquer custo, já o Webp é o formato ideal e indicado, justamente, para sites e blogs.

Entretanto, ao invés de salvarmos nossos arquivos diretamente como Webp, caso o programa que usamos suporte, nós indicamos utilizar o formato JPEG inicialmente, para podermos fazer uma manobra interessante de compressão desse arquivo e otimizar ainda mais a velocidade de carregamento do seu site.

Essa compressão, pode reduzir em mais de 80% o tamanho do arquivo das imagens em muitos casos, sem perdas significativas de qualidade.

Veja os dados de um teste que fizemos com 2 imagens, uma JPEG e outra PNG, antes e depois da compressão, e compare os resultados em termos de tamanho e velocidade de carregamento:

Imagem originalImagem comprimidaRedução de tamanho
JPEG – 1920×1080 – 1.2 MBJPEG – 1920×1080 – 200 KB83%
PNG – 800×600 – 600 KBPNG – 800×600 – 100 KB83%

Como você pode ver, reduzir o tamanho das imagens pode fazer uma grande diferença no desempenho do seu site e, por isso, é recomendado que você sempre comprima as imagens.

Após realizada essa etapa, aí sim podemos converter nossa leve imagem para Webp, extraindo ao máximo da otimização. Explicamos passo a passo como fazer isso do começo ao fim a seguir, confira.

Como reduzir e otimizar o tamanho das suas imagens corretamente

O segundo passo para otimizar as imagens do seu site é reduzir o tamanho das imagens, sem comprometer a sua qualidade, para diminuir o tempo de carregamento do seu site.

Isso vai ajudar a aumentar a velocidade do seu site e da navegação nas páginas, economizar largura de banda, e melhorar a experiência do usuário como um todo.

Confira como fazer isso passo a passo:

Passo 1: Salve sua imagem em JPEG (preferencialmente) ou PNG

Como mencionamos anteriormente nesse artigo, o primeiro passo para otimizar as imagens do seu site é salvá-las em JPEG ou PNG, inicialmente. Evite outros formatos, como GIF, e evite também imagens com dimensões exageradas, por exemplo 2160×3840.

Entre JPEG e PNG, recomendamos optar sempre por JPEG, a menos que você necessite de transparências e altíssimas resoluções nessas imagens, o que é a grande minoria dos casos. O formato JPEG é um formato mais leve que o PNG.

Passo 2: Faça a compressão da sua imagem e baixe a versão comprimida

Após ter salvo sua imagem em JPEG é hora de comprimi-la para reduzir ainda mais o tamanho do seu arquivo, sem perda de qualidade, e impactar o mínimo possível o carregamento do seu site.

Existem muitas ferramentas online gratuitas que você pode utilizar para essa tarefa, bastando arrastar e soltar o arquivo desejado para compressão.

Uma que nós usamos e tem nos atendido bem até agora é a Compressjpeg.com, que apesar do nome comprime diversos formatos de arquivos como JPEG, PNG, GIF e até PDF.

Para utilizá-la é bem simples, não precisa nem de cadastro, basta arrastar o arquivo que você deseja comprimir até a área selecionada no site, aguardar a com pressão, que é bem rápida, e fazer o download do novo arquivo mais leve.

Passo 3: Converta a imagem comprimida para um formato de última geração

Agora que o seu arquivo já está bem leve, é hora de finalmente convertê-lo em um formato otimizado para sites e dispositivos móveis. O formato que nós indicamos para esse caso é o Webp.

Assim como na etapa anterior, também existem diversas ferramentas gratuitas online que você consegue realizar a conversão de JPEG para Webp ou PNG para Webp.

Um site que utilizamos bastante é o Convertio.co e também tem nos atendido bem, apesar de ter um limite diário (bem generoso, por sinal) de conversões. Essa ferramenta é bem simples e funciona da mesma maneira que no passo anterior, bastando arrastar o arquivo desejado até a área selecionada no site e aguardar para fazer o download.

Pronto! Após agora é só baixar a sua imagem otimizado em webp e inserir no seu site, com toda a garantia que ela é leve e corresponde aos formatos adequados exigidos para uma boa performance e velocidade de carregamento.

Ao aplicar essas dicas, você verá que vai melhorar bastante o desempenho do seu site, aumentar a satisfação dos leitores e o seu ranqueamento nos mecanismos de busca.

Esperamos que este artigo tenha sido útil para você. Se você gostou deste artigo, compartilhe com quem também possa gostar ou deixe sua mensagem abaixo.

Deixe um comentário