Post on 19-Mar-2016
description
1
Design Orientado as Especificações do W3C e
Acessibilidade Alexandre Junqueira
Coordenação de Comunicação Institucional – ENSP/Fiocruz
alexandrejunqueira@ensp.fiocruz.br
Design Orientado as Especificações do W3C e Acessibilidade 2
Tópicos
W3C Acessibilidade na Web As especificações XHTML e CSS
Design Orientado as Especificações do W3C e Acessibilidade 3
W3C
The World Wide Web Consortium
Design Orientado as Especificações do W3C e Acessibilidade 4
Os membros
Participam do W3C 429 membros, responsáveis por regular as tecnologias utilizadas na Web:
Adobe, Apple, Google, IBM, Intel, Microsoft, Sony, Yahoo...
Design Orientado as Especificações do W3C e Acessibilidade 5
As especificações
O W3C regulamenta as tecnologias utilizadas na Web através das especificações:
HTML, XML, XHTML, XSL, XSLT, XPATH, PNG, CSS...
Design Orientado as Especificações do W3C e Acessibilidade 6
O diretor
Tim Berners-Lee, inventor da Web e diretor do W3C.
Design Orientado as Especificações do W3C e Acessibilidade 7
O pesquisador
Tim Berners-Lee, abdicou de todo provento financeiro de sua invenção para continuar vivendo como um pesquisador.
Design Orientado as Especificações do W3C e Acessibilidade 8
Acessibilidade na Web
“O poder da Web está em sua universalidade. Ser acessada por todos, independe de deficiência, é um aspecto essencial.”
Tim Berners-Lee
Design Orientado as Especificações do W3C e Acessibilidade 9
Quem acessa a Web?
Design Orientado as Especificações do W3C e Acessibilidade 10
Cristina, surda e cega
Cristina, surda e cega, conheceu o marido em uma sala de bate-papo.
Design Orientado as Especificações do W3C e Acessibilidade 11
Lucas, paralisia cerebral
Lucas, tem paralisia cerebral, é editor de um boletim on-line.
Design Orientado as Especificações do W3C e Acessibilidade 12
Paulo, tetraplégico
Paulo, tetraplégico, projeta portais para Web.
“Quando navego na Web, ou escrevo um e-mail, não há incapacidade.”
Design Orientado as Especificações do W3C e Acessibilidade 13
Como eles acessam a Web?
Design Orientado as Especificações do W3C e Acessibilidade 14
Tecnologias assistivas
Recursos e serviços que facilitam a vida de pessoas portadoras de necessidades especiais.
Design Orientado as Especificações do W3C e Acessibilidade 15
Tecnologias assistivas
Existem diferentes tecnologias assistivas, no contexto da interação Humano-computador.
Design Orientado as Especificações do W3C e Acessibilidade 16
Tecnologias assistivas
Linhas braile permitem ao cego surdo interagir com o computador.
Design Orientado as Especificações do W3C e Acessibilidade 17
Tecnologias assistivas
Teclados braile para dispositivos móveis.
Design Orientado as Especificações do W3C e Acessibilidade 18
Tecnologias assistivas
Rastreador para interação através do movimento dos olhos.
Design Orientado as Especificações do W3C e Acessibilidade 19
Tecnologias assistivas
Rastreador para interação através do movimento da cabeça.
Design Orientado as Especificações do W3C e Acessibilidade 20
Tecnologias assistivas
Apontadorpara interação por movimentos da cabeça.
Design Orientado as Especificações do W3C e Acessibilidade 21
Tecnologias assistivas
Sistema que permite controlar o cursor com a boca.
Design Orientado as Especificações do W3C e Acessibilidade 22
Tecnologias assistivas
Esferaspara pessoas com dificuldades motoras.
Design Orientado as Especificações do W3C e Acessibilidade 23
Tecnologias assistivas
Leitores de tela com síntese de voz.
Design Orientado as Especificações do W3C e Acessibilidade 24
Normas de acessibilidade
O W3C desenvolveu normas para promover a acessibilidade na Web.
Design Orientado as Especificações do W3C e Acessibilidade 25
Leis de acessibilidade
Diversos paises, inclusive o Brasil, possuem leis de acessibilidade baseadas nas normas do W3C.
Design Orientado as Especificações do W3C e Acessibilidade 26
Testes de acessibilidade
É necessário avaliar a acessibilidade de um portal por meio de sistemas de avaliação.
Nenhum sistema de avaliação substitui os testes com usuários.
Design Orientado as Especificações do W3C e Acessibilidade 27
Laboratório
É recomendado o uso de um laboratório para realizar testes de acessibilidade e usabilidade.
Design Orientado as Especificações do W3C e Acessibilidade 28
Planta de um laboratório
SALA DE OBSERVAÇÂO
TV e monitor Computador
SALA DE TESTES
Equipamento de gravação
Equipamento de áudio
Avaliador
Usuário testado
Câmera
Design Orientado as Especificações do W3C e Acessibilidade 29
XHTML e CSS
Um novo paradigma!
Design Orientado as Especificações do W3C e Acessibilidade 30
XHTML, a evolução da HTML
Design Orientado as Especificações do W3C e Acessibilidade 31
CSS, a linguagem de design da Web
Design Orientado as Especificações do W3C e Acessibilidade 32
Conteúdo, Formatação e Dispositivo
Design Orientado as Especificações do W3C e Acessibilidade 33
Conteúdo, Formatação e Dispositivo
Design Orientado as Especificações do W3C e Acessibilidade 34
CSS Zen Garden
www.csszengarden.com
Design Orientado as Especificações do W3C e Acessibilidade 35
Design Orientado as Especificações do W3C e Acessibilidade 36
Design Orientado as Especificações do W3C e Acessibilidade 37
Design Orientado as Especificações do W3C e Acessibilidade 38
Design Orientado as Especificações do W3C e Acessibilidade 39
Design Orientado as Especificações do W3C e Acessibilidade 40
Design Orientado as Especificações do W3C e Acessibilidade 41
Design Orientado as Especificações do W3C e Acessibilidade 42
Design Orientado as Especificações do W3C e Acessibilidade 43
Design Orientado as Especificações do W3C e Acessibilidade 44
Procedimentos do design orientado as especificações do
W3C
Com XHTML e CSS.
Design Orientado as Especificações do W3C e Acessibilidade 45
Identificar as diferentes áreas de uma página
Dividir a página em áreas com o elemento <div> e identificá-las com o atributo “id”, exemplo:
<div id=“navegacao”>...</div>
Design Orientado as Especificações do W3C e Acessibilidade 46
Design Orientado as Especificações do W3C e Acessibilidade 47
Usar marcação descritiva
Usar a XHTML para descrever o conteúdo, evitando os elementos e atributos de formatação.
O elemento <font>, por exemplo, está obsoleto.
Design Orientado as Especificações do W3C e Acessibilidade 48
Respeitar a função semântica de cada elemento
Escolher os elementos adequados para descrever o conteúdo.
O elemento <table>, por exemplo, deve ser usado apenas para descrever dados tabulares.
Design Orientado as Especificações do W3C e Acessibilidade 49
Design Orientado as Especificações do W3C e Acessibilidade 50
Validar a página
A XHTML possui regras, a validação da página verifica o cumprimento destas regras.
A página precisa estar válida para ser formatada com CSS.
Design Orientado as Especificações do W3C e Acessibilidade 51
Conferir o resultado nos principais dispositivos
Design Orientado as Especificações do W3C e Acessibilidade 52
Estudar As normas de acessibilidade do W3C;
Os conceitos de usabilidade na Web;
As normas e técnicas para implementar XHTML com eficiência;
As normas e técnicas para implementar CSS com eficiência.
Design Orientado as Especificações do W3C e Acessibilidade 53
Perguntas?