Embora os dois atributos tenham praticamente a mesma função de “legenda”, cada um deles tem uma particularidade e uma finalidade diferente.

Alt

O atributo alt oferece um texto alternativo quando alguma imagem não carrega ou não pode ser visualizada. Esse atributo é muito usado para melhorar a acessibilidade de uma página na web e principalmente de um email marketing, já que muitos clientes de email bloqueiam as imagens automaticamente e a função do atributo é facilitar a “pré-leitura” para o usuário.

Exemplo:

<img src="imagem.jpg" alt="Logotipo Virtual Target" />

Neste caso, se não houver o carregamento das imagens, o usuário visualizará o texto: Logotipo Virtual Target. Pensando em acessibilidade, caso o usuário tenha deficiência visual e use um leitor de tela, ele ouvirá: Logotipo Virtual Target.

Title

Esse atributo oferece um texto descritivo para o elemento em que está inserido e só é visualizado no momento que o usuário passar o cursor do mouse sobre o elemento.

No exemplo abaixo, existe um link e quando o usuário repousa o cursor do mouse sobre a frase irá aparecer o texto descritivo que foi definido como “Página Inicial”.

Exemplo:

O código:

<a title="Página Inicial" href="https://ptbr.virtualtarget.com.br"> Ir para a pagina inicial</a>

Produzirá:

O atributo title é utilizado principalmente como recurso de acessibilidade para oferecer mais informações a respeito de um elemento. Também usado em links para melhorar o posicionamento do site através das palavras-chave.

Exemplo:

O código:

<a href="https://ptbr.virtualtarget.com.br" title="Dicas de Email Marketing"> Questões sobre email marketing <a>

Produzirá:

O atributo title também pode ser definido para imagens, assim como o atributo alt. Porém, quando houver bloqueio de imagens não será exibida nenhuma frase alternativa para o usuário, já que sua real função é proporcionar uma “legenda” quando o cursor do mouse estiver sobre a imagem.

Exemplo:

<img src="foto.jpg" title="Logotipo Virtual Target">

Considerações finais:

• Existem alguns clientes de email que quando visualizados no Firefox não exibem o atributo alt. Neste caso não adianta substituir pelo atributo title, pois eles possuem funcionalidades diferentes.
• Os dois atributos podem ser definidos ao mesmo tempo e isso não aumenta a taxa de spam. <a href="https://ptbr.virtualtarget.com.br"> <img src="imagem.jpg" alt="Imagem do logo" title="Logotipo Target">
• Usar os dois atributos ao mesmo tempo é recomendado para websites, mas para email marketing o ideal é usar o atributo alt.

No related posts.