Estava dando uma passada, no Revolucao.etc, e me deparei com uma postagem muito interessante: “Currículo dos Padrões Web”, o Danillo Nunes está fazendo um trabalho magnifico traduzindo o curso de padrões Web oferecido gratuitamente pela Opera Software, cujo objetivo é ensinar e incentivar a prática do desenvolvimento web de forma correta. Já fora traduzidos 3 artigos, de um total de 39 publicados em inglês.
Então, como disse o Henrique Pereira(Revolucao.etc) vamos incentivar/ajudar o Danillo Nunes a continuar seu trabalho.
Há tempo que eu estava proucurando um simulador/avaliador de acessibilidade, e por acaso encontrei o ASES – Avaliador e Simulador de AcessibilidadE de Sítios, ele é uma exelente ferramenta para simular e avaliar a acessibilidade de um site, tanto local, como na rede. Seu desenvlovimento foi feita com a parceria entre o Departamento de Governo Eletrônico e a OSCIP Acessibilidade Brasil.
“Tendo por objetivo fornecer instrumentos que viabilizem a adoção da acessibilidade pelos órgãos do governo, o ASES é uma ferramenta que permite avaliar, simular e corrigir a acessibilidade de páginas, sítios e portais, sendo de grande valia para os desenvolvedores e publicadores de conteúdo.”
listo abaixo algumas de suas funcionalidades:
Avaliador de acessibilidade (e-MAG e WCAG);
Avaliador de CSS;
Avaliador de HTML (4.01 e XHTML);
Simuladores de leitor de tela (tempo) e Baixa visão (daltonismo, miopia, catarata);
Ferramenta para selecionar o DocType, conteúdo alternativo, associador de rótulos, links redundantes, corretor de eventos e preenchimento de formulários.
Essa é uma técnica usada para substituir uma texto, por uma imagem, isso faz com que o texto não fique visivel ao úsuario, mas fique visivel ao browser, conservando assim a acessibilidade. Há várias formas para se executar essa técnica, porém vou postar aqui a que eu uso e acho mais simples:
1º monte o documento (X)HTML ... <body> <h1>Image-replacement</h1> </body> ...
Onde h1 é o elemento que será substituido pela imagem
Agora faça a folha de estilo: h1{ background: url(image-replacement.jpg) no-repeat; text-indent:-9999px; width:250px; height:100px; overflow:hidden; }
background terá a imagem que substituirá o texto
text-indent é o que fará o texto sumir, neste caso o texto será deslocado -9999px da sua posição original, parece absurdo esse valor, mas é pra garantir que em monitores com resolução maior, ou até dois monitores trabalhando junto o texto não apareça
overflow é apenas para garantir que o texto não fique vísivel mesmo!
width e height é apenas o tamanho da imagem que você escolher
Faça o teste usando outras formas e tags, ou seja é só adaptar ao que se torne necessário e como eu já disse há dezenas de maneiras de se fazer uma Image-Replacement, para saber mais visite esse link: