Categorias

Otimização da imagem: Tudo o que você precisa saber

A otimização de imagens é uma prática conhecida de SEO. Aqui estão 11 dicas obrigatórias de otimização de imagem.

A otimização de imagens é basicamente a otimização de suas imagens para que elas possam ser classificadas no Google. Mas como você otimiza suas imagens? Neste artigo, falamos mais em detalhes sobre o que é otimização de imagem, e lhe damos 11 dicas obrigatórias de otimização de imagem para uma melhor SEO.

O que significa otimizar as imagens?

Se eu pudesse resumir a otimização de imagem em uma palavra, eu diria eficiência.

A otimização de imagens é, fundamentalmente, um equilíbrio entre ter imagens de alta qualidade - fazendo uma imagem parecer o melhor possível, ocupando o mínimo de espaço (e largura de banda) possível. 

Aqui está uma explicação mais detalhada do que eu quero dizer:

Sabemos que quantidades maiores de dados levam mais tempo para serem transferidos através da Internet.

Em outras palavras, tamanhos maiores de arquivos de imagem levam uma velocidade de carregamento maior. Imagens maiores (em tamanho de arquivo, não necessariamente em tamanho de pixel) têm tempos de carga mais longos.

Por outro lado, um tamanho de imagem menor (imagens, em nosso caso) pode não ser tão de alta qualidade quanto um tamanho de arquivo maior. (Essa não é uma afirmação absoluta, mas sendo todas as coisas iguais, geralmente é o caso).

ajustes de tamanho de imagem wordpress otimização de imagem

Os benefícios da formatação de suas imagens

Portanto, o que queremos dizer com otimização de imagem é exatamente isso: há um equilíbrio entre o tamanho do arquivo (tempo de carregamento) e a qualidade visual. Esse é o verdadeiro benefício aqui. Felizmente, com as dicas listadas abaixo, você deverá ser capaz de reduzir significativamente o tamanho do arquivo de imagem de quase todas as imagens, mantendo ao mesmo tempo uma grande parte de sua qualidade visual.

Por que a busca de imagens é importante

Abaixo, falo em nomear apropriadamente suas imagens (ou seja, os nomes dos arquivos) e alterar o texto. Estes são fatores-chave para ajudar sua imagem a ser encontrada em uma busca de imagem. Você provavelmente sabe que pode restringir uma página de resultados de busca no Google para mostrar apenas imagens. Otimizando suas imagens para SEO, ajuda sua imagem a aparecer na parte de imagens dos resultados da busca.

câmera google search seo otimização de imagem

11 Dicas importantes de SEO para imagens que você precisa saber

As 11 dicas de otimização de imagem a seguir devem lhe dar uma compreensão sólida de exatamente o que você precisa fazer para ter imagens que parecem ótimas e carregadas rapidamente.

Tip#1: Criar imagens exclusivas

Com as tecnologias avançadas de reconhecimento de imagem de hoje, criar imagens únicas ou originais pode ser uma vantagem, especialmente se você estiver em um mercado orientado à imagem (como a fotografia de casamento) e quiser se destacar.

Dica #2: Escolha sabiamente suas dimensões de imagem e ângulos do produto

Felizmente, as dimensões da imagem podem ser escaladas proporcionalmente. A maioria das plataformas modernas de construção de sites pode escalar uma imagem grande (ou seja, grande em pixels) para caber na maioria das telas. Dito isto, é preferível que as dimensões de sua imagem sejam propícias aos tamanhos modernos de tela. Dessa forma, você pode ter melhor controle sobre como a imagem será exibida na maioria das telas. 

Você pode optar por um tema que responda ao tema, pois ele pode transformar imagens em uma imagem que responda. Uma imagem responsiva é aquela que foi codificada para funcionar bem em uma variedade de tamanhos de tela - da tela da área de trabalho à tela do celular.

Se seu tema, no entanto, não responde, há também algum plugin de otimização de imagem que você pode adicionar ao seu site que pode ajudar a tornar suas imagens responsivas.

Dica#3: Dê nomes à sua imagem de forma descritiva e em linguagem simples

Esta dica se refere ao nome do arquivo que você usa para sua imagem. O texto nos nomes dos arquivos pode ser indexado e pesquisado. Assim, em vez de usar um nome de arquivo padrão como image1.jpg, renomeie a imagem para sua palavra-chave de destino para ajudá-la a ser classificada para esse termo e para obter mais tráfego de busca a partir da busca de imagens do Google.

Tip#4: Escolha o formato certo

Por formato para seus arquivos de imagem, quero dizer tipo de arquivo (ou extensão) - imagens .jpeg, .gif, e .png estão entre as extensões de arquivos de imagem mais estabelecidas.

Mas, há um relativamente novo que merece atenção: WebP.

Embora você possa provavelmente otimizar imagens de qualquer formato, dependendo do conteúdo da imagem, alguns formatos são mais adequados do que outros.

O que eu vou focar aqui é o WebP, que é um formato de arquivo desenvolvido pelo Google. Em comparação com as imagens .png, as imagens sem perdas do WebP podem ser 26% menores em tamanho, e em comparação com .jpgs, as imagens com perdas do WebP são 25-34% menores em tamanho.

Pelo que vi, a WebP está lentamente sendo aceita como um formato de arquivo de imagem viável. Pode ainda não ter pegado (os outros formatos existem há anos e anos), mas já que estamos no tópico de otimização de imagem, seus tamanhos menores fazem dele um formato a ser considerado.

Tip#5: Imagens vetoriais
dicas de otimização de imagem raster vs vetorial

Um problema com alguns formatos de imagem é que, quando eles são ampliados, podem parecer pixelizados. Esse não é o caso das imagens vetoriais: elas podem ser ampliadas sem qualquer pixelização (assim, linhas redondas no original ainda mantêm sua suavidade independentemente de quanto você ampliou).

Dica#6: Pense sobre a estrutura do arquivo de imagem

Estrutura de arquivos (ou melhor, estrutura de pastas), é mais algo com o qual os webmasters geralmente têm que se preocupar.

Em resumo, é a hierarquia de pastas que, em nosso caso, a imagem está dentro.

Por exemplo, sua imagem pode ser encontrada em:

site.com/content/images/2021/my-image.jpg

Ou, talvez seja em:

site.com/my-image.jpg

De modo geral, geralmente é bom armazenar arquivos mais perto da página inicial (ter menos pastas dentro das pastas), mas isto realmente depende da plataforma de construção de seu website.

Dica#7: Escrever texto Alt amigável para SEO

Em um momento, vou explicar o que é texto alt, mas basicamente, assim como você quer ter nomes descritivos de arquivo, para texto alt (que não são nomes de arquivo), você só quer ter texto que descreva o conteúdo da imagem.

O que são Tags Alt e Texto Alt?

Alt é a abreviação de alternativa.

Texto Alt é o termo tecnicamente correto, enquanto o termo alt tagEmbora não seja tão preciso tecnicamente, é utilizado de forma intercambiável com o texto alt.

Não sei se alguma vez você já viu uma imagem falhar em carregar: às vezes, você pode ver texto que descreve o conteúdo da imagem que falhou em carregar. Esse texto é um texto alt. O texto alt pode ser bom para pessoas que têm deficiências visuais: seu software de leitura de tela pode ler o texto alt e comunicá-lo de uma forma que a pessoa poderia não entender de outra forma. 

Além disso, robôs de busca ou rastejadores de busca não têm olhos e também contam com o texto alt para "ler" o que é a imagem.

Também é uma boa prática seo adicionar sua palavra-chave alvo em seu texto alt. Use suas palavras-chave sabiamente e evite o recheio de palavras-chave. Uma maneira de evitar o recheio de palavras-chave é usar outras palavras-chave relevantes e variações de suas palavras-chave em nossas tags de imagem alt e no texto alt.

Tip#8: Uma palavra de cautela no fornecimento de imagens maiores

Imagens excessivamente grandes (seja em tamanho de pixel ou em tamanho de arquivo) podem exigir mais recursos (tanto em tamanho de tela quanto em memória/largura de banda).

Enquanto a Internet moderna pode lidar com grandes tamanhos de arquivos, já que estamos falando de SEO, é bom lembrar que você está procurando um equilíbrio entre quantidade (tamanho) e qualidade (apelo visual).

Tip#9: Considere Qualidade de Compressão vs Tamanho

Uma técnica de otimização de imagem que eu ainda não mencionei é a compressão.

A compressão de imagem é basicamente um processo onde o tamanho do arquivo de uma imagem é reduzido, enquanto que o ideal é tentar manter a qualidade da imagem. Dependendo do método utilizado para comprimir imagens, é possível reduzir significativamente o tamanho do arquivo de uma imagem sem quase nenhuma perda distinta no nível de qualidade da imagem.

diagrama geral de compressão de imagem sem folga vs. compressão de imagem sem folga
Tip#10: Otimização com perdas versus sem perdas
seonitro - imagem sem perdas vs imagem com perdas

Os 2 tipos gerais de compressão de imagem são compressão sem perdas e compressão com perdas.

A maneira mais simples de distinguir entre sem perdas e com perdas é esta: Sem perdas geralmente prioriza a qualidade em primeiro lugar, o tamanho do arquivo em segundo. A prioridade do Lossy é a redução do tamanho do arquivo primeiro, a qualidade segundo. (Você também pode pensar na palavra sem perda como sem perda, como em menos perda de qualidade).

Dito isto, o que mencionei acima pode ser uma simplificação excessiva, mas essa é uma maneira muito fácil de pensar em perda e sem perdas.

Dica #11: Você já considerou o carregamento preguiçoso?
otimização da imagem do site de carregamento preguiçoso

Antes de descrever o carregamento preguiçoso, preciso dar alguns passos atrás e fornecer algum contexto.

SEO (Search Engine Optimization) deve ir de mãos dadas com a experiência do usuário (UX).

O tempo que uma página leva para carregar (às vezes chamado velocidade da página) é um fator na experiência de um usuário. Tem sido dito que as pessoas não querem esperar mais de 3 segundos para que uma página seja carregada.

De fato, tem sido dito que se a velocidade da página de certos sites de grandes varejistas aumentasse tão pouco quanto um segundo (ou seja, se eles levassem um segundo mais que o normal para carregar), poderia resultar em uma perda de milhões de dólares por ano (simplesmente devido às pessoas não esperarem que as páginas sejam carregadas).

Sabemos que todos os arquivos (imagens) levam largura de banda e, portanto, tempo para serem carregados. Quanto maior o tamanho do arquivo e quanto mais imagens houver, mais tempo a página leva para ser carregada.

Então, e se sua página tiver muitas, muitas imagens?

Bem, há algo chamado carregamento preguiçoso.

Basicamente, sem carregamento preguiçoso, uma página web carregará tudo (todas as imagens e arquivos), independentemente de um usuário rolar até eles.

Então, em outras palavras, um usuário pode pousar em sua página, ver que está demorando um pouco para carregar (mais de 3 segundos), e deixar sua página.

Por outro lado, com o carregamento preguiçoso, as imagens não são carregadas até que o usuário desça até elas.

Assim, um usuário pode pousar em sua página, e ver rapidamente a primeira de muitas imagens. Se eles quiserem ver mais, podem rolar (e essas outras imagens serão carregadas à medida que o usuário rolar para elas).

Assim, com o carregamento preguiçoso, a página (embora não a página completa) carrega rapidamente (para que o usuário não tenha que esperar que tudo seja carregado). Se eles quiserem ver mais, podem rolar, e neste ponto as outras imagens serão carregadas conforme necessário.

Isto efetivamente aumenta a velocidade da página (para o usuário) e pode reduzir o uso da largura de banda (porque se o usuário decidir não rolar mais, pelo menos esses ativos não foram carregados desnecessariamente).

Outra opção a considerar se você tem várias imagens em sua página (um exemplo é se você está no comércio eletrônico e tem várias imagens de produtos para mostrar, ou se você tem alguma imagem animada que pode ocupar um grande tamanho de arquivo) é usar uma Rede de Entrega de Conteúdo. A idéia por trás de um CDN é que se um visitante estiver geograficamente mais próximo do servidor que hospeda seu site, então a experiência desse usuário será melhor do que a de outro usuário que esteja mais distante. Isso porque, devido à proximidade geográfica, seu site será carregado mais rapidamente para o usuário local. 

Uma CDN é uma rede de servidores que estão espalhados por diferentes localizações geográficas ao redor do mundo. Estes servidores hospedam seu site para os visitantes que estão mais próximos deles, resultando assim em taxas mais rápidas de transferência de dados e velocidade de carregamento mais rápida para seu site.

Melhore suas técnicas de otimização de imagem

Esperamos que este artigo lhe tenha fornecido dicas úteis para otimizar as imagens em seu site. Lembre-se sempre de buscar imagens de alta qualidade, considerando sempre o equilíbrio entre qualidade e velocidade. Se você tomar medidas sobre as dicas de otimização de imagem mencionadas acima, é muito provável que você crie uma melhor experiência para o usuário e tenha uma melhor classificação SEO para seu site.

DK Fynn

EQUIPE SIA SEOESCRITOR

DK Fynn biografia completa aqui.