Como Otimizar as imagens do seu site para ele carregar mais rápido

Se você está iniciando agora no mundo digital e ainda não sabe os paranauês de como otimizar as imagens do seu site e outras coisinhas também para ele carregar mais rápido, aqui vão algumas dicas simples que vão facilitar sua vida.

Muitos são os fatores que influenciam na velocidade de carregamento de um site: servidor, plugins instalados, recursos utilizados, entre outros. Desses, um bem relevante são as imagens utilizadas em cada página: quanto mais imagens, mais “arquivos”para serem carregados, portanto, mais tempo de carregamento para o site. Como isso é um ponto fácil para você otimizar, fizemos um guia rápido para facilitar sua vida na hora de escolher as imagens que vai utilizar no seu site:

Formato da Imagem

Png

Imagens no formato png normalmente tem excelente qualidade, no entanto, normalmente são mais pesadas (em tamanho) do que as JPG, pois internamente, utiliza um tipo de compressão que é mais focado na QUALIDADE DA IMAGEM do que no TAMANHO.
Nós recomendamos usar imagens em PNG quando há a necessidade de fundo transparente.

Jpeg

JPEG (ou JPG) é um dos formatos mais utilizados para imagens na internet. Isso acontece por um fator muito importante: o “tamanho” (peso) das imagens é menor.
Ele é o formato recomendado para imagens que não precisam de fundo com transparência. 

Tamanho (Peso) da Imagem

Quanto mais pesada for a sua imagem, mais tempo vai levar para ser carregada no seu site. De forma bem “simplificada”, nós recomendamos que evite subir imagens com mais de 200kb no seu site, dessa forma ele vai carregar MUITO mais rápido, e aquele usuário que está utilizando o 3G do celular vai conseguir consumir seu conteúdo.

Dimensão (Largura x Altura)

Tão importante quanto você usar uma imagem no formato correto é  você usar uma imagem com as dimensões ideais para o seu uso. Imagens grandes demais exigem mais tempo para serem carregadas.
O ideal é você subir as imagens de acordo com o formato necessário. Um Exemplo: normalmente uma imagem para banner (que fica numa tela cheia) tem o tamanho de 1920px x 1080px. Mesmo que você suba com uma resolução muuuuuuuuito maior, ela não vai ser aproveitada, porque será acessada, na maioria das vezes, por dispositivos com uma resolução menor, aí, acaba sobrecarregando o carregamento do site sem necessidade.

Ferramentas para te auxiliar com as imagens

Canva

O Canva é uma ferramenta web que te ajudar a criar imagens nas dimensões ideais para seu uso, além de oferecer recursos gráficos muito legais para fazer imagens lindas. É muito fácil de usar e tem muitos formatos disponíveis para download (PNG, JPG, etc).

No Canva, você tanto pode pegar imagens já baseadas em templates prontos (capa para facebook, youtube, imagem para facebook ads,e tc), quanto usar um layout customizado. Para layouts customizados, basta você criar um novo design e informar as dimensões que deseja aí pronto: ele já traz um novo projeto com as dimensões ideias para você.

Image smaller

Se a imagem que você quer subir está mais pesada do que 200kb, o Image Smaller te ajuda a comprimir esse arquivo e diminuir o tamanho para você usar no seu site.

I Love Img

O ILoveImg é uma outra ferramenta de compressão de imagens, como o Image Smaller. Ela permite comprimir imagens, redimensionar, cortar, etc. Vale a pena conhecer 🙂

Sempre recomendamos passar QUALQUER imagem nessa ferramentas de compressão antes de subir para o site, pois muitas vezes, até imagens menores podem ser reduzidas.

Fez a imagem no Canva? Baixa ela no formato desejado, passa no image smaller e só depois disso faz o upload pro site. Seguindo esses passos, com certeza, você vai ter resultados muito legais no carregamento do seu site.

E aí, o que você achou dessas dicas de como otimizar as imagens do seu site? Deixa um comentário pra gente contando se já utilizou, se usa alguma outra ferramenta para te ajudar com esse trabalho, etc.

Um beijo!