Skelett Designsystem

Zeigt bevorstehende Inhalte an, ohne dass das Layout springt.

5 Prüfpunkte · 2 Inhaltsgruppen

Inhalt der Checkliste

Prüffortschritt

Struktur und Bedeutung

Vergleichen Sie Informationen und Präsentation im Nutzungskontext.

Bleiben Sie bei der tatsächlichen InhaltsformHalten Sie die Position und Größe nahe an dem Teil, das das Skelett ersetzen soll.Verwenden Sie das Skelett, wenn Sie die Inhaltsstruktur kennen. Bedeutet nicht, dass Daten verfügbar sind.Beispiel Die Ladeergebniskarte verfügt über einen Bildbereich, einen Titel und zwei Beschreibungszeilen.Behalten Sie ein moderates Maß an Bekanntheit beiVerwenden Sie neutrale Farben, um nicht mit geladenen Inhalten zu konkurrieren.Probieren Sie das Skelett auf einem beliebigen Hintergrund in Hell und Dunkel aus. Das gefälschte Bild muss erkennbar, aber nicht auffälliger als der geladene Inhalt sein.Die Bewegung ist mild und kann abnehmenVermeiden Sie Flimmern und respektieren Sie die Option, Bewegungen zu reduzieren.Aktivieren Sie die Bewegungsreduzierungsoption des Systems, um zu testen, ob der Effekt reduziert oder entfernt wird, ohne dabei die Belastung zu verstehen.

Interaktion und Benutzerfreundlichkeit

Probieren Sie den Vorgang aus, ändern Sie den Status und arbeiten Sie weiter.

Einmalige LadebenachrichtigungLassen Sie nicht zu, dass das Support-Tool jedes gefälschte Bild liest. Beschreibt den Zustand der gesamten Region.Das Support-Tool muss lediglich den geladenen Bereich kennen, ohne jeden simulierten Balken oder jedes simulierte Rechteck lesen zu müssen.Es gibt eine klare SchlusslinieSkelett durch Daten, leeren Zustand oder Fehler ersetzen; Warten Sie nicht ewig.Behalten Sie beim Erscheinen von Inhalten eine stabile Position bei; Versuchen Sie es auch mit dem leeren Ergebnisfall und dem Fehlerladen, damit das Skelett nicht für immer bestehen bleibt.

Der Fortschritt wird automatisch in diesem Browser gespeichert.

ANLEITUNG

So prüfen Sie

Bleiben Sie bei der tatsächlichen Inhaltsform

Verwenden Sie das Skelett, wenn Sie die Inhaltsstruktur kennen. Bedeutet nicht, dass Daten verfügbar sind.

BEISPIELE

Anwendungsbeispiele

Bleiben Sie bei der tatsächlichen Inhaltsform

Die Ladeergebniskarte verfügt über einen Bildbereich, einen Titel und zwei Beschreibungszeilen.

Skelett Designsystem

Struktur und Bedeutung

Interaktion und Benutzerfreundlichkeit

So prüfen Sie

Bleiben Sie bei der tatsächlichen Inhaltsform

Anwendungsbeispiele

Bleiben Sie bei der tatsächlichen Inhaltsform

Platzhalter mit echter Struktur

Form passend zur Datenart

Checkliste suchen

Keine Checklisten gefunden

Skelett Designsystem

Struktur und Bedeutung

Interaktion und Benutzerfreundlichkeit

So prüfen Sie

Bleiben Sie bei der tatsächlichen Inhaltsform

Anwendungsbeispiele

Bleiben Sie bei der tatsächlichen Inhaltsform

Varianten und Anwendungsfälle

Platzhalter mit echter Struktur

Form passend zur Datenart