ダイナミックタイプをサポート

This page is not available in the language you requested. You have been redirected to the English version of the page.

Link to this page copied to clipboard

Not for use with personal data

note

これは実験的なルールであり、その結果はベータテスト中と見なされます。詳細については、実験的なルールや、それらを改善する方法について学んでください。

このルールを実行すると、スキャン時間が増加します。

important

このルールはv2.6.0でXCUIフレームワーク用に開始されます。フィードバックを収集するため、一定期間だけオプトイン可能です。試してみて、感想をお聞かせください。

AxeDevToolsオブジェクトを初期化してテストを開始した後、以下の設定を使用してルールにオプトインしてください:

axe.configuration.optInToSupportsDynamicType = true

ここで axe は、ログイン時に初期化される AxeDevTools オブジェクトを指します。

テキスト要素にはダイナミックタイプをサポートするために必要なプロパティが備わっており、ユーザーのデバイスの設定に応じてテキストサイズを調整することが必要です。

このルールは、Dequeベストプラクティスを強制します。このルールはモバイルダッシュボードから、または iOS用に書かれたテストでルールを無視することによってオフにすることができます。

インパクト

視覚に障害がある人々は、サイズを変更できないテキストによって最も影響を受けます。ダイナミックタイプは、フォントサイズをデバイス全体で変更し、より読みやすくする支援技術です。

テキストを含む画面に移動し、現在のフォントサイズとそのレイアウトを観察してください。
ダイナミックタイプ設定を変更してフォントサイズを大きくしてください:
- シミュレーターを使用している場合:
  1. アクセシビリティインスペクターを開きます
  2. インスペクターの左上隅からデバイスをMacからiOSシミュレーターに変更します
  3. インスペクターの右上隅にある「設定」ボタンを選択します
  4. 「フォントサイズ」の下で、スライダーを大きな設定に移動します
- iOS 13.0+デバイスを使用している場合:
  1. 設定を開きます
  2. 「アクセシビリティ」を選択します
  3. 「表示とテキストサイズ」を選択します
  4. 「より大きなテキスト」を選択します
  5. ページの下部にあるスライダーを大きな設定に移動します
アプリに戻り、同じ画面を観察します
- アクセス不可: ダイナミックタイプ設定を更新した後もテキストのサイズが変わらない。
- アクセス可能: テキストのサイズが変わった。

このルールで見つかった問題は、ビューがダイナミックタイプの設定をサポートしていない場合に発生します。

iOS 14以降では、ダイナミックタイプをサポートできます:

カスタムフォントを使用する場合、 .font プロパティを設定し、 .custom(_:size:relativeTo:) フォントがテキスト要素のフォントスタイルに相対的にスケールすることを保証します。
サイズによってデフォルトのフォントを使用する場合、テキストは自動的にスケールしますが、フォントスタイルが設定されていない場合、テキスト要素はそのスタイルに応じてスケールしません。例えば、タイトルとして機能するテキストは本文として機能するテキストとは異なるスケールになります。テキストが大きくなるにつれて、タイトルテキストは常に本文テキストよりも大きくなります。最良のエクスペリエンスを得るために、要素の期待される動作に合わせてフォントスタイルを指定してください。以下のようなモディファイアを使用することで、 .font(.system(.largeTitle, design: .rounded))ページ上で最大のテキストとして期待され、適切なタイトルとして役立ちます。

すべてのテキスト要素の allowFontScaling プロパティは、ユーザーの好みのデバイス設定に応じてテキストがスケーリングされるように true に設定されています。

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