O nível de profissionalização dos profissionais de otimização de sites (ou SEOs, como são chamados) está cada vez mais avançado e, quando entramos competição, cada detalhe na otimização de uma página pode fazer uma grande diferença no seu posicionamento final em mecanismos de buscas – e nos resultados que você apresenta ao seu cliente. Um destes detalhes do SEO On Page que pode te ajudar a fazer esta diferença é a otimização de imagens.
O que é SEO de Imagens e por que fazer?
A otimização de imagens é parte fundamental da otimização On Page por duas razões:
- Velocidade de Carregamento da Página: A velocidade de carregamento de uma página é um fator decisivo para os mecanismos de busca ao posicioná-la nas páginas de resultados (SERPs). É imprescindível que o tamanho e peso das imagens que utilizamos sejam adequados para que não consumam tempo para carregar desnecessariamente na sua página.
- Meta-informações nas Imagens: Os mecanismos de buscas processam apenas texto, o que significa que todas as imagens contidas em uma página web não são mais relevantes que duas linhas de qualquer outro conteúdo em texto da sua página. Para que as imagens do seu site sejam devidamente “vistas” pelo Google e demais mecanismos de buscas, se faz necessário que tenham os atributos ALT e TITLE, responsáveis por descrever textualmente o conteúdo das imagens, preenchidos com informações relevantes.
Otimização de Imagens: resoluções mais comuns de monitores
Podemos considerar que atualmente as resoluções mais comuns para monitores estão a partir de 1024x768px, 1280x800px e 1366x768px – entre muitas outras, maiores, claro. Mas o que isso significa? Todo o conteúdo de um site é exibido dentro do espaço do navegador, que é menor que o tamanho da tela; desta forma, a sua imagem também estará presa a estas limitações e mesmo que sejam utilizados mecanismos de ampliação, como o lightbox, sua imagem não poderá ultrapassar o tamanho da tela. Assim, recomenda-se a utilização de fotografias com um tamanho médio de 1280x800px – inclusive, se ela não estiver destinada a sofrer ampliação, é recomendável que ela seja colocada no site no seu tamanho final, ao invés de ser redimensionada via código, após o upload.
Otimização de Imagens: Resolução vs. Velocidade de Carregamento
A resolução das imagens é um fator crucial para a velocidade de carregamento de uma página (e, consequentemente, para o melhor posicionamento de um site nas buscas): imagens para WEB não precisam ter mais que 72dpi – apenas peças destinadas à impressão devem ter qualidade superior a esta. Pode até parecer que uma foto com 300dpi é mais nítida que outra com 72dpi, mas a única diferença real entre estas fotos é que, quando elas estiverem online, a primeira demorará muito mais tempo para ser carregada, prejudicando o tempo total de carregamento da página.
Otimização de Imagens: Atributos ALT e TITLE
Antes de falarmos dos atributos ALT e TITLE, uma dica: antes de fazer o upload de uma imagem é fundamental renomear o arquivo desta imagem eliminando os espaços, acentos e caracteres especiais e inserindo palavras-chaves relevantes para exprimir o seu significado – lembre-se que é a partir do nome do arquivo que é construída a URL da imagem quando ela estiver online. Após o upload e inserção da imagem na página, ainda existem dois atributos que exigem atenção: o TITLE (Título) e ALT (Texto Alternativo).
Os atributos ALT E TITLE são meta-informações (ou seja, informações sobre as informações, no caso, a imagem): o ALT, chamado de texto alternativo, tem como função informar aos mecanismos de buscas o conteúdo da imagem – sendo complemente invisível para os usuários; já o TITLE visa descrever o conteúdo da imagem para o usuário, através de uma pequena tarja que surge quando o mouse é pousado em uma imagem. Em última instância, ambos os parâmetros acrescentam conteúdo á sua página, então, dentro de uma estratégia de SEO, constituem oportunidades e aumentar a densidade de palavras-chave estratégicas para sua página.
E você? Presta atenção ao tamanho das imagens que coloca no seu site? O que você faz para diminuir o tempo de carregamento das suas páginas?
9 Comments
Castro, ótimo artigo.
Notei que citou sobre o atributo alt nas imagens. Além de servir como informações para os mecanismos de busca acredito que o texto alternativos nas imagens tb seja para descrever as imagens quando o usuário não consegue visualiza-la.
Ao carregr páginas que contenham imagens com o atributo alt (desabilito a exibição das imagens), o texto alternativo é exibido.
Acredito que seja uma ótima forma de melhorar a experiência do usuário quando essa não é das melhores !-)
Exato John, ótimo adendo!
Além de tudo isso, os ALTs também são valiosos quando se trata de acessibilidade: os browsers para deficientes visuais os utilizam para descrever o conteúdo das imagens 🙂
Colega Ian, em meu blog tenho escrito inumeros textos sobre este e outros assuntos relacionados as questões de usabilidade e técnicas de seo em blogs e sites, e lhe digo que otimizar as imagens do blog ou site trazem uma vantagem enorme para o desempenho do projeto de seo, pois agrega valor ao site e prestigia também aqueles que não possuem visão e que utilizam os programas leitores que traduzem os termos alt das imagens… mas, enfim, parabenizo-lhe pelo belo trabalho que faz aqui pelos seus leitores… um forte abraço…
Oi Maurício,
Obrigado pelo comentário! Olhei o TudoSEO, parabéns pelo site!
Como você também é engajado com o tema eu queria dizer que continuo escrevendo bastante sobre SEO, mas mudei um pouco o lugar. Por isso te convido a conhecer o blog da minha empresa, a Salve! Digital: http://salvedigital.com.br/blog.
Abraço,
Excelente artigo, parabéns.
Apenas uma pequena questão, qual a vantagem/desvantagem de alojar a foto no mídia do Worpress e qual a vantagem/desvantagem de alojar a foto num servidor externo (Picasa/Flick).
Muito obrigado pelas futuras respostas.
Oi Hugo,
Basicamente é uma questão de escolha. Veja como fazer essa opção de forma responsável:
Se você tem um site forte (com bons posicionamentos no Google e bom PageRank) e uma hospedagem com espaço suficiente para armazenar suas fotos é melhor hospedá-las no seu site. Por que? Porque suas imagens não apenas vão aparecer no Google Imagens, mas vão gerar tráfego direto de lá para o seu site – o que não ocorreria se elas estivessem no Flickr ou Picasa, nos quais você pode, no máximo, colocar um link na descrição (e rezar para o usuário clicar). Além disso, utilizar imagens provenientes destes serviços, você tem menos controle sobre atributos como nome do arquivo e tamanho/qualidade da imagem – o que pode acarretar em um aumento no tempo de carregamento nas páginas onde estas imagens aparecem, que é um critério importante de ranking (como você pode ver neste outro post sobre a velocidade do site).
Por outro lado, se o seu site for pequeno, novo ou simplesmente “fraco” em questão de SEO, optar por utilizar serviços com o Flickr e o Picasa pode SIM aumentar a visibilidade do seu conteúdo no Google, pois estas plataformas são populares e muito bem vistas e posicionadas nos mecanismos de busca.
Espero ter sido útil!
Ian a sua resposta foi muito útil, muito obrigado.
Excelente artigo Castro. Parabéns!
Mas uma pequena dúvida que eu gostaria que você tirasse, ao otimizar as imagens, cuja a intenção claro é melhorar o tempo de carregamento dos arquivos e da página, como você havia mencionado no post, é obrigatorio que a resolução da imagem, 1024x768px, a 1366x768px como foi mostrado no artigo, seja essa de uso padrão? Ou vai depender de websites feito por: Wix, WordPress entre outros. Agradeço pelo futuras respostas.
Fala Leandro,
Não, os tamanhos citados não são obrigatórios e eles dependem mais do objetivo do site e tamanho das telas nas quais ele será visualizado do que da plataforma (WordPress, Wix, etc).
Eu citei aqueles tamanhos especificamente, pois eles são o padrão para telas de computadores de 13 a 15 polegadas – sem HD ou FullHD. Mas vai depender muito de onde seu público verá seu site. Se você estiver fazendo um site que…
A) será acessado por pessoas normais, em seu computador ou telefone, trabalhar com 1400px de largura e 1050px de altura é o suficiente;
B) será acessado por usuários de smartphones mais caros, com um iPhone, seria interessante usar 1170px de largura e 2532px de altura.
C) será acessado em reuniões presenciais (geralmente em TVs grandes, né?), é legal usar, no mínimo, 1920px de largura e 1080px de altura (que seria Full HD).
D) será usado para anunciar serviços visuais (de Design, por exemplo), é fundamental que as imagens estejam na melhor qualidade o possível – que seria, no mínimo, Full HD (1920px de largura e 1080px de altura) ou até 4K, se isso realmente importar para o seu público.
Enfim, espero ter ajudado!