Listen
Mit Sammlungen den Überblick behalten
Sie können Inhalte basierend auf Ihren Einstellungen speichern und kategorisieren.
Listen sind eine visuelle Darstellung eines oder mehrerer verwandter Elemente.
Sie werden häufig verwendet, um eine Reihe von Optionen anzuzeigen.
Ressourcen
Highlights
- Listen sind eine fortlaufende Sammlung von Text oder Bildern.
- Listen sollten sich natürlich anfühlen und überschaubar sein.
- Listen bestehen aus Elementen, die Primär- und ergänzende
Aktionen, die durch Symbole und Text dargestellt werden.
Varianten
Es gibt drei Arten von Listen: einzeilige Liste, zweizeilige Liste und
dreizeilige Liste.
- Einzeilige Liste: Eine Zeile für jeden Eintrag. Diese einfache
stellt sicher, dass sich die einzelnen Elemente eindeutig voneinander unterscheiden.
- Zweizeilige Liste: Die Kommunikation der einzelnen Elemente erfolgt über zwei parallele Linien.
Dieses strukturierte Design sorgt für eine natürliche Lesbarkeit und vermeidet kognitive Beeinträchtigungen.
Überlastung.
- Dreizeilige Liste: Jedes Element wird mit drei parallelen Linien dargestellt.
Dieses dekorative Design verleiht ihm eine starke visuelle Auffälligkeit.
Anatomie
- Symbol: Eine kleine Grafik, die ein bestimmtes Objekt oder eine bestimmte Aktion repräsentiert.
um Ideen oder Konzepte visuell zu vermitteln.
- Dachzeile: kurze Textzeile, die über dem Titel oder Untertitel erscheint
werden oft verwendet, um zusätzlichen Kontext oder Betonung zu schaffen.
- Titel: Eine große, fett formatierte Textzeile, die als Hauptüberschrift der
ein Designelement oder eine Seite.
- Untertitel: Eine kleinere Textzeile mit zusätzlichen Informationen.
oder Kontext unter einem Haupttitel.
- Steuerung: Ein interaktives Element, das dem Nutzer die Eingabe einer Entscheidung ermöglicht.
Bundesstaaten
Technische Daten
Nutzung
Listen sind vertikal organisierte Gruppen von Text und Bildern.
Eine für das Leseverständnis optimierte Liste besteht aus einer
fortlaufende Spalte von Elementen.
Listenelemente können primäre und ergänzende Aktionen enthalten,
durch Symbole und Text.
check_circle
Dos
Listenelemente sind keine Schaltflächen. Die Elemente haben keine Container. Listenelemente sind standardmäßig nicht ausgewählt und nicht hervorgehoben.
warning
Achtung
Verwenden Sie den Containerhintergrund nur bei Bedarf für Listenelemente.
Auswahlsteuerung
Mit Steuerelementen werden Informationen und Aktionen für Listenelemente angezeigt. Sie können aufeinander abgestimmt werden,
zum Anfang oder Ende des Listenelements hinzu.
- Kästchen: Wählen Sie ein oder mehrere Listenelemente aus.
- Optionsfelder: Wählen Sie genau ein Optionsfeld aus.
Element in der Liste.
- Schalter: Hier können Sie Steuerelemente ein- oder ausschalten.
check_circle
Dos
Verwenden Sie eine Symbolauswahlanzeige, um das ausgewählte Element deutlich in einer Liste anzuzeigen. So können Nutzende das von ihnen ausgewählte Element leicht erkennen und die gesamte User Experience verbessern.
cancel
Don'ts
Verlassen Sie sich nicht ausschließlich auf die Hintergrundfarbe, um die Auswahl in einer Liste zu kennzeichnen.
cancel
Don'ts
Vermeiden Sie es, Schaltflächen innerhalb eines Listenelements zu platzieren, da dies zu Verwirrung darüber führen kann, welches Element gerade im Fokus ist.
Symbole
check_circle
Dos
Wenn Sie Inhalte der gleichen Art in der Liste zeigen, lassen Sie Symbole weg, um visuelles Rauschen zu reduzieren und die Nutzererfahrung zu verbessern. Vermeiden Sie die Verwendung von Symbolen in einer Liste, wenn sie keinen Zweck erfüllen und keine zusätzlichen Informationen enthalten.
cancel
Don'ts
Verwenden Sie nicht für alle Elemente in einer Liste dasselbe Symbol. Das kann für Nutzende visuell überwältigend und verwirrend sein. Verwenden Sie Symbole nur dann, wenn sie einen Mehrwert bieten oder zusätzliche Informationen liefern.
Avatare und Bilder
Listenelemente können kreisförmig zugeschnittene Bilder enthalten, die eine
Person oder Rechtssubjekt.
Alle Inhalte und Codebeispiele auf dieser Seite unterliegen den Lizenzen wie im Abschnitt Inhaltslizenz beschrieben. Java und OpenJDK sind Marken oder eingetragene Marken von Oracle und/oder seinen Tochtergesellschaften.
Zuletzt aktualisiert: 2024-08-19 (UTC).
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"Benötigte Informationen nicht gefunden"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"Zu umständlich/zu viele Schritte"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"Nicht mehr aktuell"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"Problem mit der Übersetzung"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"Problem mit Beispielen/Code"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"Sonstiges"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"Leicht verständlich"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"Mein Problem wurde gelöst"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"Sonstiges"
}]
{"lastModified": "Zuletzt aktualisiert: 2024-08-19\u00a0(UTC)."}
[[["Leicht verständlich","easyToUnderstand","thumb-up"],["Mein Problem wurde gelöst","solvedMyProblem","thumb-up"],["Sonstiges","otherUp","thumb-up"]],[["Benötigte Informationen nicht gefunden","missingTheInformationINeed","thumb-down"],["Zu umständlich/zu viele Schritte","tooComplicatedTooManySteps","thumb-down"],["Nicht mehr aktuell","outOfDate","thumb-down"],["Problem mit der Übersetzung","translationIssue","thumb-down"],["Problem mit Beispielen/Code","samplesCodeIssue","thumb-down"],["Sonstiges","otherDown","thumb-down"]],["Zuletzt aktualisiert: 2024-08-19 (UTC)."]]