Slide usado na palestra no Software Freedom Day 2016 - Teresina

2. 17/09/2016 2
ALOHA!

3. 17/09/2016 3
ACESSIBILIDADE
O mundo virtual também precisa!
Ruan Aragão

4. 17/09/2016 4

5. 17/09/2016 5
Web developer
(Comedor de peta com café)

6. 17/09/2016 6
Precisa?

7. 17/09/2016 7

8. 17/09/2016 8
+ 45,6 milhões

9. 17/09/2016 9
~ 600 Milhões
Fonte: ONU
No mundo

10. 17/09/2016 10
Precisa?

11. 17/09/2016 11
Acessibilidade web é tornar acessível informações,
produtos e serviços para qualquer um.

12. 17/09/2016 12
Humano... ...OU não

13. 17/09/2016 13
Para qualquer um!

14. 17/09/2016 14
Você não tem controle sobre o usuário

15. 17/09/2016 15

16. 17/09/2016 16
quando?

17. Você deve adotar as técnicas de
acessibilidade como prática comum
no fluxo de desenvolvimento e
produção de conteúdo.
17/09/2016 17

18. 17/09/2016 18
Pense EM ACESSIBILIDADE DESDE O INICIO DO PROJETO
http://futurotaqui.blogspot.com.br/2013/08/acessibilidade-dentro-de-casa.html

19. 17/09/2016 19
SA VEZES OS “JEITINHOS” NÃO FUNCIONAM MUITO BEM

20. 17/09/2016 20
E PORQUE NÃO implementar?

21. Motivos de não implementar acessibilidade
●
Falta de tempo
●
Desinteresse
●
Desconhecimento
●
Deixar pra depois
●
Achar desnecessário
17/09/2016 21

22. WCAG – Web Content Accessibility Guidelines
As Diretrizes de Acessibilidade para Conteúdo Web
(WCAG) 2.0 definem a forma de tornar o conteúdo
Web mais acessível a pessoas com incapacidades. A
acessibilidade abrange um largo espectro de
incapacidades, incluindo as limitações visuais,
auditivas, físicas, cognitivas, neurológicas, ou
ainda as ligadas à fala, à linguagem ou à
aprendizagem
17/09/2016 22

23. 17/09/2016 23
Os princípios

24. Princípio 1
Perceptível – A informação e os componentes da interface de
utilizador têm de ser apresentados de forma a que os
utilizadores possam perceber.
17/09/2016 24

25. ●
Alternativas em Texto: Fornecer alternativas em texto para todo o
conteúdo não textual de modo a que o mesmo possa ser apresentado de
outras formas, de acordo com as necessidades dos utilizadores, como por
exemplo: caracteres ampliados, braille, fala, símbolos ou uma linguagem
mais simples.
●
Média Dinâmica ou Contínua: Fornecer alternativas para conteúdo em
multimédia dinâmica ou temporal.
●
Adaptável: Criar conteúdo que possa ser apresentado de diferentes
formas (por ex., um esquema de página mais simples) sem perder
informação ou estrutura.
●
Distinguível: Facilitar aos utilizadores a audição e a visão dos conteúdos
nomeadamente através da separação do primeiro plano do plano de
fundo.
17/09/2016 25

26. Princípio 2
Operável - Os componentes da interface de utilizador e a
navegação têm de ser operáveis.
17/09/2016 26

27. ●
Acessível por Teclado: Fazer com que toda a
funcionalidade fique disponível a partir do teclado.
●
Tempo Suficiente: Proporcionar aos utilizadores tempo
suficiente para lerem e utilizarem o conteúdo.
●
Convulsões: Não criar conteúdo de uma forma que se sabe
que pode causar convulsões.
●
Navegável: Fornecer formas de ajudar os utilizadores a
navegar, localizar conteúdos e determinar o local onde
estão.
17/09/2016 27

28. Princípio 3
Compreensível - A informação e a utilização da interface de
utilizador têm de ser compreensíveis.
17/09/2016 28

29. ●
Legível: Tornar o conteúdo textual legível e compreensível.
●
Previsível: Fazer com que as páginas Web apareçam e
funcionem de forma previsível.
●
Assistência na Inserção de Dados: Ajudar os utilizadores a
evitar e a corrigir os erros.
17/09/2016 29

30. 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.
17/09/2016 30

31. 17/09/2016 31
RIA

32. RIA – Rich Internet Application
Aplicações de Internet Rica, são aplicações de internet que tem
carateristicas de aplicações dektop.
17/09/2016 32

33. 17/09/2016 33
WAI-ARIA

34. WAI-ARIA
Web Accessibility Initiative – Accessibility Rich Internet Application
A WAI-ARIA vai ajudar muito em aplicações onde a informação é dividida em
várias porções na tela em diversos elementos que precisam de interação para
que a informação seja visualizada, como um clique, fazendo com que a
acessibilidade seja prejudicada e o usuário não consiga acessar todas as
partes desse layout de maneira linear.
17/09/2016 34

35. Roles, states e properties
A WAI-ARIA divide a semântica em duas partes:
●
Roles: Define que tipo de elemento o usuário está interagindo
●
States/Properties: que são suportadas pelas Roles, que definem o estado
daquele elemento
17/09/2016 35

36. Roles
Temos 4 tipos de roles:
●
Abstract: Uma definição geral, não é utilizado na marcação do conteúdo.
(ainda não entendo totalmente a função dele)
●
Widgets: Define elementos de interativos soltos, como caixas, alestas,
botões, botões, tabs e etc.
●
Document Structure: Define estrutura de organização da página,
headers, footer, sidebar e etc.
●
Landmarks: Pontos de navegação importantes como busca, conteúdo
principal, formulário e etc.
17/09/2016 36

37. Contatos:
GitHub / Twitter / Facebook / [...]:
@RuanAragao
ruanaragao.com
17/09/2016 37

38. Obrigado!