Tier 2 – Adaptiv optimiert

Optimierte Apps unterstützen alle Bildschirmtypen und Gerätezustände, einschließlich Zustandsübergänge.

Darstellung der drei Qualitätsstufen als vertikal gestapelte Ebenen, wobei die mittlere Stufe hervorgehoben ist.

Richtlinien

Entwickeln Sie Ihre App so, dass sie sich an alle Displaygrößen und Gerätezustände anpasst.

Benutzeroberfläche

ID Tests Beschreibung
Responsive_adaptive_layouts T-Layout_Flow

Die App hat responsive und adaptive Layouts, die für alle Bildschirmgrößen entwickelt wurden. Alle Layouts sind responsiv (siehe UI zu responsiven Layouts migrieren). Die Implementierung adaptiver Layouts wird durch Fenstergrößenklassen bestimmt.

Die App-UI kann Folgendes umfassen:

  • Navigationsleisten am linken Rand, die sich bei größeren Fenstergrößen zu vollständigen Navigationsbereichen erweitern
  • Rasterlayouts, bei denen die Anzahl der Spalten an Änderungen der Fenstergröße angepasst wird
  • Textspalten auf großen Bildschirmen
  • Bereiche am rechten Rand, die auf Desktop-Bildschirmgrößen standardmäßig geöffnet sind und auf kleineren Bildschirmen geschlossen sind

Erstellen Sie gegebenenfalls Layouts mit mehreren Bereichen, um den Platz auf großen Bildschirmen optimal zu nutzen. Siehe Kanonische Layouts.

Durch das Einbetten von Aktivitäten können aktivitätsbasierte Apps Layouts mit mehreren Bereichen erstellen, indem Aktivitäten nebeneinander angezeigt werden.
UI_Secondary_Elements T-Layout_Flow

Modale Fenster, Kontextmenüs und andere sekundäre Elemente sind auf allen Bildschirmtypen und in allen Gerätezuständen richtig formatiert, z. B.:

  • Bottom Sheets sind auf großen Bildschirmen nicht über die gesamte Breite verfügbar. Wenden Sie eine maximale Breite an, um ein Strecken zu vermeiden. Siehe Verhalten in Sheets: unten.
  • Schaltflächen sind auf großen Bildschirmen nicht über die gesamte Breite verfügbar. Siehe Verhalten in Schaltflächen.
  • Textfelder und ‑boxen werden auf großen Bildschirmen nicht über die gesamte Breite gestreckt. Siehe Verhalten in Textfeldern.
  • Kleine Bearbeitungsmenüs oder modale Fenster decken nicht den gesamten Bildschirm ab und behalten den Kontext für den Nutzer so weit wie möglich bei. Siehe Menüs.
  • Kontextmenüs werden neben dem vom Nutzer ausgewählten Element angezeigt. Siehe das Thema „Kontextmenüs“ unter Menüs.
  • Navigationsleisten ersetzen Navigationsleisten, um die Ergonomie auf großen Bildschirmen zu verbessern. Siehe Navigationsleiste.
  • Navigationsleisten werden zu erweiterten Navigationsleisten aktualisiert. Siehe Navigationsleiste.
  • Dialogfelder werden auf die neueste Material-Komponente aktualisiert. Siehe Dialogfelder.
  • Bilder werden mit der richtigen Auflösung angezeigt und nicht gestreckt oder zugeschnitten.
Touch_Targets T-Touch_Targets Berührungszielbereiche sind mindestens 48 dp groß. Siehe die Richtlinien für Layout und Typografie in Material Design.
Drawable_Focus T-Drawable_Focus Für benutzerdefinierte Drawables, die interaktiv sind, wird ein fokussierter Zustand erstellt. Ein benutzerdefiniertes Drawable ist ein visuelles UI-Element, das nicht vom Android-Framework bereitgestellt wird. Wenn Nutzer mit einem benutzerdefinierten Drawable interagieren können, muss das Drawable fokussierbar sein, wenn sich das Gerät nicht im Touch-Modus befindet. Außerdem muss eine visuelle Anzeige des fokussierten Zustands vorhanden sein.

Tastatur, Maus und Touchpad

ID Tests Beschreibung
Keyboard_Navigation T-Keyboard_Navigation Die Hauptaufgabenabläufe in der App unterstützen die Tastaturnavigation, einschließlich der Navigation mit der Tab-Taste und den Pfeiltasten. Siehe Barrierefreie Apps entwickeln.
Keyboard_Shortcuts T-Keyboard_Shortcuts Die App unterstützt Tastenkombinationen für häufig verwendete Aktionen wie Auswählen, Ausschneiden, Kopieren, Einfügen, Rückgängigmachen und Wiederherstellen. Siehe Kompatibilität der Eingabemethoden.
Keyboard_Media_Playback T-Keyboard_Media_Playback Die Tastatur kann zur Steuerung der Medienwiedergabe verwendet werden. Mit der Leertaste können Medien beispielsweise abgespielt und pausiert werden.
Keyboard_Send T-Keyboard_Send Mit der Eingabetaste der Tastatur wird in Kommunikations-Apps die Funktion Senden ausgeführt.
Context_Menus T-Context_Menus Kontextmenüs sind über die typische Rechtsklick-Funktion der Maus und des Touchpads (sekundäre Maustaste oder sekundäres Tippen) zugänglich.
Content_Zoom T-Content_Zoom App-Inhalte können mit dem Mausrad (in Verbindung mit dem Drücken der Strg-Taste) und mit Pinch-Gesten auf dem Touchpad gezoomt werden.
Hover_States T-Hover_States Aktionsfähige UI-Elemente haben (falls zutreffend) Hover-Zustände, um Nutzern von Maus und Touchpad anzuzeigen, dass die Elemente interaktiv sind.

Tests

Führen Sie die folgenden Tests aus, um sicherzustellen, dass Ihre App für alle Displaykonfigurationen optimiert und responsiv ist.

Benutzeroberfläche

ID Funktion Beschreibung
T-Layout_Flow Responsive_adaptive_layouts,
UI_Secondary_Elements

Führen Sie die App auf Geräten mit einer Vielzahl von Bildschirmgrößen aus, darunter Smartphones, faltbare Smartphones, kleine und große Tablets sowie Desktop-Geräte. Führen Sie die App auf den Geräten im Multifenstermodus aus.

Prüfen Sie, ob das App-Layout auf unterschiedliche Bildschirm- und Fenstergrößen reagiert und sich daran anpasst. Prüfen Sie, ob die App Navigationsleisten erweitert und verkleinert, die Anzahl der Spalten in Rasterlayouts skaliert, Text in Spalten umfließt usw. Prüfen Sie, ob UI-Elemente sowohl ästhetisch als auch funktional formatiert sind.

Bei Apps, die das Einbetten von Aktivitäten verwenden, prüfen Sie, ob Aktivitäten auf großen Bildschirmen nebeneinander und auf kleinen Bildschirmen gestapelt angezeigt werden.
T-Touch_Targets Touch_Targets Prüfen Sie, ob Berührungszielbereiche für alle Displaygrößen und ‑konfigurationen eine konsistente, zugängliche Größe und Position haben und nicht durch andere UI-Elemente verdeckt oder verdeckt werden. Informationen zur Barrierefreiheit finden Sie unter dem Accessibility Scanner.
T-Drawable_Focus Drawable_Focus Prüfen Sie auf jedem App-Bildschirm, der ein interaktives benutzerdefiniertes Drawable enthält, ob das Drawable mit einer externen Tastatur, einem Steuerkreuz oder einem anderen Gerät fokussiert werden kann, mit dem UI-Elemente fokussiert werden können. Prüfen Sie, ob eine visuelle Anzeige des fokussierten Zustands vorhanden ist. Weitere Informationen finden Sie unter Touch-Modus.

Tastatur, Maus und Touchpad

ID Funktion Beschreibung
T-Keyboard_Navigation T-Keyboard_Navigation Navigieren Sie mit der Tabulatortaste und den Pfeiltasten einer externen Tastatur durch die fokussierbaren Komponenten der App.
T-Keyboard_Shortcuts Keyboard_Shortcuts Verwenden Sie Tastenkombinationen auf einer externen Tastatur, um Aktionen wie Auswählen, Ausschneiden, Kopieren, Einfügen, Rückgängigmachen und Wiederherstellen auszuführen.
T-Keyboard_Media_Playback Keyboard_Media_Playback Verwenden Sie eine externe Tastatur, um die Medienwiedergabe zu starten, zu beenden, zu pausieren, zurückzuspulen und vorzuspulen.
T-Keyboard_Send Keyboard_Send Verwenden Sie die Eingabetaste einer externen Tastatur, um Daten zu senden oder zu übermitteln.
T-Context_Menus Context_Menus Verwenden Sie die sekundäre Maustaste oder die sekundäre Tippfunktion des Touchpads, um auf das Kontextmenü interaktiver Elemente zuzugreifen.
T-Content_Zoom Content_Zoom Verwenden Sie das Mausrad (in Verbindung mit der Strg-Taste) und Pinch-Gesten auf dem Touchpad, um Inhalte zu vergrößern und zu verkleinern.
T-Hover_States Hover_States Bewegen Sie den Mauszeiger oder den Touchpad-Cursor auf aktionsfähige UI-Elemente, um den Hover-Zustand des Elements zu aktivieren.