Quando olhamos para a maioria dos sites hoje, verificamos facilmente que muitos deles sofrem de problemas graves. Muitos apenas têm uma imagem ou um flash, outros têm muito pouca informação, mas depois existem sites que á primeira vista teriam tudo para ser “best sellers”, mas depois não aparecem nos resultados de pesquisa para aquelas que seriam as palavras-chaves do site.
Na maioria das vezes isso não é sequer dificil de explicar ou de resolver quando se percebe. Por questões de design não é incomum coisas importantes, que normalmente seriam Headings (H1, H2, H3, etc), não passarem de imagens. Não que isto por si só sejam o fim do mundo, mas o facto de essas imagens não terem qualquer texto associado faz com que os motores de pesquisa não consigam perceber (correctamente pelo menos) quais são as palavras chave de uma página.
O problema é ainda mais grave quando essas imagens são a única referência real a essas palavras-chave. Por exemplo, suponhamos que o titulo deste post era apenas uma imagem, na qual se podia ler o texto ALTs e TITLEs, e que esse texto não aparecia em mais nenhum lugar do texto.
Seria possivel os motores de pesquisa associarem o post a essas palavras? A resposta é “Com a tecnologia actual, não!”.
Alt
Mas isso pode ser contornado. A Tag (X)HTML tem um campo, que em HTML é opcional, mas em XHTML é obrigatório, que é o ALT. O campo ALT das imagens serve para fornecer um texto alternativo, utilizado pelos browsers que têm as imagens desactivadas ou que não mostram de todo imagens… e pelos Robots dos motores de pesquisa, claro.
Estes texto devem ser ilucidativos acerca do conteúdo da imagem, mas curtos, pois serão utilizados em substituição da imagem.
Description
Se pretendermos, de alguma forma, descrever a imagem (site feito utilizando tecnologias XHTML e CSS 2.0, limitado a 800 pixeis de largura, com uma laterar laranja com texto verde e o fundo do corpo principal a cinza claro, com texto quase preto), poderemos utilizar o campo DESCRIPTION.
O description deve ainda ser utilizado por uma questão de usabilidade. A maioria de nós vê. Alguns de nós bem. Mas existem muitas pessoas que não têm essa capacidade, mas que conseguem navegar na internet, utilizando programas especialmente desenvolvidos para esse fim. E se em relação a todo o texto de uma página o programa com mais ou menos precisão consegue ler o texto, quando chega às imagens, não tem forma de explicar à pessoa que está junto ao computador o que representa a imagem. Apenas sabe que é uma imagem. Mas se a imagem tiver uma descrição, utilizando o campo description, a maioria dos programas utilizará essa descrição para descrever a imagem ao seu utilizador.
Title
O HTML permite ainda definir o texto que aparece (normalmente) quando passamos com o rato por cima da imagem, utilizando o parametro TITLE. Este valor pode ser tão grande quanto pretendermos, e é também associado pelos motores de pesquisa à imagem e à página em que a imagem se encontra.
o código de uma imagem, com ALT, TITLE e DESCRIPTION ficaria com esta aparência:
<img src='/caminho/para/imagem.gif' title='A minha melhor imagem' description='Uma descrição tão longa quando o pretenda para a imagem'>
Ah… não vale a pena abusar destes campos, os motores de pesquisa já começam a perceber quando estamos a tentar aproveitar-nos deles, e os seus algoritmos serão cada vez mais apurados. A melhor forma de vender os nossos conteúdos aos motores de pesquisa é sermos informativos, mas consistentes.
Lembro ainda que apesar de estes campos, muitas vezes não utilizados, darem aos motores de pesquisa informação acerca do que está na imagem, e ajudá-los a melhor indexar a página onde as nossas imagens estão, não lhes diz qual a relevância das imagens na página, pelo que este texto será, por norma, tratado com pouco mais relevância do que se de texto simples se tratasse.
Para que as nossas imagens sejam tratadas com mais relevância do que o restante texto da página é necessário que mais relevância lhe seja dada.
Se a imagem substitui o Titulo de uma artigo ou de uma listagem, porque razão é que não está dentro de um H1? Se é um sub-titulo, porque não um H2?
Porque depois quebra o design, ouço muito webmasters dizer… Não amiguinhos, o Design vem antes e depois. Quando se estrutura HTML, é apenas isso que se faz, cria-se a estrutura dos conteúdos. Ainda que se tenha que ter em consideração o Design, esse só é realmente importante depois de o conteúdo estar bem estruturado. Poucas (muito poucas) coisas não se conseguem fazer se o conteúdo estiver bem estruturado.
Não esquecer
Utilizar ALT em todas as imagens.
DESCRIPTION em todas as imagem que possam ser descritas.
TITLE em todas as imagens que possam ter mais a dizer.