Unterstützt Dynamic Type

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
Beste Vorgehensweisen Auswirkung – Kritisch
note

Dies ist eine experimentelle Regel und daher gelten die Ergebnisse als Betatest-Ergebnisse. Erfahren Sie mehr über experimentelle Regeln und wie Sie dazu beitragen können, sie zu verbessern.

Das Ausführen dieser Regel führt zu längeren Scanzeiten.

important

Diese Regel startet für das XCUI-Framework mit v2.6.0. Die Teilnahme zum Sammeln von Feedback ist nur für einen begrenzten Zeitraum möglich. Probieren Sie es aus und teilen Sie uns Ihre Meinung mit.

Nachdem Sie das AxeDevTools-Objekt initialisiert haben, um mit dem Testen zu beginnen, aktivieren Sie die Regel mithilfe der folgenden Konfiguration:

axe.configuration.optInToSupportsDynamicType = true

Wobei axe sich auf das AxeDevTools Objekt bezieht, das bei der Anmeldung initialisiert wird.

Textelemente sollten über die erforderlichen Eigenschaften verfügen, um Dynamic Type zu unterstützen und die Textgröße an die Geräteeinstellungen des Benutzers anzupassen.

Diese Regel erzwingt eine Deque Best Practice. Sie können diese Regel über das Mobile Dashboard deaktivieren oder indem Sie die Regel in für iOS geschriebenen Tests ignorieren.

Erfahren Sie, wie Sie Regeln im Mobile Dashboard deaktivieren.

Auswirkung

Für Menschen mit Sehschwäche ist Text, dessen Größe nicht geändert werden kann, besonders problematisch. Dynamic Type ist eine unterstützende Technologie, die es dem Endbenutzer ermöglicht, die Schriftgröße geräteweit zu ändern, um das Lesen zu erleichtern.

Bestätigung

  1. Navigiere zum Bildschirm mit dem Text und beobachte die aktuelle Schriftgröße und das Layout
  2. Vergrößere die Schriftgröße, indem Sie die Einstellung „Dynamischer Typ“ ändern:
    • Bei Verwendung eines Simulators:
      1. Öffne den Accessibility Inspector
      2. Wechsle in der oberen linken Ecke des Inspektors von deinem Mac zum iOS-Simulator.
      3. Wählen Sie die Schaltfläche "Einstellungen" in der oberen rechten Ecke des Inspektors
      4. Bewegen Sie unter „Schriftgröße“ den Schieberegler auf eine größere Einstellung
    – Wenn Sie ein Gerät mit iOS 13.0+ verwenden: 1. Öffnen Sie die Einstellungen 2. Wähle „Barrierefreiheit“ 3. Wählen Sie „Anzeige & Textgröße“ 4. Wählen Sie „Größeren Text“ 5. Bewegen Sie den Schieberegler unten auf der Seite zu einer größeren Einstellung
  3. Navigieren Sie zurück zu Ihrer App und beobachten Sie den gleichen Bildschirm
    • Nicht zugänglich: Die Textgröße wurde nach der Aktualisierung der Einstellung für Dynamic Type nicht geändert.
    • Zugänglich: Die Textgröße hat sich geändert.

So beheben Sie das Problem

Ein von dieser Regel festgestelltes Problem tritt auf, wenn Ansichten die Einstellungen für Dynamic Type nicht unterstützen.

UIKit

Lesen Sie hier mehr über die Unterstützung von Dynamic Type in UIKit.

SwiftUI

In iOS 14 oder höher können Sie Dynamic Type unterstützen: – Wenn Sie eine benutzerdefinierte Schriftart verwenden, legen Sie die .font Eigenschaft auf .custom(_:size:relativeTo:) fest, um sicherzustellen, dass die Schriftart relativ zum Schriftstil des Textelements skaliert wird.

  • Wenn Sie eine Standardschriftart verwenden, wird der Text automatisch skaliert. Wenn jedoch kein Schriftstil festgelegt ist, werden Textelemente nicht entsprechend ihrem Stil skaliert. Beispielsweise wird Text, der als Titel dient, anders skaliert als Text, der als Fließtext dient – wenn der Text größer wird, wird der Titeltext immer größer sein als der Fließtext. Um ein optimales Ergebnis zu erzielen, geben Sie den Schriftstil unbedingt so an, dass er dem erwarteten Verhalten des Elements entspricht. Durch die Verwendung eines Modifikators wie: [a39] können Sie davon ausgehen, dass der Text der größte Text auf der Seite ist und als richtiger Titel dient. .font(.system(.largeTitle, design: .rounded))

React Native

Stellen Sie sicher, dass die Eigenschaft allowFontScaling jedes Textelements auf „true“ eingestellt ist, damit der Text an die bevorzugten Geräteeinstellungen des Benutzers angepasst werden kann.

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