Modus mit hohem Kontrast
Plattformen
Clients – Windows 8 Server – Windows Server 2012
Beschreibung
In früheren Windows-Betriebssystemen war der Modus mit hohem Kontrast auf Designs beschränkt, die unter klassischen Designs ausgeführt werden, die nicht visuell formatiert wurden. In Windows 8 und Windows Server 2012 wurde der klassische Modus entfernt und durch visuell formatierte Designs mit hohem Kontrast ersetzt. Einer der Hauptvorteile für Sie dieser Änderung ist das Entfernen eines separaten Codepfads für Apps, die im klassischen Modus ausgeführt werden.
Entwickler müssen immer noch erfahren, wie sich der Modus mit hohem Kontrast auf ihre App auswirken kann und wie sie eine App entwickeln, die wirklich stilagnostisch ist. Dies ist wichtig, da die falsche Verwendung oder Annahme von Designfarben dazu führen kann, dass Apps sich unter einem visuellen Stil wie Aero ordnungsgemäß verhalten, reagieren dieselben Apps unter hohem Kontrast falsch. In Aero ist text beispielsweise immer schwarz und die Hervorhebungsfarbe ist ein hellblauer. In hohem Kontrast schwarz ist die Hervorhebungsfarbe jedoch schwarz. Wenn Sie von schwarzem Text ausgehen, wie es in vielen box-Apps vor Windows 8 der Fall war, und verwenden Sie den Systemstandard für die Hervorhebung, wird der Benutzer schwarzen Text auf einem schwarzen Hintergrund sehen. In diesen Situationen ist es erforderlich, zu verstehen, wie Designs und Systemmetriken korrekt verwendet werden, damit die App auf allen Formatvorlagen korrekt aussieht.
Manifestationen
- Das Design ist nicht im Clientbereich von Apps aktiviert, die kein Windows 8 <unterstützteOS-Tag> im App-Manifest enthalten. Daher müssen die Apps den Clientbereich rendern, indem der Codepfad verwendet wird, der zum Rendern im Modus mit hohem Kontrast des klassischen Designs erforderlich ist.
- Das Design ist sowohl in den Nicht-Client- als auch in Clientbereichen von Apps in Designs mit hohem Kontrast nicht aktiviert. Es ist auch nicht in Apps aktiviert, die kein Windows 8 <supportedOS-Tag> im App-Manifest enthalten und in den Nicht-Clientbereich eines Fensters mit der DwnIsCompositionEnabled()-API zeichnen. Die gesamte App wird im Modus mit hohem Kontrast im klassischen Design gerendert.
- Apps, die Unterstützung für Windows 8 in ihrem Manifest hinzufügen, aber keine visuellen Formatvorlagen zum Rendern verwenden, das heißt, sie hartcodieren Farben oder Bilder in ihren Apps, werden möglicherweise nicht ordnungsgemäß in Designs mit hohem Kontrast gerendert. Text ist möglicherweise schwierig zu lesen oder Bilder werden möglicherweise nicht angezeigt, da sie im Modus mit hohem Kontrast angezeigt werden.
Minderung
Die Textfarben in den Designs mit hohem Kontrast wurden erstellt, damit sie den Microsoft-Richtlinien für Barrierefreiheit entsprechen. Wir pflegen ein 14:1-Verhältnis zwischen Vordergrund und Hintergrund. Wenn die standardmäßig aktivierten Farben für einen bestimmten Endbenutzer nicht geeignet sind, können sie einfach über die Systemsteuerungseinstellungen für "Fensterfarbe" in diesen Designs mit hohem Kontrast angepasst werden.
Diese UI-Komponenten können in Designs mit hohem Kontrast angepasst werden:
- Fensterhintergrundfarbe
- Textfarbe
- Hyperlinksfarbe
- Deaktivierter Text
- Ausgewählte Text-Vordergrund- und Hintergrundfarben
- Vordergrund- und Hintergrundfarben für aktive Fenster
- Inaktive Fenstertitel-Vordergrund- und Hintergrundfarben
- Vordergrund- und Hintergrundfarben der Schaltfläche
Lösung
Wenn unerwartetes Verhalten in Apps in Designs mit hohem Kontrast angezeigt wird, kann eine der folgenden Lösungen hilfreich sein:
Manifestieren einer App für Windows 8:
Apps, die das Windows 8 <unterstützteOS-Tag> im App-Manifest nicht enthalten, verfügen über ihre Clientbereiche, die ohne Design gerendert werden. In-Box-Apps sollten alle diesen Eintrag im App-Manifest enthalten. Fügen Sie den 4a2f28e3-53b9-4441-ba9c-d69d4a4a6e38 GUID-Wert für Windows 8 hinzu.
Verwenden von visuellen Formatvorlagen mit besitzergezeichneten UIs:
Besitzergezeichnete Steuerelemente sollten die Anweisungen auf MSDN zum korrekten Rendern von Steuerelementteilen und Zuständen, einschließlich Text, befolgen. Entwickler sollten sich nicht auf die in einem Gerätekontext angegebene Text- oder Hintergrundfarbe verlassen, um Nicht-UxTheme-Methoden zum Rendern zu verwenden. Wenn für das betreffende Steuerelement kein Designteil vorhanden ist, verwenden Sie GetThemeSysColor mit der entsprechenden Metrik , und zeichnen Sie den Text mithilfe standardmäßiger GDI-Methoden. Wenn keine der UxTheme-Aufrufe geeignet ist, verwenden Sie die GetSysColor-Methode, um die entsprechende Metrik abzurufen.
Auswählen der Textfarbe:
Verwenden Sie keine hartcodierte Textfarbe, auch wenn es angenommen wird, in allen gängigen Szenarien gut zu aussehen. Die Versanddesigns werden auf eine Weise erstellt, die eine hohe Sichtbarkeit mit zugeordneten Metriken unterstützt. Beispielsweise soll COLOR_HIGHLIGHTTEXT mit COLOR_HIGHLIGHT als Hintergrund verwendet werden, und COLOR_WINDOWTEXT soll mit COLOR_WINDOW als Hintergrund verwendet werden. Wenn Ausnahmen für diese Zuordnungen vorhanden sind, arbeiten Sie mit ihnen in den Designteilen und Zustandsdefinitionen selbst und nicht im Code zusammen. Beim Entwerfen von UIs mit hohem Kontrast ist es wichtig, dass die Benutzeroberfläche für das aktuell angewendete Design mit hohem Kontrast agnostisch ist, da Benutzer mit hohem Kontrast ihre Farben anpassen können.
Reagieren auf WM_ThemeChange Ereignis:
Wenn Ihre App die Farben zwischenspeichert, die aus dem Design abgerufen wurden, oder wendet Farben in nicht standardmäßiger Weise an, fügen Sie einen Meldungshandler für WM_THEMECHANGE hinzu, der die gespeicherten Farbwerte neu berechnet und die Benutzeroberfläche neu formatiert.
Schreiben einer WWA-App mit hohem Kontrast:
Web-Apps haben keinen Zugriff auf die UxTheme-APIs, sollten aber trotzdem mit den aktuellen Systemmetriken als Basis für die Benutzeroberfläche geschrieben werden. Es gibt einige Ressourcen für WWA-Entwickler, um eine kompatible App mit hohem Kontrast sicherzustellen:
- Die W3C CSS Color-Spezifikation gibt syntax für die Verwendung von Systemmetriken anstelle bestimmter Farben an.
- Unterstützung für Medienabfragen mit hohem Kontrast wird Internet Explorer 10 hinzugefügt.
- WWAs können die IAccessibilityCapabilities::get_HighContrast() -Methode nutzen, um den Zustand des hohen Kontrasts zu überprüfen.
Windows Store-Apps verfügen nicht über viele der gleichen Probleme mit Designteilen, die in klassischen Windows-Anwendungen vorhanden sind, aber Sie müssen dennoch die Compliance mit hohem Kontrast sicherstellen. Standardmäßig ignoriert Internet Explorer bestimmte benutzerdefinierte Formatvorlagen und ersetzt sie durch Werte mit hohem Kontrast. Beispielsweise werden Hintergrundbild-, Hintergrund- und Farb-CSS-Eigenschaften ignoriert.
Wenn Sie möchten, dass Internet Explorer keine Eigenschaften ignoriert, die Sie festlegen, und Sie haben sichergestellt, dass die Benutzeroberfläche mit hohem Kontrast kompatibel ist, können Sie die neue M3 CSS-Eigenschaft –ms-high-contrast: off für ein übergeordnetes Element festlegen.
Schreiben einer Windows Store-App mit hohem Kontrast:
Windows Store-App sollte die SystemColors-Klasse verwenden, um die richtige Ui-Elementfarbe zu bestimmen, beachten Sie, dass bestimmte Systemmetrikfarben in Verbindung verwendet werden sollen, z. B. SystemColors.WindowColor und SystemColors.WindowTextColor. Dies erleichtert eine überlegene Erfahrung mit hohem Kontrast.
Ordnungsgemäße Erkennung des hohen Kontrasts in früheren Versionen von Windows:
Apps, die in früheren Versionen von Windows ausgeführt werden, haben keinen Zugriff auf die neuen Designs mit hohem Kontrast, auch wenn das Manifest die Kompatibilität mit der betreffenden Windows-Version angibt. Daher kann es erforderlich sein, zusätzliche Codepfade einzufügen, um das Rendern in der klassischen Umgebung zu behandeln, die in früheren Versionen von Windows verwendet wird. Das Vorhandensein eines hohen Kontrasts in diesem Fall sollte durch Aufrufen der SystemParametersInfo-Funktion mit dem SPI_GETHIGHCONTRAST Flag überprüft werden. Dies ist die einzige unterstützte Möglichkeit, die Anwesenheit von hohem Kontrast zu überprüfen.
Tests
Stellen Sie beim Testen einer App sicher, dass sie in allen von Windows 8 bereitgestellten In-Box-Designs korrekt gerendert wird: Aero, Basic, High Contrast 1, High Contrast 2, High Contrast Black und High Contrast White. Stellen Sie sicher, dass der Text klar sichtbar und einfach in den Designs mit hohem Kontrast zu lesen ist.
Ressourcen
- Aero Style Classes, Parts und States (das neue grundlegende Design und Designs mit hohem Kontrast verwenden auch diese Zustände)
- Teile und Zustände, die allen visuellen Formatvorlagen gemeinsam sind
- Verwenden von visuellen Formatvorlagen mit benutzerdefinierten und Owner-Drawn Steuerelementen
- GetSysColor-Funktion
- W3C CSS Color Module Level 3
- SystemColors-Klasse
- SystemParametersInfo-Funktion
- Microsoft Accessibility (Microsoft-Barrierefreiheit)