Como otimizar imagens no WordPress

Imagens não otimizadas podem ocupar espaço desnecessário no disco do servidor ou diminuir a carga do seu site. Se você quer saber como otimizá-los, continue lendo!

Para resolver os problemas que o peso excessivo de nossas imagens pode causar, veremos dois dos melhores para otimizar suas fotos, usando plugins WordPress e ferramentas de edição on-line.

Antes de entrarmos na farinha com ele, vamos passar por cima dos conceitos essenciais para trabalhar com imagens online para que você entenda por que por trás do que vamos fazer aqui.

Todos esses “truques” para as imagens que veremos, no final, fazem parte da realização de um bom trabalho de SEO, na criação de sites a considerar.

Por que é tão importante otimizar as imagens em nosso site

Quando enviamos uma foto para o WordPress, a plataforma cria cópias dela, com dimensões diferentes. A ideia é que, dependendo do tamanho da imagem exibida na página, use a menor imagem em dimensões (e, portanto, mais leve) possível.

Foto por foto, cópia por cópia, todas essas imagens podem ocupar muito espaço no seu servidor web sem perceber.

Além disso, quando carregarmos a foto original, se ela for excessivamente “pesada” (que tem um grande tamanho de arquivo) irá diminuir o carregamento do nosso site, e, além disso, o Google entenderá que nossa página é “lenta”, e diminuirá o posicionamento da página.

Mas fique tranquilo, neste artigo vamos aprender como acessá-los e ver o quão grande eles são, o que ocupam no seu servidor e otimizá-los.

Melhora a velocidade de carregamento

Quando clicamos para navegar em um site, a página tem que carregar todo o seu conteúdo.

Portanto, quanto menos pesado, menor o tamanho e menos imagens temos, menos tempo leva para carregar.

Isso não é apenas essencial para melhorar a experiência do usuário (50% dos usuários foram encontrados esperando que ele carregue em menos de 2 segundos), mas porque quanto mais ágil nosso site for, mais o Google vai gostar.

Por sua vez, isso significa que você aparece mais alto ou menor nas pesquisas de usuários e, portanto, será mais visível para o mundo.

O que é carregamento preguiçoso e como a velocidade do nosso site aumenta?

O carregamento preguiçoso é uma técnica que permite, dependendo de como estamos navegando em um site, as imagens que ele contém são carregadas à medida que se tornam visíveis, e não de repente quando entramos na página.

Como já vimos, são esses tipos de arquivos que ocupam mais tamanho, e logicamente os que demoram mais e consomem quando carregados.

Portanto, se vídeos e imagens não são carregados até que não sejam necessários, é uma economia incrível para o nosso site.

Ao longo deste post veremos a forma como consideramos mais eficaz para conseguir carregamento preguiçoso em seu site.

Aumenta o espaço livre do disco onde a página está

Todo o conteúdo exibido em uma página web, ou parte de sua estrutura, deve ser armazenado em um site, que tem um certo espaço.

Em muitos casos, as imagens representam mais de 50% do peso total da página.

Se, por exemplo, tivermos um blog de viagens onde constantemente carregamos arquivos desse tipo, teremos mais risco de ocupar muito mais espaço. No entanto, se tivermos um blog que tenha muito texto e poucas imagens, o espaço ocupado será menor.

Além disso, devemos lembrar as cópias do WordPress de nossas imagens.

É essencial que revisemos aqueles que são realmente necessários.

Para se ter uma ideia, vamos dar o exemplo. Enviamos um post para o WordPress com 5 fotos. A plataforma vai carregar mais 4 cópias de cada uma de nossas fotos (já totalizando 20 fotos), das quais, estamos usando apenas 20%, mas que estão ocupando espaço.

Tanto em WordPress.com quanto no WordPress com planos de hospedagem (wordpress.org) geralmente têm certos limites de espaço, então a economia não é apenas espaço, é dinheiro.

Verifique a velocidade de um site com o Google PageSpeed Insights

Em relação ao acima, e como uma ferramenta para medir a velocidade de upload do nosso site, existe o Google PageSpeed Insights. Graças a esta página, poderemos revisar a rapidez com que nosso site carrega e identifica possíveis falhas.

Basta copiar o endereço da página que deseja analisar e copiá-la para sua barra de pesquisa. Isso nos devolve um estudo bastante detalhado do que pode estar atrasando a carga ou o que podemos melhorar.

Quando lhe damos para “analisar”, ele retorna uma análise geral deste site, juntamente com um estudo bastante detalhado sobre o que pode estar atrasando a carga e o que poderia ser melhorado.

Conceitos anteriores: peso, tamanho e dimensão das imagens

O peso do arquivo é a quantidade de memória ou espaço em disco que nosso arquivo ocupa ao armazená-lo. Ele é medido em bytes e depende do tamanho do pixel e da profundidade de cor (também em pixels) do arquivo.

Se uma foto for maior do que a ideal, ela diminuirá o processo de carregamento da página em que está. E os usuários não gostam disso (e o Google também não gosta).

Quanto ao tamanho ou tamanho da foto, um muito grande também vai desacelerar nosso site à medida que aumenta seu peso, e um tamanho muito pequeno diminuirá sua qualidade e não ficará bem nossa foto; além de não haver nada estético.

Formatação é a forma como nossa imagem é salva; e para cada tipo de imagem temos uma mais adequada que a outra.

Os mais usados hoje são PNG (recomendado para capturas de tela) e JPG (recomendado para fotografias).