Otimização de imagem para aumentar a velocidade e promoção do site - Semalt Expert



As imagens são um dos componentes mais importantes da web, seguindo o texto, é claro. Um site sem imagens costuma ser enfadonho e menos motivador para os surfistas do que um site que tem imagens.

Além disso, existem algumas áreas onde o uso de imagens é obrigatório e mesmo necessário para justificar o site.

Por exemplo:

Promoção da imagem do Google: usando imagens corretamente

Você investiu e comprou fotos de sites de fotos/repositórios de imagens ou até ampliou e tirou fotos você mesmo? Você também deve maximizá-los para fins de SEO!

A promoção da imagem do Google é um dos melhores maneiras de aumentar o tráfego do site em certas áreas - especialmente aquelas que se concentram no lado visual.

Apesar do acima exposto, o uso indevido de imagens pode fazer mais mal do que bem ao site e até prejudicar significativamente os esforços de promoção. Ao falar sobre o uso de imagens no contexto de promoção orgânica, é importante ter algumas regras em mente, o uso indevido de imagens pode prejudicar significativamente a velocidade do site e, portanto, ter um impacto significativo na promoção.

Regras básicas de otimização de imagem:

1. Peso e dimensões da imagem

Um dos parâmetros importantes para promover imagens online - é o peso da imagem.

Por um lado, gostaríamos de usar imagens de alta qualidade, mas, por outro lado, isso não prejudicaria a velocidade do site, a experiência do usuário e a promoção. A recomendação é sempre “otimizar” (desde a palavra otimização) as imagens ao máximo possível, sem prejudicar significativamente a qualidade. Para fazer isso, siga todas as seguintes regras:

Peso recomendado para fotos

Quase qualquer imagem pode ser comprimida em um grau ou outro, por isso é sempre aconselhável usar apenas as dimensões realmente necessárias e que estão fisicamente exibidas no site, e reduzir o peso das imagens o máximo possível. Isso é verdade para qualquer site. Mas especialmente para sites com muitas imagens. Não existe uma regra que seja verdadeira em todos os casos, mas é aconselhável certificar-se de que o peso da imagem não exceda 70-80K, a menos que seja uma imagem de galeria/controle deslizante de especial importância.

2. Escolha um nome apropriado para a imagem

Em uma busca no Google por imagens, vários parâmetros são levados em consideração para exibir a imagem relevante para a consulta. Um deles é o nome do arquivo. É recomendável gastar mais um segundo e dar à imagem um nome que descreva o que você vê na imagem. É importante manter um nome de arquivo em inglês e usar linhas intermediárias e não espaços. A razão é que o Google lida melhor com travessões intermediários.

Exemplos de um nome ruim para uma imagem:

DSC2387.jpg

Site promoter.png

Exemplo de um bom nome para uma imagem:

Search-engine-optimizer.jpg

Para aqueles que estão se perguntando - sim, o Google também sabe como lidar com nomes de imagens em inglês para outros idiomas. Porque ele sabe como traduzir strings de pesquisa e destacar palavras traduzidas nos resultados da pesquisa.

3. ALT para a imagem

A alt tag, que é uma abreviatura de alternative, é um parâmetro que visa descrever a imagem. A alt tag é definida dentro do sistema de gestão/código HTML para cada imagem individualmente, e sua função original é atender os cegos e pessoas com deficiência que usam um software especial que faz a varredura dessas tags e lê o que está escrito.

Tecnicamente no código, é assim:

<imgsrc="tree.jpg" alt="tree">

Além da importância da tag em termos de acessibilidade do site, ela também é importante para os mecanismos de pesquisa. A alt tag ajuda os mecanismos de busca a entender qual é o assunto da imagem (junto com outras coisas como o nome do arquivo, o contexto da página em que está, etc.) e também afeta naturalmente a busca de imagens no Google.

Além disso, a alt tag faz parte da otimização on-page para tudo. Além disso, quando há um link externo saindo da imagem, a alt tag serve como uma espécie de âncora de texto ("texto âncora") para a imagem.

Como posso verificar se uma imagem tem uma tag ALT?

Existem várias maneiras:
Sapo gritando - Use um sapo adequado quando quisermos fazer uma varredura completa das imagens no site.

O processo consiste em inserir um URL para digitalizar e clicar na guia Imagens.

Lá veremos a lista de imagens do site, que pode ser classificada por vários parâmetros:
É claro que existem mais maneiras e mais plug-ins de vários tipos, mas me parece que abordei o assunto aqui em termos de necessidade pontual, por página, e uma revisão abrangente do site.

Promoção da imagem do Google - dicas para otimizar tags ALT

Você não deve forçar palavras-chave, mas tente descrever o que você vê na imagem.
Não há necessidade de usar alts para papéis de parede/imagens decorativas - mesmo assim, é recomendável não usar, para que o Google não suspeite que você está tentando superotimizar.

4. A tag de título de uma imagem

Legendas de imagem, ou legendas, são um tipo de dica de ferramenta que pode ser vista movendo o mouse sobre uma imagem. Muitas pessoas os confundem com tags ALT.

Os títulos das imagens são outra indicação da relevância e do assunto da imagem que podem ajudar o Google a entender sobre o que a imagem está falando e melhorar seus rankings de busca de imagens. Ao contrário da tag ALT, a tag de título geralmente é mais descritiva e um pouco mais longa, e sua finalidade é descrever para o surfista o que se vê na imagem e/ou o que virá depois de clicar na imagem. Os sites de notícias fazem uso frequente dessa tag.

Isso é o que parece no código:

<img class="alignnone wp-image-1323 size-full" title="Exemplo de imagem do título">

5. Tipos de imagem e extensões de arquivo

Existem vários formatos comuns de uso de imagens online. Vou expandir brevemente cada um deles:
Resumindo - os gifs não são feitos para exibir imagens, especialmente quando se trata de qualidade de imagem, mas para ícones, animações e elementos mais simples.
Existem muitos outros formatos de imagem disponíveis, mas eles são menos relevantes para uso em sites.

Dica - Para quem usa Photoshop, sempre recomendo comparar o peso da imagem usando Salvar para web e dispositivos entre os diferentes formatos (há uma prévia do peso da imagem antes de salvar o arquivo).

Regras gerais para selecionar formatos de imagem

6. Uso adequado de miniaturas



As miniaturas (visualizações) são um componente importante e até crítico de alguns sites - especialmente sites baseados em galerias e sites de comércio. As miniaturas ("Thumbnails" do Google Translate ...) podem ser ótimas por um lado, mas sabotam significativamente o site e a experiência do usuário, por outro.

O mais importante no uso dessas imagens é manter uma qualidade e peso razoáveis ​​o mais baixo possível. Em grandes sites de comércio que dependem de miniaturas para exibir páginas de categorias e visualizações de produtos, esse fato é especialmente importante. Você sabia que cada segundo de atraso no carregamento do site custa à Amazon US $ 1,6 bilhão por ano? Muito do tempo de carregamento nesses sites são as imagens.

É verdade que a maioria de nós só pode sonhar em ter um site dessa magnitude. Mas você sabe - grandes mudanças começam de baixo para cima e pequenas. Quanto mais cedo abordarmos, melhor.

Dicas para usar miniaturas corretamente

É altamente recomendável criar uma miniatura para a miniatura e uma imagem maior para a própria página do produto. Não use a imagem grande como miniatura! Isso carregará várias vezes o carregamento do site, especialmente quando há muitas miniaturas em uma página. Em vários sistemas CMS, você está automaticamente isento desse problema.

Quando se trata de regras de otimização de imagens, é aconselhável investir mais em imagens grandes do que em miniaturas. Por exemplo - não inclua as miniaturas no Sitemap de imagem (extensão abaixo); em alguns casos, nem mesmo defina as tags ALT para elas. A ambição é que o Google indexe as imagens grandes em detrimento das miniaturas e não o contrário.

Recomenda-se definir o Título da Imagem em Miniaturas, que descrevem o produto em poucas palavras e em geral o que o surfista verá ao clicar na imagem.

Se cada página de categoria de produto tiver muitos produtos (digamos, mais de 30), é recomendável usar um script Lazy Load que carregue as imagens apenas quando o surfista rolar para a área onde estão.

7. Uso de quebra de texto

Normalmente, as imagens vêm para servir ao texto e não o contrário. Mas no que diz respeito à otimização de imagens e promoção da imagem Google, e se o site é uma rede baseada em imagens, vale muito a pena não descurar a questão dos textos, mesmo que sejam básicos.

Para quem deseja manter um visual limpo e minimalista possível (por exemplo, no site de portfólio de um fotógrafo), é recomendável que ele defina pelo menos o seguinte em cada página que tenha uma imagem:

8. Sitemap para fotos

O mapa do site de imagem (image-sitemap.xml) ajuda o Google a ler e indexar melhor as nossas imagens no site. Semelhante a um sitemap XML padrão, um sitemap de imagens pode ser enviado usando o Search Console, na área de sitemaps.

Adicionar um Sitemap no Search Console

Um mapa de site de imagens é especialmente útil ao usar todos os tipos de galerias com scripts e vários efeitos - que o Google tem dificuldade em digitalizar convencionalmente.

Existem alguns parâmetros para usar sitemaps de imagens.

Como criar um sitemap?

WordPress - Como de costume, se você trabalha no WordPress, sua vida é fácil. O plugin Udinra All Image Sitemap fecha o canto para você. Tudo que você precisa fazer é instalar o plug-in, marcar algum V nas configurações, criar o mapa do site e lançá-lo no Google por meio do Search Console.

Em qualquer outra plataforma - depende. Se não houver uma solução pronta para uso, como um plugin, etc., isso pode ser feito usando o Screaming Frog.

O sapo pode ajudá-lo a produzir um mapa do site de imagens facilmente. O único problema - ele não será atualizado automaticamente (ao contrário de um plugin) e deve ser atualizado de vez em quando.

Como você faz isso?

Deve ser realizada uma varredura completa do site solicitado e, em seguida, no menu superior do software, vá para Sitemaps -> Criar Imagens do Sitemap. O que você receberá é um arquivo XML kosher para usar e iniciar por meio do Search Console.

9. Incentive o compartilhamento de fotos

Se você se orgulha de usar muito as imagens originais (seja uma imagem física ou um elemento gráfico) e as imagens são o principal ou pelo menos uma parte essencial do site, vale a pena incentivar os usuários a compartilhar as imagens nas redes sociais redes e tornar mais fácil para eles fazerem isso.

Como de costume, tenho dicas práticas para a plataforma WordPress, em outros sistemas recomendo usar um programador ou verificar se existe um plugin dedicado para ele.

O WordPress tem 2 plug-ins interessantes para essa finalidade:

10. Ferramentas de redução e otimização de imagem

TinyPNG - um serviço excelente que permite compactar imagens online com uma interface de arrastar especialmente conveniente. Eles também possuem uma API que permite trabalhar em maior quantidade e automaticamente, e também um ótimo plugin para WordPress que permite compactar todas as imagens do site - requer o uso de sua API (gratuita por 500 imagens por mês).
Fotosizer - bom software de desktop que permite editar imagens em grandes quantidades - não apenas a compressão, mas também a redução das dimensões, adicionando marcas d'água e vários efeitos às imagens e muitos outros recursos interessantes.

Conclusão

Você acabou de entender a importância de otimizar as imagens de um site. No entanto, se você quiser saber o estado atual do seu site, pode fazê-lo gratuitamente, graças ao Semalt's Consultas de SEO.
O Semalt o ajudará a identificar problemas de SEO relacionados ao seu site. Além disso, com Semalt Experts você pode facilmente melhore o desempenho do seu negócio online a um custo menor.

mass gmail