Como otimizar imagens para WordPress

Publicados: 2019-11-12

Suas imagens devem ser positivas e não prejudiciais à configuração do seu site. Eles devem ajudá-lo a atingir as metas que você definiu para seu site.

Um site lento é o pesadelo de todos. Como proprietário de um site, você deve saber que as imagens em seus formatos brutos são más notícias para a velocidade do seu site. A velocidade lenta do site compromete seus rankings de SEO e custa seu público. Além da velocidade, suas imagens também devem estar bem posicionadas para ajudá-lo a obter e manter o maior número possível de usuários.

Neste artigo, vamos guiá-lo pelas várias maneiras de otimizar imagens para o WordPress. A otimização de imagens não é possível em uma única ação. É uma combinação de várias medidas que tornam seu site tão impressionante quanto você deseja. Permita-nos levá-lo através dessas ações simples.

Selecione o formato de imagem correto

selecione o formato de imagem correto

Se suas imagens são multicoloridas e têm alto contraste, JPEG é o melhor formato para ver a diferença. Você pode compactar fotografias nesse formato para reduzir o tamanho do arquivo, mas isso compromete a qualidade até certo ponto. Por outro lado, se suas imagens são menos sofisticadas em termos de cores, o PNG é sua melhor opção. PNG tem vantagem sobre JPEG com suporte para transparência em imagens. No entanto, compactar fotos PNG resulta em fotos de melhor qualidade, mas com tamanhos de arquivo maiores.

À medida que você edita imagens em seu computador, você precisará selecionar o tipo de arquivo no qual deseja salvar suas imagens. Os formatos mais comuns para imagens são JPEG e PNG.

Takeaway: para várias fotos coloridas, escolha e compacte JPEG. Para fotos mais simples e transparentes, vá para PNG.

Redimensione suas imagens

Reduzir as dimensões de suas imagens – independentemente do formato – reduz o tamanho dos arquivos. Quanto menor você faz uma imagem, mais ela diminui de tamanho. No entanto, não se empolgue e exagere: considere a largura do seu site e certifique-se de que a largura da sua imagem seja menor. Se você tornar as novas fotos muito pequenas, o conteúdo delas poderá ficar menos visível.

É possível fazer upload de imagens que excedam o tamanho do seu site em largura, que seu site exibirá em miniaturas. Mas isso não tira o fato de que você tem uma imagem grande em seu site que deixa seu site mais lento. Você pode reduzir o tamanho do arquivo em mais da metade redimensionando.

Se você não redimensionou sua imagem antes de fazer o upload, você pode selecionar fotos específicas em sua biblioteca de mídia do WordPress, escolher editar e redimensioná-las.

imagem em escala

Cortar imagens

A diferença entre redimensionar e cortar é que o redimensionamento retém todos os elementos da imagem original. Por outro lado, o corte corta algumas das bordas da imagem original.

Redimensionar imagens significa que alguns de seus elementos se tornarão minúsculos e pouco visíveis em qualquer tamanho de tela. O corte ajuda você, especialmente quando você tem um ponto focal para sua imagem. Você pode cortar as partes desnecessárias de uma imagem, tornar um arquivo menor e, ao mesmo tempo, tornar os elementos de interesse mais visíveis.

Como compactar imagens

Depois de redimensionar e recortar suas imagens, você pode ir além compactando as imagens. Você pode compactar imagens JPEG em um processo chamado compactação com perdas. Nesse processo, você perde alguns dados da imagem original para criar um arquivo de imagem menor.

Aqui, você terá que selecionar entre o tamanho e a qualidade da imagem. Reduzir o tamanho é o objetivo final, mas tem o preço da qualidade. Portanto, você deve reduzir o tamanho o máximo possível sem comprometer a funcionalidade desejada para a imagem. No entanto, a qualidade da imagem não cai muito com a compressão. Você só precisa verificar o índice de qualidade e decidir se gosta.

O processo de compactação é possível com ferramentas de compactação de imagem disponíveis online. TinyPNG é a única ferramenta de compactação de imagem que possui mais de 1 bilhão de imagens otimizadas em PNG e JPEG. Ele apresenta a maneira perfeita de otimizar suas imagens antes de enviá-las para o seu site.

Como o TinyPNG funciona com PNG?

Para arquivos PNG, o TinyPNG usa compactação com perdas inteligente para reduzir o tamanho do arquivo. Mesmo que isso signifique uma redução seletiva das cores da imagem, é totalmente imperceptível a olho nu, e o tamanho do arquivo diminui drasticamente.

As imagens PNG regulares não compactadas contêm combinações de cores de 24 bits. Após a compactação usando o TinyPNG, você os converte em imagens coloridas de 8 bits cada vez menores. Esse processo, também conhecido como quantização, também envolve a remoção de metadados desnecessários. Com o TinyPNG, você reduz o tamanho do arquivo em mais de 70% e torna suas imagens totalmente compatíveis com transparência.

Quão bem ele funciona com navegadores modernos?

Outro aspecto que torna o TinyPNG único é o suporte para todos os navegadores modernos. Apesar da recusa do Internet Explorer 6 em reconhecer a transparência do PNG, o TinyPNG oferece um plano de fundo transparente no navegador. Se o seu navegador for compatível com PNGs animados (Chrome, Firefox e Safari), sinta-se à vontade para experimentá-los.

Compressão JPEG

Se você deseja compactação JPEG, não procure mais. TinyPNG foi inicialmente construído para suportar compressão de imagem JPEG inteligente e faz um excelente trabalho.

Se você ficou frustrado com o carregamento lento do seu site, use o TinyPNG antes de enviar imagens para o seu site e experimente a enorme diferença. Isso economizará largura de banda e fará com que seu site carregue mais rápido compactando todas as suas imagens JPEG e PNG.

Servir imagens de uma CDN

Os usuários que estão longe do servidor do seu site podem experimentar velocidades de carregamento mais lentas. Para cuidar disso, você pode instalar um CDN. Uma CDN permite que os visitantes se conectem através do servidor mais próximo a eles. Depois de ter um URL de CDN, copie-o no plug-in de cache que você usa. Substitua os URLs das imagens para que incluam o URL do seu CDN. Dessa forma, suas imagens também serão veiculadas para seus visitantes .através do mesmo critério de CDN.

Usar carregamento lento

A natureza do WordPress é carregar tudo em uma página ao mesmo tempo – no momento em que você solicita a página. Como as imagens carregam mais devagar que o texto, elas são obrigadas a desacelerar o carregamento de suas páginas.

O carregamento lento garante que as imagens que estão abaixo da interface do visualizador não sejam carregadas assim que uma página começar a ser carregada. Em vez disso, as imagens no topo serão carregadas primeiro; em seguida, o restante será carregado à medida que o visitante rolar para baixo até eles. Dessa forma, suas páginas serão carregadas rapidamente, apesar das imagens que você tem nelas. Alguns plugins que facilitam o carregamento lento exibirão uma versão de imagem de baixa qualidade até que a versão real seja carregada.

Armazene suas imagens em cache

Se você pretende ter um site rápido, deve experimentar os plugins de cache, se ainda não os experimentou. O armazenamento em cache de conteúdo em seu site e páginas implica a criação de versões dos mesmos para que estejam disponíveis imediatamente mediante solicitação. Um plug-in de cache estelar oferece a opção de armazenar em cache suas imagens por meio de “caching do navegador” – uma alternativa facilmente acessível.

Nomeie seus arquivos de imagem adequadamente

Ao fazer o upload de suas imagens, certifique-se de nomeá-las. Ao fazer isso, você pode descobrir que seu plug-in adiciona automaticamente texto alternativo a eles. Essa situação é ideal, pois a melhor maneira de nomear suas imagens é através de uma descrição simples. Adicionar muitas palavras-chave não é bom para você. Palavras-chave lhe dão uma vantagem quando se trata de SEO. No entanto, quando você tem muitos deles em suas imagens, corre o risco de sofrer penalidades de preenchimento!

Otimize suas imagens para exibição em trechos do Google

Obter rich snippets nos resultados de pesquisa não é fácil. Você precisa ter algumas palavras-chave que dêem aos usuários respostas precisas e concisas. Crie uma imagem que descreva as palavras-chave que você está segmentando. Referências de qualidade do usuário para conteúdo factual para inspirar cliques. Se você achar que não aparece na primeira página da palavra-chave, edite para melhorar seu conteúdo.

Além disso, use plug-ins de dados estruturados (esquema) para melhorar suas chances de ter rich snippets.

Usar imagens originais

Evite usar imagens de outros sites. Eles atrasam você, pois envolvem solicitações adicionais para satisfazer o servidor do site do qual você emprestou a foto.

Resultado final

Essas são nossas instruções sobre como otimizar suas imagens para o WordPress. Como mencionamos, você não pode escolher um e correr com ele, esperando bons resultados. A otimização de imagem envolve um esforço unificado por várias estratégias. Certifique-se de entender as ideias, aplicá-las e prepare-se para surpreender não apenas seus visitantes, mas também a si mesmo.