Web acessível

Sumário

• Introdução

o O que é acessibilidade?

o A quem se destina?

• Acessibilidade na Web

• WCAG

o Princípios

o Recomendações

› Níveis de prioridade

• Validação

• Bibliografia

O que é acessibilidade?

• Segundo a legislação brasileira:

Acessibilidade é condição para utilização, com segurança e autonomia,

total ou assistida, dos espaços, mobiliários e equipamentos urbanos, das

edificações, dos serviços de transporte e dos dispositivos, sistemas e

meios de comunicação e informação, por pessoa com deficiência ou

com mobilidade reduzida.

DECRETO Nº 5.296 DE 2 DE DEZEMBRO DE 2004.

https://www.planalto.gov.br/ccivil_03/_Ato2004-

2006/2004/Decreto/D5296.htm

O que é acessibilidade?

• Segundo a WAI(Web Accessibility Initiative):

Acessibilidade na Web significa que pessoas com deficiências podem

perceber, entender, navegar e interagir além de poder contribuir para a web.

O que é acessibilidade?

Acessibilidade na web diz respeito à facilidade de acesso, por

qualquer pessoa, independente de condições físicas, técnicas ou

dispositivos.

A quem se destina?

Acessibilidade é

para todos

A quem se destina?

• Deficientes visuais

o Cegos: Pessoas que navegam com leitores de tela

o Daltônicos: Dificuldade em enxergar cores e contrastes

o Baixa visão: Necessidade de aumento de tela para ler

• Deficientes auditivos

o Pessoas que não conseguem acompanhar um vídeo na internet com áudio.

• Deficientes motores

o Pessoas que utilizam o computador com apenas um dedo (ou nem isso) ou

que tenham dificuldades com o uso do mouse.

A quem se destina?

• Displays reduzidos

o Acessando a internet por um telefone celular.

• Deficiência temporária

o Pessoas obrigadas a usar o computador com sua outra mão devido a fraturas,

tendinite, etc.

• Início de aprendizado

o Pessoas que estão iniciando seu processo de informatização ou crianças

descobrindo o computador.

• Idade avançada

o Pessoas mais velhas, com dificuldades para ler letras pequenas e usar do mouse.

A quem se destina?

Fazer um site acessível não é só se preocupar com um

determinado grupo de pessoas: É se preocupar com

todas as pessoas que acessam seu site.

Acessibilidade na Web

Os desenvolvedores de páginas Web devem levar em consideração

diferentes situações ao criar uma página. A Web pode ser utilizada por

pessoas que:

• sejam incapazes de ver, ouvir, se deslocar, ou interpretar determinados

tipos de informações;

• tenham dificuldade em ler ou compreender textos;

• não tenham um teclado ou mouse, ou não sejam capazes de utilizá-los;

• possuam tela que apresenta apenas texto, ou com dimensões

reduzidas, ou ainda uma conexão lenta com a Internet;

Acessibilidade na Web

Os desenvolvedores de páginas Web devem levar em consideração

diferentes situações ao criar uma página. A Web pode ser utilizada por

pessoas que:

• não falem ou compreendam fluentemente o idioma em que o

documento foi escrito;

• estejam com seus olhos, mãos ou ouvidos ocupados (por exemplo em

um ambiente barulhento ou fora de casa ou do trabalho);

• possuam uma versão ultrapassada de navegador web, diferente dos

habituais, um navegador por voz, ou um sistema operacional pouco

convencional.

WCAG 1.0

Web Content Accessibility Guidelines

• É uma recomendação W3C de 5 de maio de 1999

• As recomendações explicam como tornar o conteúdo Web acessível a pessoas

com deficiências.

No entanto, faz também com que o conteúdo da Web se torne de mais fácil acesso

a todos os usuários:

• independentemente da ferramenta usada (computadores de mesa, laptops,

telefones celulares, ou navegador por voz) e das

• limitações associadas ao respectivo uso (ambientes barulhentos, salas mal

iluminadas ou com excesso de iluminação, utilização sem o uso das mãos).

WCAG 2.0

• É uma recomendação W3C de 11 Dezembro de 2008

• Os critérios de sucesso do WCAG 2.0 são escritos como declarações

testáveis, que não são especificamente tecnológicas.

• As WCAG 2.0 foram desenvolvidas através do processo W3C em

colaboração com pessoas e organizações em todo o mundo, com o

objetivo de elaborar um padrão compartilhado referente à acessibilidade

para o conteúdo da Web, que satisfaça as necessidades das pessoas, das

organizações e dos governos, a nível internacional.

Níveis de Abordagem das WCAG 2.0

• Princípios - os principais princípios que constituem a fundação da

acessibilidade da Web: perceptível, operável, compreensível e robusto.

• Recomendações - apresentam os objetivos básicos que os

desenvolvedores devem atingir para tornar o conteúdo mais acessível aos

usuários com diferentes incapacidades.

• Critérios de Sucesso - para satisfazer as necessidades dos diferentes

grupos e situações, são definidos três níveis de conformidade:

o A (o mais baixo), AA e AAA (o mais elevado).

Princípio 1: Perceptível

A informação e os componentes da interface do usuário têm de ser apresentados aos usuários em formas que eles possam perceber

• Alternativas em Texto: Fornecer alternativas em texto.

o Atributo “alt”?

• Mídias com base no tempo: Fornecer alternativas para mídias com base no tempo.

o Legendas e descrição do conteúdo sonoro

• Adaptável: Criar conteúdos que possam ser apresentados de diferentes maneiras (por ex., um layout mais simples) sem perder informação ou estrutura.

o CSS para impressão (print) e telas menores (handheld)

Princípio 2: Operável

Os componentes de interface de usuário e a navegação têm de ser operáveis

• Acessível por Teclado: Fazer com que toda a funcionalidade fique disponível a partir do teclado.

o Estruturação do conteúdo

• Ataques Epilépticos: Não criar conteúdo de uma forma conhecida que possa causar ataques epilépticos.

o Evitar piscar de telas

• Navegável: Fornecer formas de ajudar os usuários a navegar, localizar conteúdos e determinar o local onde estão.

o Finalidade do link (contexto)

Princípio 3: Compreensível

A informação e a utilização da interface de utilizador têm de ser

compreensíveis.

• Legível: Tornar o conteúdo de texto legível e compreensível.

o Identificação do idioma, abreviaturas, etc.

• Previsível: Fazer com que as páginas Web surjam e funcionem de forma

previsível.

o Evitar que links abram novas janelas sem que o usuário saiba.

Princípio 4: Robusto

O conteúdo deve ser suficientemente robusto para ser interpretado de

forma fiável por uma ampla variedade de agentes de utilizador,

incluindo as tecnologias de apoio.

• Compatível: Maximizar a compatibilidade com atuais e futuros agentes de

usuário, incluindo tecnologias assistivas.

o Evitar elementos em desuso das tecnologias do W3C

Recomendações

As recomendações da W3C foram divididas em 3 prioridades:

• Prioridade 1 - O que os desenvolvedores web DEVEM satisfazer;

• Prioridade 2 - O que os desenvolvedores web DEVERIAM satisfazer;

• Prioridade 3 - O que os desenvolvedores web PODEM satisfazer;

Recomendação 1

• Fornecer alternativas ao conteúdo sonoro e visual

o Utilizar "alt" para os elementos IMG, INPUT e APPLET ou fornecer um

equivalente textual como parte do conteúdo dos elementos OBJECT e APPLET.

• Exemplos:

<img src=“imagem.jpg" alt="Foto do Arco do Triunfo">

<applet alt=“Descrição do aplicativo"></applet>

<input type="image" src=“enviar.png" value="Enviar" alt="Enviar dados">

Recomendação 1

<img src="logos.gif" alt="Logotipos" border="0" usemap="#Map">

<map name="Map">

<area shape="circle" coords="79,105,58" href="logo-01.htm" alt="Página do Logo 01">

<area shape="circle" coords="211,221,58" href="logo-02.htm" alt="Página do Logo 02">

</map>

Recomendação 2

• Não recorrer apenas à cor

o Clique no botão vermelho para continuar:

o Clique no número 3 para continuar:

• Indicar claramente qual o idioma utilizado

o Identificar claramente quaisquer mudanças de idioma no texto de um

documento, bem como nos equivalentes textuais (por ex., legendas).

HTML:

<html lang="pt-br">

XHTML:

<html xml:lang="pt-br“>

HTML (acrônimo para a expressão inglesa <span lang=“en”>HyperText Markup Language</span>, que

significa Linguagem de Marcação de Hipertexto) é uma linguagem de marcação utilizada para produzir

páginas na Web. Documentos HTML podem ser interpretados por navegadores. A tecnologia é fruto do

"casamento" dos padrões <span lang=“en”> HyTime</span> e SGML.

Recomendação 3

Recomendação 4

• Criar tabelas passíveis de transformação harmoniosa

o Em tabelas de dados com dois ou mais níveis lógicos de cabeçalhos de linha ou

de coluna, utilizar marcações para associar as células de dados às células de

cabeçalho.

Recomendação 5

• Assegurar que as páginas dotadas de novas tecnologias sejam transformadas

harmoniosamente

o Organizar os documentos de tal forma que possam ser lidos sem recurso a folhas de

estilo.

Recomendação 6

• Assegurar a clareza e a simplicidade dos documentos

○ Utilizar linguagem mais clara e simples possível, adequada ao conteúdo do

site.

Um site com linguagem clara facilita a possibilidade de aprofundamento

do usuário em seu conteúdo.

o Complementar o texto com apresentações gráficas ou sonoras;

Validação

• A validação da acessibilidade deve ser feita por meio de ferramentas

automáticas e da revisão direta. Os métodos automáticos são

geralmente rápidos, mas não são capazes de identificar todas as

variantes da acessibilidade.

• A avaliação humana pode ajudar a garantir a clareza da linguagem e a

facilidade da navegação.

Validação

1 - Utilizar uma ferramenta de acessibilidade automatizada, e uma

ferramenta de validação de navegadores.

2 - Validar a sintaxe (por ex., HTML, XML).

o http://validator.w3.org/

3 - Validar as folhas de estilo (por ex., CSS).

○http://jigsaw.w3.org/css-validator/

4 - Utilizar um navegador exclusivamente textual ou um emulador.

Validação

5 - Utilizar vários navegadores gráficos, com:

o som e gráficos ativos;

o sem gráficos;

o sem som;

o sem mouse;

o sem carregar frames, programas interpretáveis, folhas de estilo ou applets.

6 - Utilizar vários navegadores, antigos e recentes.

7 - Utilizar um navegador de emissão automática de fala, um leitor de tela,

software de ampliação, uma tela de pequenas dimensões.

Validação

8 - Utilizar corretores ortográficos e gramaticais. A eliminação de problemas

gramaticais aumenta o grau de compreensão.

9 - Rever o documento, verificando sua clareza e simplicidade.

10 - Peça a pessoas com deficiências que revejam os documentos.

Web acessível na prática

Bibliografia

• BARBOSA, S. J.; SILVA B. S. Interação Humano-Computador. Rio de Janeiro: Elsevier, 2010.

• http://www.maujor.com/tutorial/acessibilidade/tentest.php

• http://www.w3c.br/palestras/2009/conip2009/slidy/template.html

• http://www.w3.org/WAI/

• http://www.w3.org/Translations/WCAG20-pt-PT/#guidelines