Esse site está respeitando os padrões web (web standards) do W3C, associados às diretrizes de acessibilidade dos conteúdos web do departamento WAI, sendo suas páginas testadas pelos validadores de acessibilidade web Examinator (em português) e Total Validator , que já possuem validação de códigos HTML e CSS automáticos, além da avaliação cromática para daltonismo e analizador de Contraste de Cores para baixa visão

Essas dicas interessam a pessoas que navegam via teclado, que não usam o mouse, e para pessoas com deficiência visual que, além disso, se utilizam de descrições de imagens. Pessoas que queiram aumentar o tamanho das letras do texto, podem também saber como fazer isso por aqui.

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 "Voltar para a Página Principal".
   
   
2. Na página principal, pressionando-se as mesmas teclas (ALT + 1) simultaneamente, chega-se ao link "Busca Interna do Site".
   
   
3. Também na página principal, teclando-se ALT + 2, chega-se ao "Mapa do Site".
   
   
4. Todas essas observações anteriores são para o navegador Internet Explorer. No caso do Firefox, ao invés de ALT + número, deve-se teclar simultaneamente ALT + SHIFT + número. No Opera, as teclas são SHIFT + ESCAPE + número. Neste último, ao teclar-se apenas SHIFT + ESCAPE, abre-se uma janela com todas as alternativas de ACCESSKEY da página. Em ambos, 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, ou na navegação via teclado, para se teclar ENTER para se acessar a página desejada.
   
   
5. De outra forma, e podendo ser utilizado por navegadores somente texto como o Webvox e o Lynx, clicando-se no link "Informações", no topo da página, pula-se toda a parte inicial da mesma , para chegarmos no título de mesmo nome "Informações". Clicando-se ao lado, no link para a mesma página "Novidades", salta-se para as seis últimas atualizações do site, enquanto que, se for clicado o link "Serviços", salta-se para os "Links indicados", "Hora Certa", envio de e-mails etc. O próximo link não é um salto, mas um link para o Blog do Bengala Legal
   
   
6. "Topo" é uma imagem que permanece sempre, para quem enxerga, na parte baixa e direita do monitor, ficando visível nessa posição mesmo quando a página é "rolada" para cima ou para baixo. Isso acontece nos navegadores Firefox, Opera e IE 7.0. No Internet Explorer 6.0 e versões anteriores,e para pessoas que navegam com leitores de tela esse efeito não acontece. Nesses casos, a imagem permanece fixa no final da página à direita, só se tornando visível ao se chegar ali. Quando clicada, remete a navegação para o topo da página visitada.

Tamanho das Letras.

1. No topo de todas as páginas, à direita, existem duas imagens com a letra A. Um A+ (A MAIS) e um A- (A MENOS).
   1. Clicando-se no A+ as letras da página irão aumentar, de 2 em 2 pt (pontos), partindo-se de 10 pt, até se chegar a ao máximo de 18 pt.
   2. Clicando-se no A- as letras da página irão diminuir, de 2 em 2 pt, partindo-se de 18 pt (tamanho máximo), até se chegar ao mínimo de 10 pt.

Descrição das Imagens.

1. Existe uma logomarca no início de cada página que é uma imagem onde está desenhado o título "Bengala Legal" em duas alturas. Acima e à esquerda a palavra Bengala e abaixo e mais à direita a palavra Legal. O design Horácio Pastor Soares, meu amigo, acertou a mão e a imaginação ao fazer da letra "l" de Bengala o corpo de um boneco que, com uma de suas mãos segura uma Bengala produzida pela primeira letra "l" da palavra Legal e, com a outra, faz um "V" de "vitória" com os dedos. O rosto do boneco é em amarelo e é a reprodução de um Smiley, com um óculos escuros e um grande sorriso. Tanto o óculos, quanto o sorriso, além do corpo do boneco, seus braços e mãos, são da mesma cor da palavra Bengala, em vinho. Esta está escrita com letras tradicionais, enquanto a palavra legal está em azul, escrita com letras estilizadas e modernas. Abaixo de todo o desenho vem escrito o endereço do site: www.bengalalegal.com.
   A idéia geral que a logomarca passa para quem vê é a de um desenho alegre e atual. Pode-se ver a imagem e sua descrição aqui e através do link que vem logo abaixo dela { D } na página principal.
   
   
2. Na página principal e em todas páginas internas, há um contador textual no decorrer da seguinte frase: Bom dia, (pode ser boa tarde, boa noite ou boa madrugada também, conforme o horário)" você é o visitante número xxx desta página. Como é um contador em texto, nossos leitores de tela conseguem lê-lo. No entanto, eu o deixo fora da tela, oculto de quem enxerga, através de CSS.
   
   
3. Se você tiver mais curiosidade, sobre usuários de que países já entraram na página, os horários, dias e meses de maior visitação, por exemplo, vá nas estatísticas de visitas da Bengala Legal, ao final da página principal e entre em SUMMARY.
   • Nesse contador estatístico existe todas as informações a respeito das visitas também em formato acessível, tem uma imagem pequena como referência. Essa imagem é redonda, como se fosse uma bola, e possui uns riscos em diagonal, como se fossem anéis.
     
     
4. Outra imagem também aparece nas páginas: trata-se de uma imagem muito conhecida na internet e que foi estilizada originalmente para mim por um amigo, Sérgio Milani. Atualmente ela foi alterada para ficar mais de acordo com o rosto do boneco da logomarca da "Bengala Legal", por Horácio Pastor Soares. É o Smiley, cuja descrição pode ser mais ou menos assim: uma bola amarela com dois olhinhos e um grande sorriso. Sergio colocou óculos escuros no lugar dos olhinhos e fez animação na imagem, começando com a bola amarela com os óculos escuros e um enorme sorriso. Logo após essa imagem desaparece surgindo em seu lugar o título desta página, "Bengala Legal". Essas duas etapas ficam se repetindo permanentemente.
   
   
5. Uma imagem em background está colocada em todas as páginas relacionadas à acessibilidade web. A imagem cria um rasgo no topo e final esquerdo das páginas, fazendo aparecer, ilusoriamente, o código HTML por trás das mesmas, como se alguém tivesse puxado a página em cima e em baixo para o centro da mesma, surgindo, então, o código. Um exemplo delas pode ser visto nesta própria página.
   
   
6. Também somente nas páginas cujo tema seja Acessibilidade na web existe, ao final , uma imagem que não é o padrão de todas as outras do site. É a logomarca do site "Acessibilidade Legal", associada ao link que o leva a esta página, possuindo muito mais textos e referências específicos sobre o assunto. Esta imagem e seu link estão ao final desta página. Ela é idêntica a logomarca da "Bengala Legal", apenas mudando algumas cores e a mão do boneco que, ao invés de fazer um "V" de vitória em uma das mãos, faz um sinal de positivo com o polegar para o alto, legal!
   
   
7. Duas cores de tom claro predominam na página: um bege e um bege mais claro. Esse último está sempre envolvido por uma borda vinho, fazendo um enquadramento, enquanto o bege menos claro fica pelo lado de fora. As letras dos textos sem links também são vinho, como nas bordas. (alguns dizem vinho amarronzado). Para os textos com links a cor é azul escuro. O link passa a ser azul Claro quando o mouse passa por cima e fica focado. As páginas internas possuem essas cores e formas que são padrão em toda Bengala Legal.
   
   
8. Com o tempo, introduzi algumas novidades nas cores da página principal. Passei a colocar, dentro do bege claro e liso do interior da borda vinho amarronzado, um espaço com fundo branco e com uma borda fina cinza. Esse espaço serve para dar um destaque para a poesia "Os Imprescindíveis", de Bertolt Brecht. Para que os colegas com deficiência visual possam entender melhor, ficou, nesse caso, de fora para dentro, o fundo bege, a borda vinho amarronzada delimitando esse fundo com outro fundo interno bege claro e liso e, dentro disso e centralizado, outra borda bem fina com o interior de fundo branco e as letras em vinho amarronzado com a poesia. Esse jogo de cores de fundo, bordas e letras dá um pouco de vida a esse espaço, pois a página como um todo é muito discreta.

Disponibilizado em: 20/10/2000.
Atualizado em: 01/08/2009.