Criar aplicativos de tela acessíveis

  • Artigo

Um aplicativo de tela acessível permitirá que os usuários com deficiências visuais, auditivas e outras possam usar o aplicativo com êxito. Além de ser um requisito para muitos governos e organizações, seguir as diretrizes abaixo aumenta a facilidade de uso para todos os usuários, independentemente das suas habilidades.

Use o Verificador de Acessibilidade para ajudar a examinar possíveis problemas de acessibilidade em seu aplicativo.

Layout e cores

O senso comum e designs descomplicados ajudam a tornar os aplicativos mais acessíveis a todos os usuários. Ao realizar personalizações avançadas dos aplicativos, considere as sugestões abaixo. Os temas do Power Apps foram criados para atender aos padrões de acessibilidade.

  • Verifique se todos os elementos estão claramente visíveis e se o tamanho do texto é adequado. Todo o conteúdo deve ser lido e entendido com facilidade a olho nu.
  • Verifique se os elementos de entrada estão rotulados na tela. A propriedade AccessibleLabel define o que o leitor de tela anunciará.
  • Para personalizar cores, garanta que a taxa de contraste do texto com o plano de fundo seja de 4.5:1 ou superior. As ferramentas de software que ajudam nesse processo estão disponíveis.
  • Verifique se o layout segue um fluxo lógico na leitura de cima para baixo e da esquerda para a direita.
  • Crie um aplicativo responsivo para que usuários com visão subnormal possam ampliar e usá-lo sem rolar a tela para frente e para trás.

Teclado

Ao testar a acessibilidade do aplicativo, verifique se ele pode ser usado apenas pelo teclado, com ou sem um leitor de tela.

A tecla Tab deve navegar até elementos interativos em ordem lógica. Você pode criar isso com uma estrutura lógica de aplicativo e definindo a propriedade TabIndex de cada controle de acordo.

  • Controles Rótulo, Imagem, Ícone e Forma: defina TabIndex como 0 se eles tiverem de ser interativos. Caso contrário, defina TabIndex como -1.
  • Não defina TabIndex com um valor maior que zero.
  • Verifique se a configuração do aplicativo Índice de tabulação simplificado está habilitada.

Leitores de tela

Confirmamos que os seguintes leitores de tela funcionam com o Power Apps:

  • JAWS: Microsoft Edge
  • Narrador: Microsoft Edge
  • NVDA: Google Chrome, Firefox
  • TalkBack: Google Chrome, Power Apps móvel
  • VoiceOver: Power Apps móvel, Safari (macOS, iOS, iPadOS)

Para garantir uma experiência satisfatória com o leitor de tela, é recomendável:

  • Verifique se todos os controles de entrada têm a propriedade AccessibleLabel definida.
  • No caso de imagens, defina AccessibleLabel com uma descrição apropriada.
    • Se uma imagem não for usada como botão ou link (ou seja, o ícone tiver função apenas decorativa) e não dever ser lida pelo leitor de tela, verifique se o AccessibleLabel está vazio ou não definido.
    • Se uma imagem ou ícone for usado como botão, defina TabIndex como 0 e AccessibleLabel como a descrição do link.

Tipo e estrutura de controle

Usar os controles certos e agrupá-los ajudará os usuários de leitores de tela a entender a estrutura do aplicativo.

Multimídia

Verifique se todos os vídeos têm legenda e se uma transcrição de todas as gravações de áudio está disponível para o usuário. O controle Vídeo dá suporte a legendas ocultas no formato WebVTT por meio da propriedade ClosedCaptionsUrl.

Com o leitor de tela habilitado, o Temporizador não anuncia o botão de texto, mas sim quanto tempo passou. Os anúncios não podem ser desativados, mesmo que o temporizador seja ocultado com baixa opacidade.

Trabalhar com assinaturas

Se você tiver um campo de assinatura que use o controle PenInput, precisará habilitar um método alternativo de entrada de assinatura. A maneira recomendada é mostrar um controle TextInput em que o usuário possa digitar seu nome. Verifique se as instruções de assinatura estão presentes na propriedade AccessibleLabel e se o controle está presente na entrada à caneta – à direita ou logo abaixo.

Próximas etapas

Estrutura de aplicativo acessível

Confira também