Você está na página 1de 31

WWW. DOMI NANDOTI . COM.

BR
WWW. DOMI NANDOTI .COM. BR
Acessibilidade Web
Conceitos bsicos, WCAG e e-Mag
Professor Gledson Pompeu gledson@dominandoti.com.br
WWW. DOMI NANDOTI . COM. BR
Conceitos bsicos
Acessibilidade diz respeito a:
Locais, produtos, servios ou informaes efetivamente
disponveis ao maior nmero e variedade possvel de pessoas
Independentemente de suas capacidades fsico-motoras e
perceptivas, culturais e sociais.
Isto requer:
Eliminao de barreiras arquitetnicas
Disponibilidade de comunicao, de acesso fsico, de
equipamentos e programas adequados
Disponibilidade de contedo e apresentao da informao
em formatos alternativos
Professor Gledson Pompeu gledson@dominandoti.com.br 2
WWW. DOMI NANDOTI . COM. BR
Legislao Brasileira
Decreto 5.296, de 2 de dezembro de 2004,
regulamenta:
Lei 10.048, de 8 de novembro de 2000, que d prioridade de
atendimento s pessoas que especifica
Lei 10.098, de 19 de dezembro de 2000, que estabelece
normas gerais e critrios bsicos para a promoo da
acessibilidade das pessoas com necessidades especiais, e d
outras providncias
Professor Gledson Pompeu gledson@dominandoti.com.br 3
WWW. DOMI NANDOTI . COM. BR
Decreto 5.296
Art. 8o Para os fins de acessibilidade, considera-se:
I - acessibilidade: condio para utilizao, com segurana e
autonomia, total ou assistida, dos espaos, mobilirios e
equipamentos urbanos, das edificaes, dos servios de
transporte e dos dispositivos, sistemas e meios de comunicao
e informao, por pessoa portadora de deficincia ou com
mobilidade reduzida;
II - barreiras: qualquer entrave ou obstculo que limite ou
impea o acesso, a liberdade de movimento, a circulao com
segurana e a possibilidade de as pessoas se comunicarem ou
terem acesso informao
Professor Gledson Pompeu gledson@dominandoti.com.br 4
WWW. DOMI NANDOTI . COM. BR
Decreto 5.296
Art. 47. No prazo de at doze meses a contar da data de
publicao deste Decreto, ser obrigatria a
acessibilidade nos portais e stios eletrnicos da
administrao pblica na rede mundial de computadores
(internet), para o uso das pessoas portadoras de
deficincia visual, garantindo-lhes o pleno acesso s
informaes disponveis.
Professor Gledson Pompeu gledson@dominandoti.com.br 5
WWW. DOMI NANDOTI . COM. BR
Acessibilidade em TI
Acesso ao computador sem mouse
Pessoas com deficincia visual, dificuldade de controle dos
movimentos, paralisia ou amputao de um membro superior.
Acesso ao computador sem teclado
Pessoas com amputaes, grandes limitaes de movimentos
ou falta de fora nos membros superiores.
Interao atravs de um perifrico especial de
reconhecimento da fala ou de um emulador de teclado na tela
Professor Gledson Pompeu gledson@dominandoti.com.br 6
WWW. DOMI NANDOTI . COM. BR
Acessibilidade em TI
Acesso ao computador sem monitor
A informao processada por um computador no de
natureza visual
Para obter a informao que projetada na tela, os
deficientes visuais recorrem a softwares (programas leitores
de tela) que a enviam para sintetizadores de voz ou terminais
Braille
Acesso ao computador sem udio
Pessoas com baixa audio e pessoas com surdez completa.
Professor Gledson Pompeu gledson@dominandoti.com.br 7
WWW. DOMI NANDOTI . COM. BR
Construindo um Web Site Acessvel
O trabalho requerido para construir um Web site
acessvel depende de vrios fatores, entre eles:
o tipo de contedo
o tamanho e a complexidade do site
as ferramentas e o ambiente de desenvolvimento
Muitos dos aspectos da acessibilidade sero
facilmente implementados se forem planejados antes
do incio do desenvolvimento ou redesign
Adaptar sites existentes pode demandar uma quantidade
considervel de trabalho e esforo
Professor Gledson Pompeu gledson@dominandoti.com.br 8
WWW. DOMI NANDOTI . COM. BR
Acessibilidade na Web
O W3C criou o WAI (Web Accessibility Initiative)
O WAI mantm grupos de trabalho e diretrizes para
garantir a acessibilidade do contedo da Web
pessoas com necessidades especiais
condies especiais de ambiente, equipamento, navegador e
outras ferramentas Web
Diretrizes para a Acessibilidade do Contedo da Web
(WCAG)
Principal referncia em termos de acessibilidade na Web
Professor Gledson Pompeu gledson@dominandoti.com.br 9
WWW. DOMI NANDOTI . COM. BR
Diretrizes de acessibilidade ao contedo da Web
Explicam como produzir contedos para a Web que
sejam acessveis s pessoas portadoras de
necessidades especiais
Genericamente, "contedo" da Web refere-se informao
contida em uma pgina web ou uma aplicao Web
Inclui textos, imagens, formulrios, sons e correlatos
WCAG parte de uma srie de diretrizes para
acessibilidade, incluindo:
Diretrizes para ferramentas de produo (ATAG)
Diretrizes para agentes de usurios (UAAG)
Professor Gledson Pompeu gledson@dominandoti.com.br 10
WWW. DOMI NANDOTI . COM. BR
Recomendaes de acessibilidade (WCAG 2.0)
Perceptvel
Fornecer alternativas textuais para qualquer contedo no textual,
permitindo que possa ser alterado, se necessrio, para outros formatos
Fornecer Alternativas para mdias baseadas no tempo
Criar contedo que pode ser apresentado de modos diferentes (por
exemplo um layout simplificado) sem perder informao ou estrutura
Tornar mais fcil aos usurios a visualizao e audio de contedos
incluindo as separaes das camadas da frente e de fundo
Opervel
Fazer com que todas as funcionalidades estejam disponveis no teclado
Prover tempo suficiente para os usurios lerem e usarem o contedo
No projetar contedo de forma conhecida por causar ataques epilticos
Prover formas de ajudar os usurios a navegar, localizar contedos e
determinar onde se encontram
Professor Gledson Pompeu gledson@dominandoti.com.br 11
WWW. DOMI NANDOTI . COM. BR
Recomendaes de acessibilidade (WCAG 2.0)
Compreensvel
Tornar o contedo de texto legvel e compreensvel
Fazer com que as pginas da Web apaream e funcionem de
modo previsvel
Ajudar os usurios a evitar e corrigir erros
Robusto
Maximizar a compatibilidade entre os atuais e futuros agentes
do usurio, incluindo as tecnologias assistivas
Professor Gledson Pompeu gledson@dominandoti.com.br 12
WWW. DOMI NANDOTI . COM. BR
Componentes essenciais para Acessibilidade Web
Contedo
Informao contida em uma pgina ou aplicao Web
Navegadores Web, players de mdia, e outros "agentes de usurio"
Tecnologias auxiliares (assistivas)
Leitores de tela, teclados alternativos, softwares de varredura etc.
Usurios, conhecimento, experincia e em alguns casos estratgias
adaptadas para uso da Web
Desenvolvedores
Designers, programadores, autores, etc., incluindo desenvolvedores
portadores de necessidades especiais e usurios com suas contribuies
Ferramentas de criao
Software para criao de Web sites
Ferramentas de aperfeioamento
Ferramentas de acessibilidade, validadores de HTML, validadores de CSS, etc.
Professor Gledson Pompeu gledson@dominandoti.com.br 13
WWW. DOMI NANDOTI . COM. BR
Como os Componentes se relacionam
Desenvolvedores Web normalmente usam
ferramentas de criao
ferramentas de aperfeioamento
para criar contedo Web
Pessoas ("usurios") usam
navegadores Web
players de mdia
tecnologias assistivas
outros "agentes de usurio"
para acessar e interagir com o contedo.
Professor Gledson Pompeu gledson@dominandoti.com.br 14
WWW. DOMI NANDOTI . COM. BR
Como os Componentes se relacionam
Professor Gledson Pompeu gledson@dominandoti.com.br 15
WWW. DOMI NANDOTI . COM. BR
Modelo de Acessibilidade de Governo Eletrnico
A verso 2.0 do e-MAG previa a separao de duas vises
Esta separao foi eliminada na verso 3.0 (agosto/2011)
Viso Tcnica
Cartilha de recomendaes prticas para a construo e/ou
adaptao de stios eletrnicos
A Viso Tcnica voltada ao desenvolvedor, pessoa que far as
alteraes nos cdigos dos stios eletrnicos
Viso do Cidado
Arquitetura de segmentao da Viso Tcnica
A Viso do Cidado proporciona uma orientao e compreenso
mais lgica e intuitiva do modelo propriamente dito e da Viso
Tcnica
Professor Gledson Pompeu gledson@dominandoti.com.br 16
WWW. DOMI NANDOTI . COM. BR
Viso do cidado (e-mag 2.0)
A Viso do Cidado uma arquitetura de abstrao e
entendimento das Recomendaes de Acessibilidade
Caracteriza e detalha as necessidades de acessibilidade com foco
no cidado
Separa os princpios de acessibilidade percebidos em reas, as
quais denotam um tipo especfico de benefcio
reas de Acessibilidade compreendidas na Viso do
Cidado:
rea da Percepo
rea da Operao
rea do Entendimento
rea da Compatibilidade
Professor Gledson Pompeu gledson@dominandoti.com.br 17
WWW. DOMI NANDOTI . COM. BR
Viso do cidado (e-mag 2.0)
A rea da Percepo trata de benefcios relacionados
apresentao do contedo, da informao
Preocupa-se com a percepo de elementos como grficos,
sons, imagens, multimdia e equivalentes
A rea da Operao preocupa-se com a manipulao
da informao, do contedo
Garantir formas alternativas ao acesso s informaes atravs
de maneiras diferenciadas de navegao ou tcnica similar
Garantir sempre ao usurio o controle da navegao e
interao com o stio
Professor Gledson Pompeu gledson@dominandoti.com.br 18
WWW. DOMI NANDOTI . COM. BR
Viso do cidado (e-mag 2.0)
A rea do Entendimento trata de questes
relacionadas compreenso do contedo publicado
Garantir que todo o contedo apresentado seja de fcil
compreenso para qualquer tipo de usurio
A rea da Compatibilidade aborda questes como a
necessidade de utilizar-se sempre tecnologias
acessveis e compatveis com o modelo proposto
Professor Gledson Pompeu gledson@dominandoti.com.br 19
WWW. DOMI NANDOTI . COM. BR
Processo de acessibilidade (e-mag 2.0)
O processo ocorre em cinco etapas:
Verificao da necessidade de acessibilidade do contedo
Tornar acessvel o contedo
Validao da acessibilidade do contedo
Validao automtica (softwares especficos)
Validao por tcnicos de desenvolvimento
Validao por indivduos com necessidades especiais
Promoo da acessibilidade conquistada
Selo de acessibilidade (nveis A, AA e AAA)
Garantia contnua da acessibilidade
20
WWW. DOMI NANDOTI . COM. BR
Acessibilidade evolutiva (e-mag 2.0)
Nvel de Acessibilidade de Prioridade 1
Exigncias bsicas de acessibilidade.
Pontos que precisam ser satisfeitos obrigatoriamente pelos criadores e
adaptadores de contedo Web
Se no cumpridas, grupos de usurios ficaro impossibilitados de acessar as
informaes do documento
Nvel de Acessibilidade de Prioridade 2
Normas e recomendaes de acessibilidade que sendo implementadas
garantem o acesso s informaes do documento
Se no cumpridas, grupos de usurios tero dificuldades para navegar e
acessar as informaes do documento
Nvel de Acessibilidade de Prioridade 3
Normas e recomendaes de acessibilidade que sendo implementadas
facilitaro o acesso aos documentos armazenados na Web
Se no cumpridas, grupos de usurios podero encontrar dificuldades para
acessar as informaes dos documentos armazenados na Web
Professor Gledson Pompeu gledson@dominandoti.com.br 21
WWW. DOMI NANDOTI . COM. BR
Diretrizes de acessibilidade (e-MAG 2.0)
Fornea alternativas equivalentes para o contedo grfico e
sonoro
Assegure que o stio seja legvel e compreensvel mesmo sem o
uso de formataes
D preferncia s tecnologias de marcao e formatao
Assegure que toda a informao seja interpretada corretamente,
com clareza e simplicidade
Assegure que as tecnologias utilizadas funcionem de maneira
acessvel - independente de programas e verses
Assegure o controle do usurio sobre a navegao no stio
Identifique claramente os mecanismos de navegao
Em casos no contemplados pelas diretrizes anteriores, utilize
sempre recursos reconhecidos como tecnologias acessveis
Professor Gledson Pompeu gledson@dominandoti.com.br 22
WWW. DOMI NANDOTI . COM. BR
Segmentao por tecnologia (e-mag 2.0)
Casos gerais
Casos em que so utilizados imagens e mapas de
imagem
Casos em que so utilizadas tabelas
Casos em que so utilizados frames
Casos em que so utilizados applets, objects, scripts e
programas interpretveis
Casos em que utilizada multimdia
Casos em que so utilizados formulrios
Professor Gledson Pompeu gledson@dominandoti.com.br 23
WWW. DOMI NANDOTI . COM. BR
Recomendaes de acessibilidade (e-mag 3.0)
No so divididas por nveis de prioridade
Todas so de grande importncia e devem ser seguidas
Recomendaes sobre a codificao HTML e XHTML,
divididas nas seguintes sees
Marcao
Comportamento (DOM)
Contedo/Informao
Apresentao/Design
Multimdia
Formulrio
Professor Gledson Pompeu gledson@dominandoti.com.br 24
WWW. DOMI NANDOTI . COM. BR
Processo de acessibilidade (e-mag 3.0)
Seguir os padres Web
Padres internacionais W3C
Seguir as diretrizes ou recomendaes de acessibilidade
WCAG 2.0 + e-MAG
Realizar a avaliao de acessibilidade
Validar os cdigos do contedo HTML e das folhas de estilo
Verificar o fluxo de leitura da pgina
Utilizando um navegador textual, como o Lynx, ou um leitor de tela
Verificar o fluxo de leitura da pgina sem estilos, scripts e imagens
Verificar as funcionalidades da barra de acessibilidade
Realizar a validao automtica de acessibilidade
Utilizando o ASES e outros avaliadores automticos
Realizar a validao manual, utilizando os checklists de validao humana
Professor Gledson Pompeu gledson@dominandoti.com.br 25
WWW. DOMI NANDOTI . COM. BR
Padres de acessibilidade digital no Governo
Federal (e-mag 3.0)
Elementos de acessibilidade que devem ter
caractersticas em comum em todas as pginas do
governo federal, para fins de facilitar o acesso por
pessoas com deficincia
Pgina com a descrio dos recursos de acessibilidade
Teclas de atalho
Barra de acessibilidade
Apresentao do mapa do sitio
Apresentao de formulrio
Contedo alternativo para imagens
Apresentao de documentos
Professor Gledson Pompeu gledson@dominandoti.com.br 26
WWW. DOMI NANDOTI . COM. BR
Atalhos de teclado
Atalhos para pontos estratgicos da pgina
Nmeros precedidos da tecla padro de cada
navegador (Alt no Internet Explorer, Shift + Alt no
Firefox, Shift + Esc no Opera, etc.)
Atalhos obrigatrios nas pginas do Governo Federal
<tecla+1> para ir ao contedo
<tecla+2> para ir ao menu principal
<tecla+3> para ir caixa de pesquisa
Professor Gledson Pompeu gledson@dominandoti.com.br 27
WWW. DOMI NANDOTI . COM. BR
Barra de acessibilidade
O stio dever conter uma barra de acessibilidade no
topo de cada pgina contendo os seguintes itens:
Aumentar fonte
Diminuir fonte
Fonte normal
Alto contraste
Atalhos (para Menu, Contedo e Busca)
Acessibilidade (link para a pgina contendo os recursos de
acessibilidade do stio)
Professor Gledson Pompeu gledson@dominandoti.com.br 28
WWW. DOMI NANDOTI . COM. BR
Apresentao de formulrio
Os formulrios devero estar de acordo com os seguintes itens:
Sempre utilizar a tag form, mesmo que o formulrio possua apenas um
elemento, como o caso de uma caixa para pesquisa
Disponibilizar os elementos do formulrio no HTML na ordem correta de
navegao, sem utilizar o tabindex
Associar as etiquetas (label) aos seus campos (input) correspondentes
No deve ocorrer mudana no contexto quando um elemento receber o foco
Deve ser fornecido um boto de envio (submit) para enviar os dados
Fornecer uma maneira de o usurio poder verificar as informaes antes que elas sejam
enviadas
Os erros de entrada de dados devem ser identificados e descritos ao usurio
Para cada conjunto de informaes com dois ou mais elementos de entrada de
dados, os mesmos devero ser agrupados atravs do elemento fieldset/legend
Em um formulrio de busca simples no h a necessidade de utilizar o elemento, pois
apresenta apenas um campo de entrada de dados
Professor Gledson Pompeu gledson@dominandoti.com.br 29
WWW. DOMI NANDOTI . COM. BR
Apresentao de documentos
Os documentos em texto devero ser disponibilizados
preferencialmente em HTML
Podem ser disponibilizados para download no formato ODF,
tomando-se os cuidados para que sejam acessveis
Se houver necessidade de disponibilizar arquivos em
PDF, dever ser fornecida uma alternativa em HTML ou
ODF
necessrio informar a extenso e o tamanho do
arquivo no prprio texto do link
Professor Gledson Pompeu gledson@dominandoti.com.br 30
WWW. DOMI NANDOTI . COM. BR
Elementos que no devem ser utilizados
Tabelas para fins de diagramao
Atualizaes automticas peridicas
Situaes com intermitncia de tela
Elementos considerados depreciados pelo W3C
frame, applet, blink, marquee, basefont, center, dir, align,
font, isindex, menu, strike, u, etc.
Professor Gledson Pompeu gledson@dominandoti.com.br 31