Jun 24, 2007

Dicas de acessibilidade para o seu blog

Mais dicas do blog TV RETRÔ:

Tira que ilustra o problema com a usabilidade

Se você chegou agora, antes de continuar leia: Torne seu blog acessível para todos.

Depois de lançar a campanha “Torne seu blog acessível para todos”, nada mais justo que escrever um post com dicas de acessibilidade. Estou muito satisfeito com a campanha, pois os blogueiros que estão participando, estão escrevendo excelentes posts com seus pontos de vista sobre essa questão, e também com algumas dicas de acessibilidade, formando uma grande teia de informação.

As dicas que listarei a seguir, são de acordo com meu ponto de vista, visando a melhor usabilidade do blog para todos os leitores, e tornando-o compatível com os softwares usados pelos portadores de deficiência visual e/ou física para ler as páginas. Poderão ver um exemplo prático dessas dicas aqui mesmo em meu blog.

  • Acesse seu blog usando o mesmo programa usado pelos deficientes visuais

Antes de tudo, acesse seu blog da maneira que ele é acessado por um deficiente visual e/ou físico. Assim poderá entender toda a dificuldade que é sentida ao acessar um blog que tem péssimo nível de acessibilidade. Esse sem dúvidas é o melhor teste para constatar o nível de acessibilidade de seu blog.

Baseado nessa experiência, poderá aperfeiçoar seu blog, e automaticamente torná-lo acessível por uma pessoa que use um desses programas, assim aumentando o tráfego do seu blog. O link para download do software, se encontra no post: Campanha: Torne seu blog acessível para todos – o mesmo recomendado no início desse post.

  • Crie um menu principal antes do conteúdo

É importante que no blog exista um menu principal antes de todo e qualquer conteúdo. Assim o usuário não precisará navegar por todo o conteúdo do blog para achar algo que deseja acessar. Para os deficientes visuais, isso é essencial, uma vez que se não existir esse menu, ele tem que navegar por todo o site para achar o que deseja, e isso não é um processo rápido, pois precisará ouvir a descrição de cada link antes de chegar no desejado.

Nesse menu, é muito importante que o primeiro link seja “Ir para o conteúdo”, pois assim o software que lê a tela – usado pelos portadores -, não precisará navegar por todos os links para que possa chegar ao conteúdo.

A criação desse menu principal, é feita de forma muito simples. Basta usar links que levem a outra parte da mesma página. Por exemplo, para criar um link para ir diretamente as categorias que estão localizadas na sidebar, fiz da seguinte maneira:

Usei as tags:

Coloquei a primeira tag na parte superior de meu layout (onde está localizado o menu) e a segunda tag foi colocada na sidebar, antes dos links das categorias. Assim ao clicar no link que foi posto no menu, o leitor automaticamente será conduzido as categorias, isso facilita tanto para seus leitores comuns, quanto para os especiais – portadores de alguma deficiência. E foi assim que montei todo o menu, apenas direcionando para outras partes do layout.

  • Crie o link “Voltar para o menu principal”

Crie o link “Voltar para o menu principal” da mesma forma que criou os links do menu principal – como expliquei na dica anterior – e o coloque no final da página. Assim ao chegar ao fim do conteúdo, o leitor não precisará rolar toda a página para voltar ao topo. E pior ainda se for no caso dos softwares leitores de tela, pois sem esse link, ele precisararia ler todos os links novamente, para que então pudesse voltar ao menu principal.

  • Descreva links e imagens

É de extrema importância que você faça a descrição de cada imagem que usar em seu blog, principalmente se essas forem usadas no menu. A descrição pode ser feita através do atributo “alt”. Assim o programa que lê a tela, irá reconhecer essa descrição. Também é super importante que use links descritivos. Ao invés de: Acesse o post da campanha, Clicando aqui., prefira: Visite o post da Campanha: Torne seu blog acessível para todos. Você também pode descrever o link através do atributo “title”. Assim ao leitor levar o mouse sobre o link, surgirá a descrição do mesmo.

Alguns posts antigos ainda possuem imagens e links mal descritos. Isso vai ser corrigido durante essa semana, que estou me dedicando especialmente a isso.

  • Acesse seu blog com vários navegadores

Os navegadores usados por seus leitores nem sempre são iguais ao que você usa, há uma diversidade imensa nessa questão. Você deve fazer com que seu blog atenda as necessidades de todos os leitores, independente do navegador e/ou resolução usada por ele, por isso teste seu blog usando o maior número de navegadores possível, principalmente com o leitor de telas usados pelos deficientes – como disse na primeira dica, esse é o melhor teste de acessibilidade.

Não esqueça de refazer os testes sempre que fazer alguma alteração em seu código, por mínima que seja.

  • Mais dicas

Como disse no início do post, os blogueiros que estão participando da campanha escreveram ótimos posts, contando seu ponto de vista sobre essa questão, e também repletos de dicas super interessantes. Recomendo que leia o post de cada participante, além de conhecer seu ponto de vista, poderão aperfeiçoar seus blogs com as dicas dadas por ele. Os links para os participantes também se encontram no post da campanha.