Otimização de imagem WordPress: o guia definitivo

A otimização de imagens do WordPress envolve a redução ou compactação dos tamanhos dos arquivos das imagens em seu site WordPress sem impactar negativamente a forma como as imagens aparecem nas telas. Quando você se esforça para otimizar imagens no WordPress, aumenta a velocidade do seu site e da página, o que, em última análise, ajuda a capturar mais visitantes novos para o site.

Neste guia, damos uma olhada na otimização de imagens do WordPress, por que você deve otimizar imagens e técnicas de otimização de imagens. Também examinamos os plug-ins de otimização de imagem do WordPress, a resolução e o formato da imagem. Finalmente, vamos concluir como a otimização de imagens do WordPress afeta o SEO. Vamos lá!

Para entender a importância da otimização de imagem, pergunte-se uma questão simples: quando você vai para um novo site e a página não carrega rapidamente, o que você faz?

Se você é como muitas pessoas, provavelmente fecha e segue em frente, certo? No mínimo, você se sentirá impaciente e frustrado com o tempo que o site está demorando para carregar. Ou se você ficar, é apenas porque está realmente interessado naquele conteúdo específico. Você provavelmente nunca mais voltará a esse site depois de ler este artigo. O site é simplesmente muito lento.

O que essa experiência tem a ver com o motivo pelo qual você precisa otimizar imagens no WordPress? Os tempos de carregamento da página costumam ser bastante afetados pelos tamanhos das imagens. Portanto, a otimização de imagens do WordPress é muito importante quando se trata de melhorar a experiência do usuário e até mesmo seus rankings de SEO.

O que é otimização de imagens WordPress?

As imagens podem ser otimizadas de várias maneiras para um site WordPress, usando diferentes ferramentas e técnicas. Utilizar tamanhos de arquivo menores significa que você pode preencher seu site com ainda mais imagens sem sobrecarregá-lo ou torná-lo mais lento.

Otimizar todas as imagens do seu site WordPress deve estar no topo de sua lista de prioridades quando se trata de otimizar seu site WordPress em geral. O processo de otimização de imagem fará com que seu site pese muito menos e carregue mais rápido do que nunca, capturando mais novos usuários e fazendo-os voltar para mais conteúdo.

Afinal, não importa o quão bom seja o seu conteúdo, não importa se os usuários saem antes de consumi-lo.

Por que devo otimizar imagens no WordPress?

Existem quatro razões principais pelas quais você deve otimizar imagens no WordPress.

1. Acelere o tempo de carregamento da página
2. Melhorar o SEO (otimização do mecanismo de pesquisa)
3. Reduza as cargas do servidor
4. Reduza o tamanho geral do site para que exija menos recursos
5. Fique por dentro das tarefas importantes de manutenção do WordPress

Vamos dar uma olhada em alguns aspectos específicos dos tempos de carregamento da página no que diz respeito à otimização de imagens do WordPress.

Em 2020, um site que leva dez segundos ou mais para carregar simplesmente não vai prender a atenção do usuário. E embora não haja uma definição exata de uma velocidade de carregamento de página de destino ideal, estudos recentes de especialistas mostram que:

1. Os primeiros dez segundos têm um grande impacto sobre o tempo que os usuários permanecem nas páginas da web. Os leitores sairão da sua página ou postagem se todo o conteúdo não for exibido dentro desse curto período de tempo.
2. Em 79% dos casos, se um usuário não estiver satisfeito com a velocidade do site, ele nunca voltará a ele, porque a velocidade é um assassino.
3. Pior ainda, 47% dos usuários insatisfeitos não apenas rejeitarão seu site pessoalmente, mas desencorajarão outros usuários conversando com seus amigos sobre sua experiência. Eles também estão mais propensos a deixar comentários negativos nas redes sociais e no Google.

Todas essas estatísticas significam que é absolutamente crítico manter o tempo de carregamento da página do seu site bem abaixo de dez segundos. Na realidade, sua meta deve ser inferior a três segundos. E é aí que entra a otimização de imagens do WordPress.

Fatores que afetam as velocidades de carregamento da página do WordPress

Você deseja que seu site WordPress carregue mais rápido, mas não sabe exatamente por onde começar. O foco principal hoje é a otimização da imagem, da qual você terá um entendimento completo no final deste artigo.

Mas como parte de um esforço maior de otimização do WordPress, é importante entender todos os fatores que afetam a velocidade do seu site.

Para um site ultrarrápido, é importante:

1. Use imagens leves

O uso de imagens “leves” é realizado por meio da otimização de imagens. O objetivo é comprimir as imagens ao máximo sem perder a qualidade. Esse processo é conhecido como compactação sem perdas (falaremos mais sobre isso posteriormente) e requer o uso de um otimizador de imagem.

2. Otimize o cache do seu site

O cache do WordPress ajuda o seu site a carregar mais rapidamente, reduzindo a quantidade de transferência de dados entre o navegador do visitante do site, o banco de dados do WordPress do seu site e o servidor da web do seu site. Um plugin de cache do WordPress que manterá e limpará o cache do seu site quando necessário, tanto manual quanto automaticamente.

3. Use um host WordPress de qualidade

Proprietários sérios de sites WordPress não administram seus sites com um plano de hospedagem de $ 4 / mês por um motivo. Embora possam funcionar bem para indivíduos que executam blogs pessoais que usam poucos recursos (e não recebem muito tráfego), eles não funcionam bem para proprietários de sites que têm uma carga maior e exigem velocidades de site mais rápidas.

Passe algum tempo encontrando um provedor de hospedagem gerenciada de qualidade que tenha data centers espalhados por várias regiões. Além disso, compare os tempos de resposta no nível do servidor ao comprar um host. Esses fatores definitivamente afetarão a rapidez com que seu site carrega para os usuários.

4. Otimize o código

O código que alimenta seu site também precisa ser otimizado para acelerar o tempo de carregamento da página. Otimizar o código em seu site WordPress, em geral, significa:

• Usando plug-ins e temas de qualidade
• Manter seus temas e plug-ins atualizados para a versão mais recente
• Não usar plug-ins que se sobrepõem em funcionalidade ou recursos
• Desinstalar / excluir quaisquer plug-ins ou temas não utilizados.

Os desenvolvedores precisam reduzir o código da seguinte forma:

• Removendo formatação e comentários
• Livrar-se de espaços extras
• Remover vírgulas e código que não está sendo usado

É importante minimizar o código em todos os seus recursos, incluindo HTML, JavaScript e CSS. Para minimizar seu HTML, uma ferramenta poderosa é HTMLMinifier. Para JavaScript, experimente o UglifyJS. O Closure Compiler também vale a pena dar uma olhada. Quando se trata de CSS, CSSNano é uma boa escolha.

5. Reduzir os redirecionamentos

Há momentos em que é necessário configurar redirecionamentos para evitar esses erros 404 desagradáveis. Mas, se possível, sempre evite o que é chamado de "redirecionamentos de uso múltiplo".

Isso significa que seus redirecionamentos vão de, por exemplo, example.com> example.com/subdomain> example.com/subdomain/redirect.html. Seria muito difícil para a página de destino carregar em três segundos ou menos com esses vários redirecionamentos em execução.

Um redirecionamento está certo. Mais de um normalmente não é.

Agora que você compreende os fatores adicionais que afetam a velocidade do seu site, vamos nos concentrar em otimizar as imagens do WordPress.

No final do dia, a otimização de imagens do WordPress é um processo que você deseja implementar, independentemente de administrar um site de pequena empresa ou gerenciar vários sites do WordPress para vários clientes.

O WordPress compacta imagens automaticamente?

Sim e não. Com o lançamento do WordPress 5.3, o núcleo do WordPress introduziu suporte aprimorado para upload de imagens de alta resolução. Isso inclui imagens que você tirou com uma câmera de alta qualidade ou seu smartphone.

• O recurso de compactação de imagem introduzido no WordPress 5.3 detecta quando uma imagem grande é carregada e, em seguida, gera automaticamente versões da imagem otimizadas para a web.
• Após o upload, as imagens são redimensionadas automaticamente para 2560 pixels, o novo tamanho total no WordPress.
• Quando uma imagem que você carrega é redimensionada, a palavra “dimensionada” é adicionada ao nome do seu arquivo.
• Se o redimensionamento automático da imagem falhar devido a um tempo limite no servidor, o WordPress tentará continuamente até que a imagem otimizada seja produzida.

Essa atualização do núcleo do WordPress foi importante para desenvolvedores que podem não ter percebido o quanto seus grandes arquivos de imagem estavam deixando seus sites mais lentos. No entanto, a otimização de imagem embutida fornecida pelo WordPress não é uma grande solução geral e não é feita sob medida para cada desenvolvedor WordPress individualmente. É um bom primeiro passo, mas para maximizar totalmente a otimização da imagem, você precisa ir mais longe.

Como faço para otimizar imagens no WordPress?

Otimizar totalmente suas imagens no WordPress não é um empreendimento muito complicado.

Existem três maneiras principais de otimizar imagens para seu site WordPress:

1. Plug-ins de otimização de imagem do WordPress que permitem que você faça o trabalho diretamente do painel de administração do WordPress.
2. Software / aplicativo otimizador de imagens pré-upload - Esses aplicativos podem ser softwares de código aberto como um otimizador de imagens ou, no mínimo, um editor de fotos, ou aplicativos pagos que fornecem recursos de ajuste do tamanho da imagem. O Photoshop é um exemplo de aplicativo de software premium que permite ajustar a resolução da imagem para compactar imagens para uso na web.
3. Serviços online gratuitos que compactam e otimizam suas imagens antes de enviá-las para o WordPress.

Usando um Pre-Upload Image Optimizer

Geralmente, otimizar uma imagem significa compactá- la. Um otimizador de imagem, ou compressor, é um programa de software que você instala em seu dispositivo pessoal ou acessa online por meio de seu navegador da web.

Para usar um otimizador de imagem, você simplesmente carrega uma imagem e permite que o programa faça pequenas alterações nos pixels. Essas cargas não podem ser detectadas a olho nu, e é por isso que o processo às vezes é chamado de compressão sem perdas.

O mesmo tipo de técnica é aplicado quando você compacta um arquivo de áudio em MP3. Nesse processo, as altas frequências são reduzidas estrategicamente de forma que o ouvido não consegue detectar nenhuma alteração.

Opções da ferramenta de otimização de imagem de pré-upload

Você tem algumas opções de ferramentas que compactam e otimizam suas imagens antes de enviá-las para o WordPress.

1. Um editor de fotos da área de trabalho

Se você é um usuário regular do Photoshop, provavelmente não precisa compactar ainda mais suas imagens. Isso ocorre porque você pode exportar suas imagens recém-criadas em qualquer resolução que desejar.

O mesmo princípio se aplica à maioria dos outros editores de fotos de desktop. Mas, na realidade, se você ainda não está usando o Photoshop para criar as imagens para o seu site, provavelmente não vai perder tempo aprendendo um programa tão complicado com o único propósito de compactar imagens.

No entanto, editores de fotos de desktop como o Photoshop são uma opção independente para compactar e otimizar imagens.

2. Aplicativos móveis e editores de fotos online

Aplicativos de edição de fotos e editores de fotos online (como Fotor e Pixlr) são feitos para fazer a edição básica de fotos. Muitas dessas ferramentas também incluem opções para otimizar suas imagens antes de carregá-las no WordPress.

No entanto, assim como usar o Photoshop para fazer esse trabalho, usar esses tipos de ferramentas quase parece um exagero. Algumas dessas soluções têm um preço e você não pode usar a maioria de seus outros recursos.

3. Compressores de imagem baseados na web

Se você deseja otimizar suas imagens antes de enviá-las para o WordPress, um software dedicado baseado na web é provavelmente a sua melhor solução.

Basta pesquisar no Google o termo “compressor de imagens online” e escolher o gratuito com o nome mais interessante. A maioria deles funciona exatamente da mesma maneira.

Depois de escolher a que deseja, tudo o que você precisa fazer é enviar sua imagem e selecionar o tipo de compactação que deseja aplicar.

Além disso, muitos serviços baseados na web oferecem opções de otimização em massa que funcionam muito bem se você precisar otimizar um grande número de arquivos.

Plug-ins de otimização de imagem do WordPress

Se você gostaria de um otimizador de imagem WordPress que funcione diretamente no seu sistema de gerenciamento de conteúdo WordPress, um plugin de otimização de imagem é o caminho a percorrer.

Com um plug-in otimizador de imagem do WordPress, tudo o que você faz é enviar sua imagem para o WordPress e o plug-in irá compactá-la automaticamente para as configurações predefinidas. Você também pode compactar e otimizar cada imagem manualmente, se preferir.

No repositório de plug-ins do WordPress, você encontrará dezenas de plug-ins para otimizar imagens. Algumas das melhores opções de plug-ins de otimização de imagem do WordPress são:

Escolha aquele que é mais fácil para você trabalhar e personalizar de acordo com as suas necessidades.

Nota: Recomendamos apenas o uso de UM desses plug-ins de otimização de imagens do WordPress. Como mencionamos antes, é melhor não duplicar em plug-ins com funcionalidade semelhante.

Qual é a melhor resolução de imagem?

Em geral, um bom alvo para resolução de imagem baseada na web é 72 PPI. No entanto, não existe uma “resolução de imagem perfeita” universal bem reconhecida para sites. Basicamente, se a imagem compactada não aparecer pixelada ou distorcida em seu site após o upload, a resolução da imagem é perfeitamente ideal para uso em seu site.

Ao contrário da indústria de impressão, onde a resolução de imagem exigida é de 300 DPI (pontos por polegada) para qualquer coisa a ser impressa, você precisará verificar a aparência de uma imagem carregada em um grande monitor de computador antes de prosseguir.

E a relação entre tamanho e peso?

As cores desempenham um papel importante em quanto uma imagem "pesa". Uma foto simples em preto e branco com tamanho de 1000 × 800 pixels com poucos elementos pode pesar cerca de 100 KB. No entanto, uma foto com exatamente o mesmo tamanho de pixel, com altos contrastes e cores vivas, às vezes pesará mais de oito vezes esse valor.

O host do seu site pode limitar seu peso máximo e limitar os tamanhos de arquivo que você tem permissão para enviar. Mas a proporção tamanho-peso sempre dependerá da estrutura da imagem.

Dito isso, não existe uma proporção ideal de tamanho-peso para imagens WordPress. Basta fazer o seu melhor para mantê-los o mais baixo possível, sem sacrificar a qualidade visual.

Qual formato de imagem é melhor para sites WordPress?

A documentação oficial do WordPress sobre o tamanho e a qualidade da imagem recomenda que você use arquivos JPEG ou PNG em sites com tecnologia WordPress. Como tal, estes são de longe os formatos de imagem mais comuns publicados em todos os sites WordPress.

Dependendo do conteúdo específico que você está postando, os arquivos JPEG e PNG funcionarão de maneira um pouco diferente.

Arquivos JPEG (ou .jpg) são perfeitos para todas as coisas raster (imagens compostas de pixels em vez de linhas). As fotografias em particular quase sempre são salvas como arquivos JPEG.

Quando você salva uma foto como JPEG, normalmente ela é compactada em uma determinada porcentagem automaticamente. Os principais editores de fotos permitem que você controle exatamente quantos detalhes são removidos pelo processo de compactação.

É sempre melhor selecionar a quantidade mínima absoluta de compactação aqui e, em seguida, compactar a imagem mais tarde com um dos otimizadores de imagem que já discutimos. Isso ajuda a evitar a distorção da imagem.

Os arquivos PNG são para arte de linha e fotografias. Quando você salva uma imagem como PNG, ela é compactada sem perder nenhum detalhe. No entanto, os arquivos PNG são geralmente muito maiores do que JPEGs. Este formato de arquivo é melhor usado para arquivos vetoriais. Eles não serão distorcidos, independentemente do tamanho.

O WordPress também oferece suporte a imagens no formato GIF. No entanto, esse não é um formato que recomendamos usar porque causa o máximo de distorção, não importa o quão cuidadosamente você converteu o arquivo.

Os sites WordPress se beneficiam da otimização de imagens?

A resposta fácil a essa pergunta é um sonoro sim. Por exemplo, seu site apresenta seu logotipo proprietário no topo de cada página e postagens em seu site? Você pode não acreditar como esse arquivo de imagem pode ser pesado, ou o quanto isso pode diminuir o desempenho do seu site. Experimente otimizá-lo e verificar a diferença que isso faz na velocidade e no desempenho do site.

Você faz upload de novas imagens para o seu blog quase todos os dias? Atualmente, você gerencia uma loja de comércio eletrônico com centenas de imagens de produtos? Em caso afirmativo, não se esqueça de instalar um plugin no WordPress que irá otimizar automaticamente as novas imagens que você enviar, bem como as imagens já apresentadas em seu site.

A verdade é que realmente não importa em que categoria seu site se encaixa. Se possível, comece a pensar em otimizar sua velocidade enquanto ainda está projetando o site. Não espere até que esteja pronto para lançar.

Se o seu site já foi lançado, use um dos plug-ins simples mencionados acima para otimizar em massa todas as imagens em seu site.

Otimização de imagem e SEO

Embora seja verdade que otimizar suas imagens não é a única resposta para aperfeiçoar as regras de SEO em constante mudança, a velocidade do seu site continua sendo um fator determinante importante. É por isso que a otimização de imagens do WordPress é tão importante para sua estratégia de SEO.

O tamanho de suas imagens pode afetar negativamente os resultados de pesquisa do seu site de duas maneiras.

Taxa de rejeição

Já discutimos como o uso de arquivos de imagem grandes tornará seu site mais lento. Mas você sabia que os principais mecanismos de pesquisa como o Google realmente medem os tempos médios de carregamento da página e classificam os sites de carregamento mais rápido com os melhores resultados de pesquisa?

Os mecanismos de pesquisa também medem as taxas de rejeição (quando um usuário acessa seu site, mas sai sem visitar uma segunda página ou postagem) de cada site que rastreia. Um dos principais fatores determinantes de uma alta taxa de rejeição é a baixa velocidade do site.

Como você pode ver, as altas taxas de rejeição farão seu site despencar para o fundo dos resultados de pesquisas. Taxas de rejeição mais baixas, no entanto, irão colocá-lo no topo da lista.

Velocidades de site mais rápidas quase sempre equivalem a taxas de rejeição mais baixas.

Priorização de página

Em várias ocasiões, o Google afirmou que a velocidade da página é um fator muito importante para classificar sites e priorizações de página. As imagens, em média, ocupam mais de 60% do espaço de armazenamento de todo o seu site.

Se você não estiver otimizando imagens, esse número pode ser substancialmente maior.

Novamente, isso significa um site mais lento e um fator de classificação mais baixo no Google.

E isso não é bom para os negócios.

Otimização de metadados para imagens

Pense em metadados como informações que fornecem mais informações sobre outras informações.

Para imagens, metadados são as informações de texto sobre as quais você escreve e salva em seu arquivo de imagem. Essas informações são visíveis para o Google e outros mecanismos de pesquisa.

Como um desenvolvedor WordPress, tudo que você precisa fazer para otimizar os metadados em uma imagem é preencher o pequeno formulário ao enviar a imagem para sua biblioteca de mídia.

As áreas para as quais você precisará inserir dados são:

• texto alternativo
• Título
• Rubrica
• Lesma

Ao aplicar o texto mais amigável ao mecanismo de pesquisa nesses campos, suas imagens terão muito mais probabilidade de aparecer em uma pesquisa de imagens do Google.

Uma classificação mais elevada nas pesquisas de imagens do Google irá direcionar mais tráfego para o seu site do que você pode imaginar.

Otimização de imagem WordPress facilitada

Antes de chegar neste artigo, você pode não saber totalmente o quanto a otimização de imagens do WordPress pode melhorar todos os aspectos do desempenho do seu site do WordPress. Quando você otimiza suas imagens usando os métodos e dicas detalhadas acima, seu site será capaz de funcionar em um nível semelhante ao dos meninos grandes.

Mas quando o tráfego do seu site começa a aumentar, você está preparado para as ameaças de segurança que podem vir com ele? Um poderoso plugin de segurança para WordPress como o iThemes Security Pro pode eliminar essas ameaças pela raiz, antes que se tornem problemas.

Se o pior acontecer e você precisar restaurar seu site após uma violação de segurança (ou outra catástrofe), você ficará feliz por ter um plano sólido para backups do WordPress com um plugin de backup do WordPress como o BackupBuddy. Acredite em nós, você economizará horas de trabalho e frustração.

Agora, vamos começar a otimização de imagens do WordPress!

Kristen Wright

Kristen tem escrito tutoriais para ajudar os usuários do WordPress desde 2011. Normalmente, você pode encontrá-la trabalhando em novos artigos para o blog do iThemes ou desenvolvendo recursos para o #WPprosper. Fora do trabalho, Kristen gosta de fazer um diário (ela escreveu dois livros!), Fazer caminhadas e acampar, cozinhar e aventuras diárias com sua família, na esperança de viver uma vida mais presente.