Cores acessíveis para aplicativos de tela

Artigo
03/15/2023

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:

Color e Fill
PressedColor e PressedFill
HoverColor e HoverFill

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:

FocusedBorderColor e a cor fora do controle

Verificações adicionais de contraste de cores se aplicam para controles em que toda a área é interativa ou informativa. Por exemplo, um Botão ou um Ícone 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:

BorderColor e a cor fora do controle
PressedBorderColor e a cor fora do controle
HoverBorderColor e a cor fora do controle

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

Fill e a cor fora do controle
PressedFill e a cor fora do controle
HoverFill e a cor fora do controle

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: Áudio, Imagem, Microfone e Vídeo.

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