Diferença entre alt e título de img - qual usar - e impacto

Há anos que escrevo meu HTML para imagens como esta:

<img src="picture.jpg" alt="my picture" >

Recentemente, porém, fiz uma auditoria no meu site usando as ferramentas de SEO da Raven e ele relatou muitos erros com os quais fiquei realmente surpreso.

Quando examinei o relatório, 99% desses erros ocorreram devido à falta do texto do título da imagem.

Sei que o texto do título de uma imagem pode aparecer um pouco quando você passa o mouse sobre uma imagem, mas, além disso, qual é o objetivo e isso afeta o SEO?

Além disso, se você fosse implementá-lo, o que você colocaria lá? Você colocaria a mesma informação que está no altatributo? iealt="my picture" title="my picture"

A tag ALT é uma tag de acessibilidade que foi introduzida para pessoas com dificuldades de visão, mesmo através do Google, para determinar o que é uma imagem. Você nunca deve considerar colocar tags alt para fins de SEO antes de seus visitantes.

Muitas pessoas e até Matt Cutts, que trabalha no Google, falam sobre tags alt como se elas fossem especificamente projetadas para os Mecanismos de Pesquisa para informar aos robôs sobre o que é a imagem, isso simplesmente não é verdade.

No entanto, você pode informar o Google sobre o que é a imagem enquanto cuida do seu público, nunca apenas inserir palavras-chave na tag alt, ela diminui a experiência do usuário e é muito antinatural.

Um excelente exemplo disso é que muitas vezes dizem que alguém deseja classificar para a palavra-chave 'Bournemouth'; eles terão Bournemouth no título; no H1, a meta descrição e cria uma imagem com a tag alt 'Bournemouth'. Embora isso funcione para O SEO amortece a experiência do usuário e perde todo o sentido da tag alt. A tag alt é para pessoas com problemas de visão ou que desabilitam todas as imagens. Portanto, a tag ALT foi projetada para informar ao usuário o que é a imagem.

Um bom exemplo disso pode ser visto abaixo

<img src="i.jpg" alt="Bournemouth" />

vs

<img src="i.jpg" alt="Birdseye view of Bournemouth" />

O exemplo acima ainda inclui sua palavra-chave, enquanto explica ao Google e ao seu público sobre o que é a imagem.

E a tag Title?

A tag title foi projetada para fornecer mais informações quando você passa o mouse sobre um elemento, não é muito útil para IMG, porque se você pretende usar as mesmas informações para ALT e TITLE, pode usar um script para ler a tag alt e fazer com que você passe o mouse sobre JS usando JS. Eu recomendaria apenas a tag title se você fornecer mais informações do que a tag ALT, como uma descrição mais longa - não é necessário fornecer as informações exatas nos dois elementos, pois isso apenas incha o código.

A tag title é realmente útil para links, pois, ao passar o mouse, ela pode fornecer ao seu público mais informações sobre o link no qual eles estão prestes a clicar. Vale a pena ler mais sobre o título aqui .

altfornece uma descrição alternativa da imagem. Este atributo é necessário para img.

titlefornece informações adicionais sobre a imagem. Este atributo é opcional para img.

Nunca dependa de informações no title. Se a informação é realmente importante, inclua-a em seu próprio elemento.

Esses dois atributos não devem ter o mesmo conteúdo.

Sua confusão é normal e sim, cada tag (título, ALT) representa seu próprio potencial, o que ajuda o mecanismo de pesquisa e o usuário a saber do que se trata a imagem.

Algum tempo, o texto ALT não é suficiente para descrever a imagem; portanto, é melhor atribuir mais informações na medida do possível; use variações nas palavras de atribuição, o que é mais eficaz também do ponto de vista do SEO.