Präsentieren Sie den Nutzenden eine Datenzusammenfassung, bevor der Onlineantrag final eingereicht wird. Die Zusammenfassungsseite eines Formulars sollte alle eingegebenen Informationen und Auswahlmöglichkeiten des Nutzenden anzeigen. Nutzende können dann sicherstellen, dass die Daten korrekt sind, bevor der Antrag abgeschickt wird. Wenn dies nicht der Fall ist, können Sie die Daten von dieser Seite aus korrigieren.
Inhalt
Hier sind die wesentlichen Elemente, die auf einer Zusammenfassungsseite integriert sein sollten:
- Eingegebene Daten
Alle vom Nutzenden eingegebenen Daten, einschließlich persönlicher Informationen, Textfelder, Dropdown-Auswahlen, Datumsangaben und mehr.- Wenn möglich, betten Sie die Inhalte direkt in die Webseite ein und zeigen Sie diese direkt an. Wählen Sie hierzu den passenden Tabellentyp.
- Als Alternative können Sie ein PDF mit allen eingegebenen Daten zum Download anbieten.
- Bestätigungsfeld
Sie können ein Bestätigungsfeld hinzufügen, in welchem die Nutzenden bestätigen müssen, dass alle Informationen korrekt und vollständig sind, bevor diese den Antrag abschicken. - Weitere Informationen
Wenn es weitere wichtige Informationen zum weiteren Vorgehen oder rechtliche Hinweise gibt, können Sie dies ebenfalls auf der Zusammenfassungsseite integrieren. Achten Sie darauf, dass diese Informationen kurz und kompakt formuliert sind, um sicherzustellen, dass die eingegebenen Daten und deren Überprüfung nicht übersehen werden. - Buttons
Benennen Sie wenn möglich den Primary Button Antrag einreichen oder Antrag abschicken.
Tabellentypen
Wenn Sie Daten direkt auf der Seite einbetten, stehen Ihnen verschiedene Tabellentypen zur Verfügung. Wählen Sie die passende Darstellungsform je nach Inhalt und Nutzungszweck.
- Tabelle mit Titelspalte
Verwenden Sie diese Darstellungsform, wenn Daten zu einer Person oder einem einzelnen Vorgang zusammengefasst angezeigt werden sollen. Diese Form eignet sich gut für eine größere Anzahl an Daten, ohne dass es zu Darstellungsproblemen kommt. Achten Sie jedoch darauf, dass die Tabelle nicht zu lang wird. Falls notwendig, teilen Sie die Daten in kleinere Abschnitte auf. - Tabelle mit Titelzeile
Nutzen Sie diese Darstellungsform, wenn Daten mehrerer Nutzender oder Datensätze in Spalten vergleichbar dargestellt werden sollen. Sie ermöglicht eine effiziente Platznutzung. Wir empfehlen jedoch, sie nicht bei zu vielen Spalten oder sehr langen Inhalten zu verwenden. Ansonsten ist es möglich, in der Tabelle zu scrollen, was die Bedienbarkeit und Übersichtlichkeit beeinträchtigen kann. - Tabelle mit Titelzeile und Titelspalte
Verwenden Sie diese Darstellungsform, wenn persönliche Daten mehrerer Nutzender zusammengefasst und gleichzeitig jeder Zeile ein Titel zugeordnet werden soll. Diese Struktur ist besonders sinnvoll, wenn Sie mehrdimensionale Daten präsentieren und jeder Zeile eine eigene Bezeichnung zuweisen möchten. Sie ermöglicht eine präzisere und strukturierte Darstellung der Daten in einem Gitternetzmuster.
Diese Variante benötigt jedoch viel Platz und ist nur dann sinnvoll, wenn eine begrenzte Anzahl an Spalten verwendet wird, um die Übersichtlichkeit zu wahren. - Darstellung verschiedener Feldtypen
Auch interaktive Elemente wie Upload-Felder, Checkboxen oder Radiobuttons können in den genannten Tabellentypen integriert werden.
Hinweis zur Barrierefreiheit
Wenn Sie eine Zusammenfassung mit individuellem HTML/CSS implementieren, ist es wichtig, einen semantisch korrekten Seitenaufbau sicherzustellen. Eine sorgfältige Beachtung von Semantik und Struktur trägt dazu bei, dass alle Inhalte von Screenreadern und anderen Assistenztechnologien optimal interpretiert werden können, um eine umfassende Nutzungserfahrung für alle zu gewährleisten.
Achten Sie bspw. auf folgende Dinge:
- Setzen Sie Checkboxen nicht mittels CSS-Content um. Sonst gibt der Screenreader diese nur aus, wenn sie aktiviert sind, während leere Checkboxen nicht vorgelesen werden. Verwenden Sie stattdessen das
<input type="checkbox">-Element. Dieses wird vom Screenreader in jedem Status – aktiv und deaktiviert – korrekt ausgegeben.
Werden Checkboxen in der Zusammenfassung als readonly-Elemente umgesetzt, erhalten Sie weiterhin Tastaturfokus. Dadurch entstehen viele unnötige Tabschritte. Verzichten Sie deshalb bei Checkboxen in der Zusammenfassung auf readonly-Attribute und verwenden stattdessen disabled-Attribute. - Geben Sie Inhalte, die visuell als Tabellen dargestellt werden, auch programmatisch als Tabellen aus. Screenreader können die Inhalte sonst nicht strukturiert wiedergeben und sind dann besonders für kognitiv eingeschränkte Nutzende nicht verständlich.
- Setzen Sie die Überschriftenelemente <h1> bis <h6> hierarchisch korrekt ein. Weitere Informationen zum richtigen Einsatz von Überschriften finden Sie im Abschnitt Barrierefreiheit.