Suporte a Tipo Dinâmico

axe.configuration.optInToSupportsDynamicType = true

O que Verificamos

Os elementos de texto devem ter as propriedades necessárias para suportar o Dynamic Type e redimensionar de acordo com a preferência de tamanho de fonte do usuário em todo o dispositivo.

Esta regra impõe uma Melhoria Recomendada pela Deque. Você pode desativar esta regra no Painel Móvel ou por ignorando a regra em testes escritos para iOS.

Saiba como desativar regras no Painel Móvel.

Exemplo de Falha ❌

Os elementos de texto usam fontes fixas que não respondem à configuração de Dynamic Type do usuário

Após aumentar a configuração de Dynamic Type para o maior tamanho, o texto remains unchanged — ele não cresce para refletir a preferência do usuário

Exemplo de Sucesso ✅

Os elementos de texto usam fontes escaláveis que respondem à configuração de Dynamic Type do usuário

Após aumentar a configuração de Dynamic Type para o maior tamanho, o texto scales up accordingly para corresponder à preferência de dispositivo do usuário

Visão Geral

• Esta regra tem um impacto crítico para usuários com baixa visão que dependem de texto maior
• Os elementos de texto devem suportar o Dynamic Type para que se redimensionem quando o usuário altera o tamanho da fonte do dispositivo

Impacto nos Usuários

Pessoas com baixa visão são as mais afetadas por textos que não podem ser redimensionados. Dynamic Type é uma funcionalidade do iOS que permite aos usuários definir uma preferência de tamanho de fonte em todo o dispositivo, e espera-se que os aplicativos respeitem essa preferência. Quando elementos de texto não suportam o Dynamic Type, usuários que precisam de texto maior enfrentam dificuldades para ler conteúdos que não redimensionam, independentemente de suas configurações.

Confirmar Suporte ao Problema do Dynamic Type

1. Navegue até a tela contendo texto e observe o tamanho atual da fonte e seu layout
2. Amplie o tamanho da fonte alterando a configuração de Tipo Dinâmico:
   • Se estiver usando um simulador:
     1. Abra Inspetor de Acessibilidade
     2. No canto superior esquerdo do inspector, altere o dispositivo de seu Mac para o simulador iOS
     3. Selecione o botão Configurações no canto superior direito do inspetor
     4. Em Tamanho da Fonte, mova o controle deslizante para uma configuração maior
   • Se estiver usando um dispositivo iOS 13.0+:
     1. Abra Configurações
     2. Selecione Acessibilidade
     3. Selecione Tela e Tamanho do Texto
     4. Selecione Texto Maior
     5. Mova o controle deslizante na parte inferior da página para uma configuração maior
3. Navegue de volta para o seu aplicativo e observe o seguinte na mesma tela:
   • Inacessível: O texto não mudou de tamanho após atualizar a configuração de Dynamic Type
   • Acessível: O texto mudou de tamanho

Corrigir Problemas

Para resolver um problema de Suporte ao Dynamic Type, configure os elementos de texto para usar fontes escaláveis que respondam à configuração de Dynamic Type do usuário.

UIKit

Defina adjustsFontForContentSizeCategory = true em qualquer elemento de texto para que ele seja atualizado quando o usuário alterar sua configuração de Dynamic Type. Use UIFont.preferredFont(forTextStyle:) para fontes do sistema ou UIFontMetrics para escalar uma fonte personalizada em relação a um estilo de texto:

// System font — scales automatically to the user's Dynamic Type setting
label.font = UIFont.preferredFont(forTextStyle: .body)
label.adjustsFontForContentSizeCategory = true

// Custom font — scaled relative to a text style using UIFontMetrics
let customFont = UIFont(name: "Georgia", size: 17)!
label.font = UIFontMetrics(forTextStyle: .body).scaledFont(for: customFont)
label.adjustsFontForContentSizeCategory = true

SwiftUI

No iOS 14 ou superior, você pode suportar o Dynamic Type de duas maneiras:

• Ao usar uma fonte personalizada, defina a propriedade .font para .custom(_:size:relativeTo:) para garantir que as fontes sejam escaladas relativamente ao estilo de fonte do elemento de texto.
• Ao usar uma fonte padrão por tamanho, o texto será escalado automaticamente. No entanto, se nenhum estilo de fonte for definido, os elementos de texto não serão escalados de acordo com seu estilo. Por exemplo, o texto que funciona como título será escalado de forma diferente do texto que funciona como corpo de texto. Para a melhor experiência, especifique o estilo de fonte para corresponder ao comportamento esperado do elemento. Usando um modificador como .font(.system(.largeTitle, design: .rounded)), você pode esperar que o texto seja o maior da página e sirva como um título adequado.

React Native

Defina allowFontScaling={true} em cada elemento Text para permitir que ele seja escalado de acordo com as configurações de dispositivo preferidas pelo usuário:

<Text style={{ color: 'black', fontSize: 18 }} allowFontScaling={true}> This text allows font scaling. </Text>

Posso Ignorar Esta Regra?

Suporta Dynamic Type tem um impacto crítico para usuários com baixa visão. Como esta é uma regra de Melhores Práticas, ela pode ser desativada no Painel de Controle Móvel ou suprimida em testes individuais. No entanto, recomendamos fortemente o suporte ao Dynamic Type em todo o seu aplicativo em vez de ignorar a regra de forma ampla. Saiba mais sobre ignorando regras.

Recursos

Páginas de Cursos da Deque University

• Critério de Sucesso 1.4.4 - Redimensionar Texto (AA)
• 1.4.4 Redimensionar Texto (AA)

Nota: Acesso completo aos recursos da Deque University requer uma assinatura.

Outros Recursos

• Diretrizes de Acessibilidade para Conteúdo Web (WCAG) 2.1, Recomendação W3C
  • Critério de Sucesso 1.4.4 - Redimensionar Texto
• Documentação do Desenvolvedor Apple
  • Escalonamento Automático de Fontes
  • Dynamic Type no SwiftUI