Acessibilidade, Validações e Mecanismos de Busca

A introdução das técnicas de acessibilidade vai além do que simplesmente tornar sites acessíveis a certos tipos de software utilizados por deficientes visuais, estas técnicas ajudam de forma eficaz a melhorar o hanking do seu site nos mecanismos de busca. Vou explicar melhor.

Diversos desenvolvedores usam técnicas sujas para poderem melhorar seus sites no hanking do PageRank do Google. Você pode notar isso quando você faz uma busca por alguma coisa e vê a quantidade de sites que não falam sobre aquilo que você procurava, na frente daqueles sites que realmente contém a informação relevante. Dessa forma a internet é lotada de lixo sem significado no meio da informação relevante, como eu escrevi aqui anteriormente, dificultando as buscas por informação real e causando indigestão nos mecanismos de busca. Mas existem maneiras honestas e limpas de melhorar e muito a relevância do seu site entre tantos ecos inúteis. A receita é web standards e acessibilidade.

O Google utiliza um algoritmo que interpreta o seu site utilizando alguns critérios muito importantes. Dentre eles, os que mais podem tornar seu site importante são as técnicas de acessibilidade bem aplicadas, somado a um código semântico e racional. Se você observar bem as sugestões do WCAG você vai observar que seu site ficará mais compreensível não só para deficientes visuais e sim para mecanismos de indexação. E isto está além da validação.

O fato de você ter um site validado ou não por mecanismos como o Cynthia Says, não necessariamente indicará que seu site esteja acessível. Primeiro por que mecanismos interpretam código e não conteúdo. Nenhum destes mecanismos vai dizer se seu texto ficou acadêmico ou colegial, ele simplesmente vai interpretar sintaticamente o seu código, ou seja, ele vai verificar se não tem tag escrita errada, tags que não fecham, caracteres estranhos etc, nada além disso. A importância de validar um site só tem real valor na utilização de um código semanticamente correto, coisa que não existe mecanismo nenhum que pode avaliar além do olho humano. Nenhum mecanismo vai saber a diferença entre o endereço de uma loja, uma citação ou um outro texto qualquer se você não der significado a ele. Numa relação mais humana, quem dá o significado ao conteúdo é o desenvolvedor que escolhe colocar um endereço em uma <table> ou em <address> e não as máquinas. Você pode ter um em XHTML e nunca usar <h1> nem <address> e nenhuma <li> e ainda assim validar seu trabalho em XHTML Strict e WCAG AAA no Cynthia Says.

Temos então um outro ponto de vista sobre os validadores e sobre acessibilidade. Elas não te ajudam a dar significado para o conteúdo do seu site, mas te ajudam a verificar se você não cometeu nenhum erro na sintaxe do seu código. É para isso que os validadores na internet servem. As dicas para deixar o seu site relevante é saber dar significado para a informação. Veja algumas dicas.

1 – Coloque imagens relativas a estrutura do layout por CSS:
Evite ao máximo e, se conseguir, totalmente, colocar imagens referente a estrutura do layout no código XHTML. Coloque-as todas por CSS. A razão disso é que estas imagens não tem significado nenhum, são simplesmente usadas para dar uma aparência ao site e não complementam a informação.
2 – Só use imagens no código XHTML se elas ilustrarem a informação caso contrário coloque-as por CSS:
Se você vai publicar na internet a receita de um bolo, nada mais adequado do que ilustrar a matéria com uma foto do próprio bolo, ou seja, neste caso, coloque a imagem no código XHTML devidamente acompanhada do atributo atl, mas se você quer colocar uma imagem de degradê acima do título do seu site, coloque por CSS e nunca no código. Porque? Porque o degradê não possui nenhum significado relativo ao conteúdo do seu site senão pura aparência.
3 – Quando colocar imagens, SEMPRE use conteúdo alternativo, o bom e velho “alt” nas imagens:
Sabe quando você faz uma busca por imagens no Google? É o alt que ele usa para indexar as imagens e é ele que dá significado para imagem. O Google é cego para as imagens, assim como um deficiente visual, mas nem por ser “deficiente” que ele deixa de "ler", assim como alguém lê em braile, o Google vai ler o alt da sua imagem e indexa-la.
4 – Utilize links textuais sempre:
Alguns mecanismos de busca tem os links como o fator mais importante nos algoritmos de indexação. Se você utiliza mapa de imagens ou flash nos menus do seu site sem fornecer conteúdo alternativo para o flash, esqueça a indexação. Utilizar links textuais juntamente com o atributo title, pode dar significado melhor para o Google e para o usuário do seu site.
5 – Verifique se seu site é igualmente acessível em browsers com applets e JavaScript desabilitados:
Não é muito incomum pessoas desabilitarem o JavaScript em seus browsers. Verifique sempre se a navegação e o conteúdo do seu site não serão comprometidos se o browser estiver com estas opções dasabilitadas. Se um usuário não tiver acesso a uma informação que vem exclusivamente de um Java script, tão pouco o Google terá acesso.
6 – Quer ter imagens como títulos? Use técnicas de Image Replacement e deixe conteúdo textual nos headings (<h1>, <h2>, <h3> etc) no seu XHTML:
Nunca coloque uma imagem no código fonte como título de alguma coisa. Se você quer ter um título personalizado por uma imagem, insira essa imagem por CSS deixando o texto que será interpretado pelos mecanismos no seu código fonte. Utilizar headings no código é tão importante quanto ter o DocType correto no seu site.

Essas dicas já são até disciplinas de estudo nas faculdades de comunicação para web no exterior, elas se chamam de Search Engine Optimization (SEO), ou seja, otimização dos mecanismos de busca.

  • Mauricio

    Ficou muito bom texto! Linguagem bem simples. Incrível como conseguiu falar tudo isso sem utilizar a palavra 'parser'!! hehe

  • Bartus

    Opa!

    Duas coisinhas: PageRank e ranking é com "R". Se foi um trocadilho com as palavras não entendi.

    No mais as dicas são muito úteis. Uma boa olhada no HTMLdog também pode ajudar a entender mais o sentido e usabilidade de cada TAG.

    E pra quem acha que o uso destas dicas acaba engessando o layout, dá uma olhada nesse layout.

  • Flavio Mendes

    Tenho sempre acompanhado seus posts que têm sido de muito proveito para mim e para os meus alunos. Go ahead!

  • Henrique Boaventura

    Conteúdo indispensável para qualquer um que queira fazer um site webstandards

  • Pingback: putcharles’s Blog » Sistemas de busca & Webstandards()

  • Pingback: SemJanelas.net - Desenvolvimento Web e Software Livre()

  • http://squiter85.blogspot.com Brunno dos Santos

    Ae Henrique, não conhecia seu blog, mas agora que conheço já assinei seus feeds (hehehehe)

    Gostei muito do conteudo desse post, as pessoas tem que usar essas "regrinhas" sempre!!

    Parabens

  • Nelson

    Muito bom o texto :D

  • Rafael Slonik

    Viva la Revolución!

    Excelente Texto. Muito importante avisar aos desavisados sobre o lugar das imagens de layout!

  • Rodrigo

    Olha só que belo exemplo (de não se seguir!!!):

    http://www.cynergia.com.br/website.php

  • Pingback: Netlus » Blog Archive » Quem precisa de um site?()