Esquerda - Conteúdo.

Acessibilidade do Site.

Marco Antonio de Queiroz* (MAQ).

O "Acessibilidade Legal" foi desenvolvido de forma a oferecer o máximo de acessibilidade aos visitantes, seguindo as diretrizes e a metodologia do W3C - World Wide Web Consortium. Site Externo., apresentadas no documento Diretrizes para Acessibilidade de Conteúdos Web - WCAG 1.0 Site Externo., organizado pelo Web Acessibility initiative - WAI. Site Externo., que é um departamento deste consórcio.
Atualmente suas páginas também estão sendo validadas pelo WCAG 2.0

O site tem sua acessibilidade aprovada por validadores automáticos, por pessoas com deficiência especialistas no assunto e pela utilização em diversos navegadores (somente texto e gráficos). Sua linguagem foi revisada para que se tornasse clara e simples; sua codificação sem erros e dentro dos padrões Web, além de ter sido testada sua utilização de forma a garantir que o conteúdo e estrutura não perdessem sua usabilidade, com ou sem a apresentação oferecida pelas folhas de estilo (CSS).

O design do "Acessibilidade Legal" foi concebido para ser flexível a diferentes resoluções. Procurou-se também deixar a página ajustada ao aumento das letras em todo o site sem que este se desconfigure.

Acredito que a acessibilidade deste site o esteja deixando apto a uma excelente navegação via teclado, por mouse ou mesmo por comando de voz; em diversos navegadores, como o Webvox, Lynx, Firefox, Opera ou Internet Explorer, entre outros. Além disso, conto que o carregamento de cada página esteja sendo feito o mais rapidamente possível, que o site possa ser bem navegado por todos os usuários (com ou sem alguma deficiência) e que possa também ser bem utilizado por leitores de tela, navegadores somente texto ou gráficos, com ou sem alguma tecnologia assistiva específica e em dispositivos móveis.

Navegação pelo Teclado.

  1. Em todas as páginas, com exceção da principal, pressionando-se a tecla ALT em conjunto com o algarismo 1 (ALT + 1) chega-se diretamente ao link "Página Inicial".
  2. Teclando-se ALT + 0 em qualquer página do site, chega-se diretamente em sua busca interna
  3. Em todas as páginas, teclando-se ALT + 2, chega-se ao "Mapa do Site".
  4. As observações anteriores referem-se ao navegador Internet Explorer.
    1. No caso do Firefox, em vez de ALT + número, deve-se teclar simultaneamente ALT + SHIFT + número.
    2. No Opera, as teclas são SHIFT + ESCAPE + número. Ao teclar-se apenas SHIFT + ESCAPE, abre-se uma janela com todas as alternativas de ACCESSKEY da página.
  5. No Firefox e no Opera, ao se teclar suas alternativas de acesso, entra-se diretamente na página proposta, enquanto que no Internet Explorer, ele apenas posiciona o mouse no link para se clicar e, No caso da navegação via teclado, deve-se pressionar ENTER para acessar a página desejada.
  6. Nos navegadores somente texto, como o Webvox e Lynx, por esses não executarem as teclas de acesso, deve-se pressionar ENTER nos links respectivos para se chegar à página principal e de acessibilidade do site, enquanto ao se teclar ENTER em "Pular para o Conteúdo", o cursor salta deste para o título do conteúdo específico da página em que se está navegando.

Descrição da Estrutura do Site.

Para que uma pessoa com deficiência visual possa entender melhor sua estrutura, o site possui algumas dicas que só podem ser escutadas por leitores de tela durante a navegação detalhada do mesmo, sem o pressionamento da tecla TAB. Sendo assim, pode-se escutar avisos sintéticos como: topo da página, barra horizontal superior, coluna à direita, conteúdo - lado esquerdo, barra horizontal inferior e rodapé da página sem que atrapalhe o visual de quem enxerga, pois é posicionado fora da tela por CSS.

O "Acessibilidade Legal" está estruturado da seguinte forma:

  1. No topo da página ele possui três elementos importantes, a saber:
    1. À esquerda está colocada uma imagem em background e que um leitor de telas não detecta. É uma imagem decorativa que representa uma dobra na página, de onde surge o código XHTML no fundo. Trata-se de uma simbologia retirada da idéia de que acessibilidade web é produzida a partir de códigos;
    2. Ao centro está a logomarca da "Acessibilidade Legal", que pode ser conhecida por pessoas com deficiência visual a partir de sua descrição detalhada, clicando-se no "D" maiúsculo abaixo dela na página principal ou no link acima. Apesar de estar visualmente centralizada, no código ela se encontra depois dos links do item abaixo (c), o que significa que os leitores de tela a detectam posteriormente;
    3. À direita, estão as opções de acessibilidade do site, dispostas numa lista de links na vertical e que são:
      1. Salto para o Conteúdo, que pula todos os links anteriores ao conteúdo principal de cada página;
      2. Acessibilidade deste Site, que é exatamente esta página onde você está, com todas as dicas de acessibilidade do site. Os navegadores somente texto só possuem estas duas opções, pois as próximas são scripts não carregados por eles;
      3. Aumentar tamanho das letras, com uma única possibilidade de aumento, suficientemente grande para inúmeras pessoas com déficit visual limitado. Esta opção de acessibilidade é para todas as páginas do site, não sendo necessário voltar a aumentar o tamanho das letras a cada página visitada. Quando acionado, em seu lugar aparece o texto "Tamanho Original", que faz o retorno. Todas as vezes que se voltar ao site as letras estarão no tamanho escolhido na última visita;
      4. Diminuir tamanho das letras, que possui os mesmos mecanismos do anterior;
        1. Os scripts para aumentar e diminuir o tamanho das letras não desabilitam o recurso padrão dos navegadores para estes fins, podendo ser usados em conjunto para obter tamanhos diferenciados para as mais diversas necessidades.
      5. Alto contraste é uma opção para pessoas com médio ou grande déficit visual. Deixa o fundo da página totalmente preto com as letras em branco, podendo ser associado à troca do tamanho das letras. Quando acionado, em seu lugar surge a expressão "Cores originais", para que se possa voltar ao colorido comum;
  2. Barra Horizontal Superior é a lista do menu principal do site:
    1. Artigos, onde se encontram textos técnicos e conceituais sobre acessibilidade web;
    2. Padrões web são textos sobre código XHTML, CSS e Scripts e todas as dicas de como deixá-los adequados à acessibilidade de um site;
    3. Tecnologias Assistivas são textos a respeito de ajudas técnicas prestadas por softwares e hardwares no acesso à web;
    4. Perguntas Freqüêntes possui as respostas a respeito de acessibilidade web; público alvo, diretrizes, leis, vantagens etc.;
  3. Coluna Vertical Direita - sua codificação vem logo após a barra horizontal superior para fins de acessibilidade dos leitores de tela. Nela estão alguns links não tão importantes quanto os do menu horizontal, mas que não poderiam ficar perdidos após o conteúdo principal da página. Visualmente, o conteúdo e a coluna da direita estão paralelos e na mesma altura, sendo delimitados pela barra horizontal superior e finalizados pela barra horizontal inferior. Possui a pesquisa interna do site, links indicados, contatos, mapa do site, Feeds e os "destaques", que são alguns links considerados importantes. Poderá possuir também, em alguns momentos, algum evento que eu ache interessante divulgar;
  4. Conteúdo é a essência da página e onde estarão todos os textos. Ocupa a maior parte da tela e fica à esquerda da coluna vertical;
  5. A Barra Horizontal Inferior possui alguns links, dependendo da ocasião, poderá ter apenas um link para o topo da página, link para página principal ou também link para página anterior. Se o artigo ou texto for quebrado em mais de uma página, possuirá o link para a continuação deste;
  6. O Rodapé da Página - possui uma imagem à esquerda em background no mesmo estilo e significado da imagem do topo. À direita e centralizadas as imagens com os respectivos links para as páginas "Bengala Legal" e "Acesso Digital" nessa ordem. Logo abaixo, numa lista horizontal, existem três imagens com links das validações do W3C para o código XHTML de cada página do site, assim como a validação do CSS e validação triplo A do WCAG e, finalmente, mais uma vez, um link invisível para o topo da página (somente para leitores de tela).

Sobre a Impressão das Páginas.

O "Acessibilidade Legal" possui o recurso de imprimir somente o conteúdo de cada página. Isso faz com que você economize papel e tinta imprimindo somente o que realmente interessa. Faça um teste em "Visualizar impressão". Caso queira imprimir, configure as margens do papel de acordo com a sua necessidade.

Sugestões.

Se você encontrar alguma dificuldade ou tiver alguma sugestão para que possa ser melhorada a acessibilidade do site, não hesite em entrar em contato.

Disponibilizado em: 04/04/2008.