Header-❌
1. Was macht das Modul?
- Das Modul dient zur Orientierung und Navigation.
2. Wann soll das Modul eingesetzt werden?
- Das Modul erscheint auf jeder Seite direkt unter der Status Bar.
3. Regeln
- Der Header besteht aus dem Navigationsicon («Menü-Icon», «Kreuz» oder «Pfeil links»), Titel und Signet.
- Das «Menü-Icon» öffnet das Menü.
- Der «Pfeil links» navigiert zurück auf die vorhergehende Seite.
- Das «Kreuz» schliesst die angezeigte Seite.
- Titel beschreibt den Inhalt der Funktion/Seite.
- Das Signet verlinkt auf die Startseite.
4. Ausprägungen
4.1 Mit Menü-Icon
Design Spezifikation
- iOS, Default: Light, Dark
- iOS, Large: Light, Dark
- Android, Default: Light, Dark
- Android, Large: Light, Dark
4.2 Mit Abbrechen-Button
Design Spezifikation
- iOS, Default: Light, Dark
- iOS, Large: Light, Dark
- Android, Default: Light, Dark
- Android, Large: Light, Dark
4.3 Mit Pfeil nach links
- Wird verwendet wenn innerhalb von Hierarchiestufen navigiert wird.
- Das einblenden der aufgerufenen Funktion/Seite wird von links nach rechts animiert.
Design Spezifikation
- iOS, Default: Light, Dark
- iOS, Large: Light, Dark
- Android, Default: Light, Dark
- Android, Large: Light, Dark
4.4 Mit Schliessen-Icon
- Wird verwendet wenn nicht in die Tiefe navigiert wird. z.B. im Menü.
- Das einblenden der aufgerufenen Funktion/Seite wird von unten nach oben animiert.
- Wenn von einer Seite mit Schliessen-Icon weiternavigiert wird, muss auf der nächsten Funktion/Seite der Header mit Pfeil nach links verwendet werden.
Design Spezifikation
1. Was macht das Modul?
- Das Modul dient zur Orientierung und Navigation.
2. Wann soll das Modul eingesetzt werden?
- Das Modul erscheint auf jeder Seite direkt unter der Status Bar.
3. Regeln
- Der Header besteht aus dem Navigationsicon («Menü-Icon», «Kreuz» oder «Pfeil links»), Titel und Signet.
- Das «Menü-Icon» öffnet das Menü.
- Der «Pfeil links» navigiert zurück auf die vorhergehende Seite.
- Das «Kreuz» schliesst die angezeigte Seite.
- Titel beschreibt den Inhalt der Funktion/Seite.
- Das Signet verlinkt auf die Startseite.
4. Ausprägungen
4.1 Startseite mit Menü-Icon
- Darf ausschliesslich auf der Startseite eingesetzt werden.
Design Spezifikation
4.2 Mit Pfeil nach links
- Wird verwendet wenn innerhalb von Hierarchiestufen navigiert wird.
- Das einblenden der aufgerufenen Funktion/Seite wird von links nach rechts animiert.
Design Spezifikation
4.3 Mit Schliessen-Icon
- Wird verwendet wenn nicht in die Tiefe navigiert wird. z.B. im Menü.
- Das einblenden der aufgerufenen Funktion/Seite wird von unten nach oben animiert.
- Wenn von einer Seite mit Schliessen-Icon weiternavigiert wird, muss auf der nächsten Funktion/Seite der Header mit Pfeil nach links verwendet werden.