Criando aplicações acessíveis em React Native

Referências:

- https://facebook.github.io/react-native/docs/accessibility

- https://www.businessofapps.com/data/app-statistics/#targetText=As%20of%20the%20first%20quarter,from%20178%20billion%20in%202017

- https://www.bankmycell.com/blog/how-many-phones-are-in-the-world#targetText=According%20to%20Statista%2C%20there%20is,population%20have%20a%20smartphone%20today

- https://bluebadgestyle.com/2017/11/smartphones-evolved-help-people-disabilities/

Transcript

1. Criando aplicações acessíveis em React Native
2. Oi, eu sou a Rita! Caiçara Desenvolvedora Front-End na Creditas Idealizadora da comunidade "Mulheres na Tecnologia Baixada Santista" @ritalinux @rita-lino
4. permanente - cegos - surdos - mudos
5. permanente temporária - cegos - surdos - mudos - braço quebrado - catarata - infecção no ouvido
6. permanente temporária situacional - cegos - surdos - mudos - braço quebrado - catarata - infecção no ouvido - idioma diferente - bebê no colo
7. Acessibilidade não é sobre deficiências.
8. Acessibilidade é sobre universalidade.
9. 5 bilhões de usuários mobile
10. 5 bilhões de usuários mobile 2,7 bilhões usam um smartphone
11. 5 bilhões de usuários mobile 2,7 bilhões usam um smartphone 90% do nosso tempo no celular é gasto em apps
12. pagar uma conta
13. pagar uma conta pedir comida
14. pagar uma conta traduzir palavras pedir comida
15. pagar uma conta traduzir palavras pedir comida interagir com outras pessoas
16. E se eles não forem acessíveis?
17. Excluímos 1 bilhão de pessoas no mundo inteiro
19. Acessibilidade + Mobile
20. Interface
22. Use <ScrollView> content content <ScrollView>
23. Use layouts verticais sempre que possível
24. allowFontScaling Padrão "true"
25. Contraste: preste atenção nas cores! mínimo: 4.5:1
26. Suporte orientação vertical e horizontal
27. AndroidManifest.xml > Abra o projeto no Xcode > Selecione o nome do projeto > General > Deployment Info
28. Teste em conexões diferentes
30. Código
31. accessible={true} Android / iOS
33. accessibilityLabel Android / iOS
35. accessibilityHint Android / iOS
37. accessibilityRole Android / iOS button / link / search / imagebutton / menu / checkbox / progressbar / ( . . . )
39. accessibilityStates Android / iOS selected / disabled / checked / unchecked / busy / expanded / collapsed
41. accessibilityLiveRegion Android none / polite / assertive
43. API AccessibilityInfo
44. isScreenReaderEnabled() isGrayscaleEnabled() isInvertColorsEnabled() isReduceMotionEnabled() isBoldTextEnabled() addEventListener() removeEventListener()
45. Como testar
46. TalkBack Accessibility Scanner VoiceOver
47. Exemplo de uso do TalkBack
48. Exemplo de uso do Accessibility Scanner
49. O melhor teste é aquele com o usuário final
50. Acessibilidade não é privilégio. Acessibilidade é direito.
51. Obrigada! @ritalinux @rita-lino Temos vagas! jobs.kenoby.com/creditas
52. - https://facebook.github.io/react-native/docs/accessibility - https://www.businessofapps.com/data/app-statistics/#targetText=As%20of%20the%20firs t%20quarter,from%20178%20billion%20in%202017 - https://www.bankmycell.com/blog/how-many-phones-are-in-the-world#targetText=Ac cording%20to%20Statista%2C%20there%20is,population%20have%20a%20smartphone%20t oday - https://bluebadgestyle.com/2017/11/smartphones-evolved-help-people-disabilities/ Referências