Como otimizar imagens no WordPress?

As imagens são uma parte importante de qualquer site. Eles podem ser usados ​​para criar um clima, mostrar produtos ou adicionar interesse visual a uma página. Mas, às vezes, você pode não ter as melhores imagens para seu site que o fariam ter a melhor aparência.

Felizmente, o WordPress possui alguns recursos integrados que ajudarão a otimizar as imagens para que carreguem mais rápido e ocupem menos espaço em seu site, sem comprometer a qualidade!

Encontre imagens não otimizadas em GTmetrix + PSI

A melhor maneira de encontrar imagens que precisam ser otimizadas em seu site é usando uma ferramenta online gratuita, como GTmetrix ou PSI. Ambas as ferramentas rastreiam os arquivos do seu site e fornecem um relatório fácil de entender sobre o que precisa ser otimizado para carregar mais rápido.

Otimize imagens usando plug-ins + serviços do WordPress

Existem também alguns plug-ins de otimização de imagens do WordPress (pagos e gratuitos), como o EWWW Image Optimizer, que funciona muito bem na compactação de imagens para carregar mais rápido em seu site.

Existem também serviços que farão isso por você, como o TinyPNG e o Kraken Image Optimizer, que compactam imagens sem afetar a qualidade em nada.

Use o tamanho correto da imagem

Assim como você precisa redimensionar seus gráficos, vídeos e outras mídias para a largura do blog no editor do WordPress antes de carregá-lo, você também precisa se certificar de que os arquivos de imagem também sejam redimensionados. Isso garante que nenhuma de suas imagens ocupará mais espaço do que deveriam!

Imagens de cache

Outra forma de otimizar imagens é armazenando-as em cache. Isso garante que o seu site carregue mais rápido, mesmo se várias pessoas o visitarem ao mesmo tempo, já que os visitantes que acessam uma página com imagens em cache não terão que esperar o download dos arquivos antes de poderem ver qualquer coisa!

O plugin WP Smush faz isso automaticamente assim que você o instala e ativa (e você definitivamente deve fazer as duas coisas!). Você também pode usar plug-ins, como Autoptimize ou Wp Super Cache, que não apenas armazena em cache, mas também minimiza o código.

Use LazyLoad para adiar imagens fora da tela

LazyLoad é um recurso mais recente e menos conhecido do WordPress que permite adiar o carregamento de imagens até que o usuário role para a posição deles no seu site. Quando o fizerem, essas imagens serão carregadas rapidamente porque não foram carregadas quando a página foi buscada pela primeira vez!

Usar compressão de imagem

Você pode usar dois tipos diferentes de compactação de imagem: LZW ou JPEG. A diferença entre eles tem mais a ver com o tipo de arquivo gráfico que está indo do que com qualquer outra coisa, então escolha o que for mais adequado para sua situação!

Isso funciona reduzindo o número de cores usadas em uma imagem, o que significa que menos dados precisam ser transferidos do servidor para o cliente durante a navegação. Isso reduz o uso da largura de banda e também o tempo de carregamento.

A compactação de imagens é uma parte fundamental de qualquer site, e o WordPress possui vários plug-ins de compactação que tornarão mais fácil a criação de sites com imagens de alta qualidade sem comprometer o desempenho!

Veicule imagens em formatos de última geração

É importante perceber que existem muitos formatos de imagem diferentes e nem todos funcionarão bem para o seu site. Se você deseja melhorar o desempenho de qualquer site da Web, é necessário usar formatos de última geração, como WebP ou JPEG XR, que normalmente têm melhor compactação do que outros tipos.

Especifique as dimensões da imagem

Ao especificar as dimensões das imagens, você está dizendo ao WordPress quanto espaço usar ao colocá-las em seu site. Isso é importante porque reduz a pressão sobre a largura de banda, o que significa um tempo de carregamento de página mais rápido!

Veicular imagens de um CDN

Um CDN é uma maneira rápida e eficiente de veicular as imagens do seu site a partir de servidores geograficamente mais próximos. Isso reduz a latência, o que significa tempos de carregamento mais rápidos para os usuários!

Combine imagens usando CSS Sprites

CSS Sprites são um tipo de imagem que realmente combina todas as suas imagens menores em um grande arquivo. Isso é útil porque reduz o número de solicitações de arquivos, o que significa um tempo de carregamento mais rápido - especialmente em dispositivos móveis! Você pode usar um gerador de sprites CSS para criar um e adicioná-lo ao seu tema com CSS.

Use imagens adaptáveis ​​para celular

As imagens adaptáveis ​​são uma ótima maneira de atender a diferentes tamanhos de imagem para usuários em diferentes dispositivos. Isso reduz o uso da largura de banda e os tempos de carregamento! Você pode fazer isso com um plugin do WordPress, mas também há muitas outras maneiras de fazer isso gratuitamente por conta própria.

Desativar link de imagem

Quando você faz um hotlink de uma imagem, basicamente o que está fazendo é um link para o arquivo original no servidor de outra pessoa. Desativar isso impede que as pessoas roubem sua largura de banda, então é algo que você vai querer fazer.

Você pode fazer isso com muitos plug-ins do WordPress, como o WP Rocket. Normalmente, você também pode pedir ao seu anfitrião para fazer isso por você (se você estiver com um bom anfitrião).

Remover dados EXIF

Os dados EXIF ​​são informações ocultas que você não pode ver no editor do WordPress, mas que podem ser vistas por outras pessoas. Ele contém informações como a marca e o modelo de uma câmera, bem como suas configurações de data e hora. Remover isso reduzirá o uso de largura de banda!

Este processo envolve o uso de uma ferramenta de depuração de imagens, como JPEGsnoop ou jhead, que permite remover todos os dados EXIF ​​das imagens do seu site - sem ter que baixá-los primeiro!

Veicular imagens de qualidade inferior para usuários em conexões lentas

Isso é algo que você pode fazer com suas imagens, mas nem todo tema terá a opção de ocultar isso. Basicamente, o que ele faz é exibir imagens de baixa qualidade para pessoas em conexões lentas (móveis ou outros). Você pode fazer isso com o plugin Optimole.

Por que é importante usar imagens otimizadas?

As imagens podem ser uma grande parte do desempenho do seu site, por isso é importante otimizá-las! Isso garantirá que as imagens sejam carregadas da maneira mais rápida e eficiente possível.

Quanto mais rápido o seu site carregar, melhor será para os usuários e os mecanismos de pesquisa! O tempo de carregamento recentemente recebeu mais peso nas classificações do Google (mas apenas um pouco), mas mesmo que isso não fosse verdade, você ainda quer ter certeza de que tudo foi carregado o mais rápido possível.

As pessoas odeiam esperar em sites, especialmente usuários móveis - o que torna a otimização de imagens uma parte essencial de qualquer site WordPress. Também ajuda com o SEO porque o Google também gosta de sites de carregamento rápido (por um bom motivo).

Conclusão

Concluindo, as imagens são uma parte importante de qualquer website. Eles podem ser usados ​​para criar um clima, mostrar produtos ou adicionar interesse visual a uma página.

No entanto, às vezes as imagens originais podem não estar otimizadas o suficiente e podem ocupar mais espaço do que o necessário. O WordPress tem vários recursos para otimizar esses arquivos para que carreguem mais rápido sem comprometer a qualidade! A melhor maneira é instalar um plugin de compactação de imagem, como LazyLoad ou PSI, que irá compactar e redimensionar automaticamente suas imagens, se necessário. Você também pode otimizar imagens especificando suas dimensões, usando CSS sprites, usando o cache de imagens e