Unterstützt Dynamic Type

axe.configuration.optInToSupportsDynamicType = true

Was wir überprüfen

Textelemente sollten die erforderlichen Eigenschaften haben, um Dynamic Type zu unterstützen und sich an die geräteweite Schriftgrößeneinstellung des Benutzers anzupassen.

Diese Regel unterstützt eine Deque-Best-Practice. Sie können diese Regel über das Mobile Dashboard oder durch Regel in Tests für iOS ignorieren deaktivieren.

Erfahren Sie, wie Sie Regeln über das Mobile Dashboard deaktivieren.

Fehlgeschlagenes Beispiel ❌

Textelemente verwenden feste Schriftarten, die nicht auf die Dynamic Type-Einstellung des Benutzers reagieren

Nach dem Erhöhen der Dynamic Type-Einstellung auf die größte Größe zeigt der Text remains unchanged — er passt sich nicht der Präferenz des Benutzers an

Erfolgreiches Beispiel ✅

Textelemente verwenden skalierbare Schriftarten, die auf die Dynamic Type-Einstellung des Benutzers reagieren

Nach dem Erhöhen der Dynamic Type-Einstellung auf die größte Größe passt sich der Text scales up accordingly an die Präferenz des Benutzergeräts an

Auf einen Blick

• Diese Regel hat eine kritische Auswirkung auf Nutzer mit Sehschwäche, die auf größere Texte angewiesen sind
• Textelemente müssen Dynamic Type unterstützen, damit sie sich anpassen, wenn der Benutzer die Schriftgröße seines Gerätes ändert

Auswirkungen auf die Nutzer

Personen mit Sehbehinderungen sind am meisten betroffen von Text, der sich nicht anpassen kann. Dynamic Type ist eine iOS-Funktion, die es den Benutzern ermöglicht, eine bevorzugte Schriftgröße geräteweit festzulegen, und es wird erwartet, dass Apps diese Präferenz respektieren. Wenn Textelemente Dynamic Type nicht unterstützen, müssen Nutzer, die größere Texte benötigen, sich bemühen, Inhalte zu lesen, die sich ungeachtet ihrer Einstellungen nicht skalieren.

Dynamic Type-Unterstützungsproblem bestätigen

1. Navigieren Sie zu dem Bildschirm mit Text und beobachten Sie die aktuelle Schriftgröße und deren Layout
2. Vergrößern Sie die Schriftgröße, indem Sie die Dynamic Type-Einstellung ändern:
   • Wenn Sie einen Simulator verwenden:
     1. Öffnen Sie Bedienungshilfen-Inspektor
     2. Ändern Sie in der oberen linken Ecke des Inspektors das Gerät von Ihrem Mac zum iOS-Simulator
     3. Wählen Sie die Einstellungen-Schaltfläche in der oberen rechten Ecke des Inspektors
     4. Unter Schriftgröße, schieben Sie den Regler auf eine größere Einstellung
   • Wenn Sie ein Gerät mit iOS 13.0+ verwenden:
     1. Öffnen Sie Einstellungen
     2. Wählen Sie Bedienungshilfen
     3. Wählen Sie Anzeige & Textgröße
     4. Wählen Sie Größerer Text
     5. Bewegen Sie den Regler am unteren Rand der Seite auf eine größere Einstellung
3. Gehen Sie zurück zu Ihrer App und beobachten Sie Folgendes auf demselben Bildschirm:
   • Nicht zugänglich: Der Text hat seine Größe nach Aktualisierung der Dynamic Type-Einstellung nicht geändert
   • Barrierefrei: Der Text hat seine Größe geändert

Probleme beheben

Um ein Problem mit „Unterstützt dynamische Schriftart“ zu lösen, konfigurieren Sie Textelemente so, dass sie skalierbare Schriftarten verwenden, die auf die dynamische Schriftarteinstellung des Benutzers reagieren.

UIKit

Setzen Sie adjustsFontForContentSizeCategory = true auf jedes Textelement, damit es sich aktualisiert, wenn der Benutzer seine dynamische Schriftarteinstellung ändert. Verwenden Sie UIFont.preferredFont(forTextStyle:) für Systemschriften oder UIFontMetrics, um eine benutzerdefinierte Schrift relativ zu einem Textstil zu skalieren:

// 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

In iOS 14 oder höher können Sie die dynamische Schriftart auf zwei Arten unterstützen:

• Bei der Verwendung einer benutzerdefinierten Schrift setzen Sie die Eigenschaft .font auf .custom(_:size:relativeTo:), um sicherzustellen, dass Schriftarten relativ zum Schriftstil des Textelements skaliert werden.
• Bei der Verwendung einer Standardschrift nach Größe wird der Text automatisch skaliert. Wenn jedoch kein Schriftstil festgelegt ist, werden Textelemente nicht gemäß ihrem Stil skaliert. Zum Beispiel wird Text, der als Titel fungiert, anders skaliert als Text, der als Fließtext fungiert. Um die beste Erfahrung zu bieten, geben Sie den Schriftstil an, um dem erwarteten Verhalten des Elements zu entsprechen. Durch die Verwendung eines Modifikators wie .font(.system(.largeTitle, design: .rounded)) können Sie erwarten, dass der Text der größte Text auf der Seite ist und als richtiger Titel dient.

React Native

Setzen Sie allowFontScaling={true} auf jedes Text-Element, damit es sich an die bevorzugten Geräteeinstellungen des Benutzers anpasst:

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

Kann ich diese Regel ignorieren?

Unterstützt dynamische Schriftart hat einen Kritische Auswirkung für Sehbehinderte. Da dies eine Best-Practice-Regel ist, kann sie im Mobile-Dashboard deaktiviert oder in einzelnen Tests unterdrückt werden. Wir empfehlen jedoch dringend, dynamische Schriftart in Ihrer App zu unterstützen, anstatt die Regel allgemein zu ignorieren. Erfahren Sie mehr über Regeln ignorieren.

Ressourcen

Deque University Kursseiten

• Erfolgskriterium 1.4.4 - Textgröße ändern (AA)
• 1.4.4 Textgröße ändern (AA)

Hinweis: Für den vollständigen Zugriff auf die Ressourcen der Deque University ist ein Abonnement erforderlich.

Andere Ressourcen

• Web Content Accessibility Guidelines (WCAG) 2.1, W3C-Empfehlung
  • Erfolgskriterium 1.4.4 - Textgröße ändern
• Apple Developer-Dokumentation
  • Schriftarten automatisch skalieren
  • Dynamische Schriftart in SwiftUI