Cores acessíveis para aplicativos de tela

As cores usadas no aplicativo de tela devem ser acessíveis para usuários daltônicos e com visão subnormal. Por padrão, todos os temas do Power Apps são acessíveis. Ao modificar as cores usadas em um aplicativo, siga estas diretrizes para garantir que eles permaneçam acessíveis. Há várias ferramentas disponíveis online que podem ajudá-lo a identificar problemas de contraste de cores.

Contraste mínimo do texto

  • O texto e o plano de fundo devem ter uma taxa de contraste de pelo menos 4.5:1
  • O texto grande deve ter uma taxa de contraste de pelo menos 3:1
  • O texto desabilitado não tem qualquer requisito de contraste

Em termos práticos, todos os controles interativos devem ter o contraste de cores adequado entre:

Contraste mínimo para não texto

  • Os componentes não textuais, como ícones e bordas, devem ter uma taxa de contraste de, pelo menos, 3:1 com as cores fora deles.
  • Os componentes desabilitados e decorativos não têm requisitos de contraste.

Componentes da interface do usuário

Todos os controles interativos devem ter o contraste de cores adequado entre:

Verificações adicionais de contraste de cores se aplicam para controles em que toda a área é interativa ou informativa. Por exemplo, um Button ou um Icon usado como um botão. Isso garante que os limites do controle estejam desmarcados, e os usuários saibam que podem clicar ou tocar.

Se houver uma borda para esses controles, deve haver contraste de cores adequadas entre:

Se não houver uma borda, deverá haver contraste de cores adequadas entre:

Objetos gráficos

Se uma imagem transmite informações importantes, considere verificar problemas de contraste. Isso se aplica a controles em que uma imagem pode ser mostrada: Audio, Image, Microphone e Video.

Para conteúdo de vídeo, considere verificar problemas de contraste. Como alternativa, ou além disso, forneça legendas que descrevam o vídeo.

Fornecer outras dicas visuais

Certifique-se de que o aplicativo não transmita informações apenas com cores. Por exemplo, os usuários com daltonismo não poderão distinguir uma mensagem de erro em vermelho de uma mensagem de êxito em verde.

As dicas adicionais, como um Ícone ou estilos de texto, como Italic e Underline, podem ajudar a transmitir o significado.

Próximas etapas

Mostrar ou ocultar conteúdo de tecnologias adaptativas em aplicativos de tela

Consulte também