Aplicativos web acessíveis usando HTML5 e ChromeVox

16/9/2011 13:03:58 - Fábio Ferreira de Souza

Resumo da palestra de Rachel Shearer: “Como tornar seus aplicativos da web acessíveis usando HTML5 e ChromeVox

Nem todo mundo, consegue enxergar direito, então recursos de audio, ou mesmo zoom podem ser importante.
E também há pessoas que não podem mexer no mouse, e é preciso ter um site acessivel apenas via teclado

Dicas Gerais

  • Use seções logicas, user header (h1, h2, p…)
  • Não criar controles Ajax(dom) complexos carregados ao final ou em outro local
  • Use tags HTML nativos, não use “span onclick=…” , “div onclick=…” para ações, isso não gera foco de ação
  • Use as tags novas HTML “button”
  • Use a TAG “label for…” para associar aos dados de input
  • Todas imagens precisam ter o ALT, se não os narradores irão falar o nome do arquivo de imagem
  • Manipule o foco de forma correta, ajude a navegação e a experiência do usuário
  • Use atalhos de navegação, teclas de navegação, simplifique de forma direta uma ação
  • Os narradores tem problemas para narrar os DIV e SPAN por causa da ordem de aparição dos CSS, use o atributo “tabindex” para que ordenar da forma da leitura
  • Use teclas padrão para a navegação
  • Use o atributos “role” e “aria”

Ferramentas de Recursos

  • Chromevox
  • ChromeShades
  • VoiceOver
  • NVDA
  • Dojo

Experimente navegar em seu site sem mouse!