Die Startseite des Moduls “Recherche” folgt einem leicht anderen Aufbau als alle anderen Modul-Startseiten.
Jede Moduleinstiegsseite der Recherche besteht aus 3 Bereichen:
Dieser Seitentyp besteht aus folgenden Elementen. Die Reihenfolge der hier genannten Elemente enspricht auch der Fokusreihenfolge, wenn mit der Tastatur navigiert wird.
Beim initialen Öffnen der Seite sind die Standard-Suchparameter anhand der Rolle des Nutzenden vorgefüllt und der Tastaturfokus liegt im ersten dieser Standard-Suchparameter-Elemente.
Die Hauptnavigationsleiste füllt die komplette Bildschirmbreite und ist zu jedem Zeitpunkt sticky.
(siehe Headerleiste)
Der Seitentitel beinhaltet immer den Name des geöffneten Moduls. Dieser sollte mit der Bezeichnung des entsprechenden Eintrags in der Hauptnavigation übereinstimmen. In diesem Fall lautet der Seitentitel “Erweiterte Suche”. Der Schrifttyp ist H1.
(siehe Schriften)
Hier sind seltener benötigte Funktionen platziert, wie beispielsweise “Suche zurücksetzen” oder “Suche speichern”. Diese sind als Liste umgesetzt.
(siehe Button)
Es können beliebig viele Suchparameter-Gruppen untereinander angezeigt werden. Diese sind jeweils als Formularfeldgruppe umgesetzt und der Titel beschreibt den Objekttyp, auf den sich die enthaltenen Suchparameter-Elemente beziehen. Eine Gruppe kann 0-n Suchparameter-Elemente beinhalten. Diese sind entweder vom Fachprojekt vorgegeben oder können von Nutzenden manuell über einen sekundären Plus-Button innerhalb der Gruppe hinzugefügt werden.
Der tertiäre Button mit der Bezeichnung “[Objekt] hinzufügen” fügt entweder direkt eine weitere Suchparameter-Gruppe hinzu oder öffnet, falls mehrere Objekttypen zur Auswahl stehen, ein Pop-Up-Menü, in dem der Objekttyp gewählt werden kann. Nach Hinzufügen einer neuen Gruppe ist das erste interaktive Element darin anschließend fokussiert (siehe Button).
Der “Suche starten”-Button ist ein primärer Textbutton mit Lupen-Icon, der zu jedem Zeitpunkt aktiv ist. Auch nach Ausführen einer Suche bleibt der Button aktiv, damit Nutzende die Treffer jederzeit aktualisieren können. Der Tastaturfokus wird auf den ersten Tab im Ergebnisanzeige-Bereich gelegt. (siehe Button)
Dieser wird erst angezeigt, sobald die Suche über den Button “Suche starten” gestartet wurde.
Die Zwischenüberschrift “[Anzahl] Einträge gefunden” wird visuell nicht auf der Maske angezeigt. Vom Screenreader wird dieser Text immer ausgegeben, sobald der “Suche starten”-Button betätigt wurde und die Trefferzahl berechnet wurde.
Mit Tabs können die Suchergebnisse in einheitliche Objekttypen unterteilt (Beispiel: Verfahren, Beteiligte und Termine). Die Tabs sind dabei in ihrer voraussichtlich Häufigkeit der Nutzung sortiert (von links nach rechts). In Klammern hinter der Tab-Beschriftung wird jeweils die Anzahl der zu diesem Objekttyp gefundenen Ergebnisse angezeigt. Solange Suchergebnisse geladen werden, wird ein Ladesymbol in Klammern hinter der Tabbeschriftung angezeigt “.
(siehe Tab)
Über die Tabelleneinstellungen können beispielsweise die Spalten und deren Reihenfolge konfiguriert und ggf. Mehrfachauswahl aktiviert bzw. deaktiviert werden.
(siehe Tabelle: Verhalten der Funktion “Tabellen-Einstellungen”)
Im Inhaltsbereich werden alle Suchergebnisse angezeigt, die zu den oberhalb definierten Suchparametern passen.
(siehe Tabelle)
(optional, je nach Fenstergröße)
Bei alle Fensterbreiten über 800px gilt:
Elemente | Verhalten |
|---|---|
Headerleiste | Komplette Fensterbreite |
Seitentitel | Linksbündig ausgerichtet an der ersten Spalte des Seitenlayouts; Maximale Breite vor Umbruch: 6 Spalten |
Aktionsbuttons | Rechtsbündig ausgerichtet an der letzten Spalte des Seitenlayouts. Maximale Breite, bevor die Buttons mit Text zu reinen Icon-Buttons wechseln: 6 Spalten |
Suchparameter-Elemente | Angeordnet in zwei Listen, linksbündig ausgerichtet an der ersten Spalte des Seitenlayouts. Maximale Breite: 12 Spalten. Reicht der verfügbare Platz in der horizontalen nicht aus, so brechen die einzelnen Suchparameter-Elemente innerhalb der Listen um und die Listen werden mehrzeilig. Sobald die längste Suchparameter-Element nicht mehr im verfügbaren vertikalen Platz darstellbar ist, wechseln alle Suchparameter-Elemente zur responsiven Version und nehmen die gesamte Inhaltsbreite (alle Seitenlayout-Spalten) ein. |
Button “Suchparameter Hinzufügen” | Immer als letztes Element der Liste manuell hinzufügbarer Suchparameter-Elemente angeordnet. Sobald diese zur responsiven Version wechseln, immer unterhalb, linksbündig zur ersten Seitenlayout-Spalte angeordnet. |
Button “Suche Starten” | Linksbündig ausgerichtet an der ersten Spalte des Seitenlayouts |
Tabs | füllen alle 12 Spalten des Seitenlayouts |
Tabellen-Einstellungen | Rechtsbündig ausgerichtet an der letzten Spalte des Seitenlayouts |
Ergebnis-Tabelle | füllt alle 12 Spalten des Seitenlayouts |
Bei allen Fensterbreiten unter 800 Pixeln gilt abweichend:
TABELLE
Wenn Nutzende bei einer Fensterhöhe von über 1024 Pixeln scrollen, bleiben fast alle Elemente oberhalb des Tabelleninhalts sichtbar. Der Abstand zwischen Headerleiste und Seitentitel+Aktionsbuttons reduziert sich beim Scrollen von 48 auf 24px. Der Abstand zwischen Seitentitel und Suchparameter-Elementen reduziert sich beim Scrollen von 40 auf 32px.
Besonderheit: Nimmt der Suchparameter-Eingabebereich mehr als 50% der Fensterhöhe ein, so bleibt dieser beim Scrollen nicht sticky (so wird verhindert, dass bei schmaler Fensterbreite zu wenig Platz für den Ergebnisanzeige-Bereich bleibt). Dann gilt das gleiche Scrollverhalten wie bei 1023-960px.
Bei Fensterhöhen zwischen 1023 Pixeln und 960 Pixeln wird beim Scrollen der komplette Sucheingabe-Bereich ausgeblendet und nur noch die Headerleiste sowie der Ergebnisanzeige-Bereich bleibt sichtbar.
Wird bei einer Fensterhöhe unterhalb von 960 Pixeln gescrollt, so bleibt nur die Headerleiste und der Tabellenheader immer sichtbar.
H1: Seitentitel
H2: Anzahl Einträge; visuell Schrifttyp “Subhead”