blog.fspina.com.br

Teste Acessibilidade no Navegador

Existem vários sites para validar seu site nos padrões W3C/WAI

Tem um jeito mais fácil de fazer esse teste de validação, utilizando seu navegador.
Baixei o Fire Fox, nele tem uma extensão (plug-in/add-on) chamada HTML VALIDADOR (clique aqui para baixar).

Nessa extensão indica em qual linha tem erros e avisos.

Quando instalar e reiniciar o Browser, você vai ver um icone no canto inferior direito.
Se esse Icone for Verde

, o site está validado, se tiver vermelho

contém erros graves e se tiver um amarelho

é de avisos para ser corrigido.

Lembrando que é super importante deixar o código sempre nos padrões para maior visibilidade do site, mesmo se o Icone validado estiver verde, é sempre bom validar a acessibilidade do site

Para ativar o teste de acessibilidade no código HTML, vai em Ferramentas/Tools do Firefox, tem uma opção Html Validator Options ou vai em Add-ons/Extensões, selecione HTML VALIDATOR e clique em Opção/Options.

Ative o "Accessibilty level" (igual da foto), deixando pelo menos no nível 1.
Se conseguir corrigir os problemas de acessibilidade no nível 3, deixará seu site com mais visibilidade ampliando o número de pessoas que possam acessar.

Procure sempre validar o código e deixar acessível multi plataforma.

Marcadores: accessible, acessibilidade, addon, ajuda, developer, firefox, html, plugin, tools, validator, W3C, WAI, Web Accessibility Initiative, webdesign, webmaster

¶ 12:17 0 comments

24.6.07

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.

Marcadores: accessible, acessibilidade, dicas, WAI, Web Accessibility Initiative

¶ 12:27 0 comments

13.6.07

Comunidade Acessibilidade Web

Acessibilidade Web

http://acessibilidadeweb.com.via6.com

No site via6.com é um Orkut de Trabalho e para Profissionais no estilo o LinkedIN.
Descrição: Comunidade sobre o tema de Acessibilidade na Web.

Mostrar boas maneiras e dicas para manter o conteúdo acessível a qualquer usuário e independente a plataforma que está sendo usada.

Projeto que todos possam obter informação.
Melhorar o desenvolvimento do HTML para semântico e organizado nos padrões WAI/W3C.

Atualizações e novidades:
http://blog.fspina.com.br/labels/acessibilidade.html
http://www.naveguebem.org/ (Em teste!)

Marcadores: acessibilidade, ajuda, comunidade, guia, help, manual, reference, WAI, Web Accessibility Initiative

¶ 13:16 1 comments

12.6.07

Dicas Rápidas do W3C para criar na Web

Imagens e Animações: Use o atributo alt para descrever a função de cada elemento visual.

Imagemaps: Use mapas client-side (o tag map) e texto para as regiões clicáveis.

Multimídia: Inclua legendas e transcrições para o audio, e descrições para o vídeo.

Híperlinks: Utilize texto que faça sentido fora do contexto. Evite a frase "clique aqui".

Organização da Página: Use cabeçalhos, listas e uma estrutura consistente. Use CSS para layout e estilo sempre que possível.

Gráficos e Diagramas: Sumarize o conteúdo ou use o atributo longdesc.

Scripts, applets e plug-ins: Para o caso de estarem desabilitados ou de não serem suportados pelo browser, forneça conteúdo alternativo.

Frames :Use o tag noframes e empregue títulos significativos.

Tabelas: Torne compreensível a leitura linha a linha. Resuma.

Valide seu trabalho: Use as ferramentas, checklist e os guias disponíveis em http://www.w3.org/TR/WCAG.

Marcadores: accessible, acessibilidade, dicas, W3C, WAI, Web Accessibility Initiative, webdesign

¶ 17:45 0 comments

11.6.07

Curso de Acessibilidade para Webdesigners Gratuito

Acessibilidade para WebDesigners

Web Access Symbol (for people with disabilities) 2.0 inches - Símbolo de Acessibilidade na Web

Garantir que sua página Web seja acessível já não é somente uma questão de justiça social. O conceito de acessibilidade pode ser simultaneamente:

estratégia de negócio;
necessidade;
adequação às leis;
adequação às diretrizes internacionais.

Este curso explicará o porquê disso e ensinará alguns cuidados que devem ser tomados para manter sua página acessível, levando já em consideração algumas diretivas para a web semântica. O curso possui duas semanas, começando na Segunda-Feira e terminando no Domingo. Todo o conteúdo estará disponível a partir da data de início. Para começar o curso, você deve ler o Guia do Aluno e o Plano de Ensino a seguir.

OBJETIVO

Capacitar o usuário para o desenvolvimento de páginas Web considerando as diretrizes básicas de acessibilidade.

PÚBLICO ALVO

Webdesignes ou programadores que desejam produzir um conteúdo Web acessível.

PRÉ-REQUISITOS

Os usuários deverão ser, necessariamente, funcionários públicos e ter conhecimentos básicos para operar um computador. Conhecimento inicial de HTML e CSS também são requeridos.

DESCRIÇÃO

O curso será realizado na modalidade Educação a Distância e utilizará a Plataforma Moodle como ferramenta de aprendizagem. O curso tem duração de uma semana e possui um conjunto de atividades (lições, fóruns, glossários, questionários e outros) que deverão ser executadas de acordo com as instruções fornecidas. O material didático está disponível on-line de acordo com as datas pré-estabelecidas em cada tópico. O avaliador adotado é o "da Silva", disponível na página .

METODOLOGIA

O curso está dividido da seguinte maneira:

Cronograma	Descrição das atividades
Primeira semana	Lição 1 - Introdução; Lição 2 - Projeto inicial de uma página acessível; Lição 3 - Testando a sua página; Lição 4 - acessibilidade em softwares existentes.
Segunda semana	Lição 5 - Técnicas, parte 1; Lição 6 - Técnicas, parte 2; Lição 7 - Técnicas, parte 3;
Segunda semana, Quinta-Feira a Domingo	Avaliação final Avaliação do curso

As lições contém o contéudo principal. Elas poderão ser acessadas quantas vezes forem necessárias, desde que esteja dentro da semana programada. Ao final de uma lição, você receberá uma nota de acordo com o seu desempenho. Responda com atenção às perguntas de cada lição, pois elas serão consideradas na sua nota final. Caso sua nota numa determinada lição for menor do que 6.0, sugerimos que você faça novamente esta lição.

Ao final do curso será disponibilizada a avaliação referente ao curso. Tanto as notas das lições quanto a da avaliação serão consideradas para a nota final. Todos os módulos ficarão visíveis para que possam ser consultados durante a avaliação final.

Aconselhamos a leitura da "Ambientação do Moodle" para que você conheça a plataforma de Ensino a Distância, evitando dificuldades advindas do "desconhecimento" sobre a mesma.

Os instrutores estarão a sua disposição ao longo de todo curso. Qualquer dúvida deverá ser enviada no fórum. Diariamente os monitores darão respostas e esclarecimentos.

PROGRAMA

O curso Acessibilidade oferecerá o seguinte conteúdo:

Introdução à Acessibilidade Web;
Projetando e testando uma página acessível;
Acessibilidade em softwares no mercado;
Técnicas para um WebDesign acessível.

AVALIAÇÃO

Toda a avaliação será feita on-line.

Aspectos a serem considerados na avaliação:

Iniciativa e autonomia no processo de aprendizagem e de produção de conhecimento;
Capacidade de pesquisa e abordagem criativa na solução de problemas apresentados.

Instrumentos de avaliação:

Participação ativa nas atividades programadas.
Avaliações dentro das lições.
Avaliação ao final do curso.

Ao final do curso, o participante fará a avaliação final referente a todo o conteúdo do curso. Para a aprovação e obtenção do certificado o participante deverá obter nota final maior ou igual a 6.0 de acordo com a fórmula abaixo:

Nota Final = ((ML x 7) + (AF x 3)) / 10

ML = Média aritmética das lições
AF = Avaliação final

Sua participação será importante em todas as atividades propostas.

REFERÊNCIAS BIBLIOGRÁFICAS

Página oficial do Acessibilidade Brasil: http://www.acessobrasil.org.br/
Página oficial do WAI: http://www.w3.org/WAI/
Apostila do Curso Estuda Silva, Acessibilidade Brasil.
Símbolo de Acessibilidade à Web: http://ncam.wgbh.org/webaccess/symbolwinner.html
Curso de Acessibilidade, CDTC: http://www.cursos.cdtc.org.br

Marcadores: accessible, acessibilidade, curso, e-learning, WAI, Web Accessibility Initiative

¶ 10:34 0 comments

29.5.07

Acessibilidade na Web: Custo ou Benefício?

Vídeo - Acessibilidade na Web: Custo ou Benefício?

A acessibilidade no desenvolvimento de sites não é uma concessão, um ato de boa vontade para com usuários com necessidades específicas: é uma visão estratégica e lucrativa.

Imagine o site de uma loja ou de um banco construídos sem a acessibilidade adequada: uma pessoa com deficiência ou com qualquer tipo de dificuldade de acesso - potenciais clientes - estarão automaticamente excluídos. E o que dizer dos sites de serviços públicos?

Esse vídeo de 12 minutos sobre a Acessibilidade Web, mostra algumas das principais barreiras de diversos sites e suas soluções. Conheça na íntegra esse projeto e baixe o vídeo em um dos formatos disponíveis no link abaixo:

Vídeo: "Acessibilidade na Web: Custo ou Benefício?"

Acessibilidade, web Standards, Usabilidade.

Acessibilidade de verdade é a soma de acessibilidade + web standards + usabilidade. Desenvolvemos uma metodologia que vai além da acessibilidade, pois leva em conta o contexto social.

Achei genial e emocionante a idéia, estou procurando como partipar e ajudar nesse projeto :) QUERO ENTRAR NESSE TIME!

LINKS:

Marcadores: accessible, acessibilidade, WAI, Web Accessibility Initiative

¶ 16:51 2 comments