Difference between revisions of "Pattern Layout"
| Line 222: | Line 222: | ||
| style="width:30%;"| Komponenten || style="width:30%;" | DLC || style="width:40%;" | GUI V3 (Komponenten Pubman/Imeji) | | style="width:30%;"| Komponenten || style="width:30%;" | DLC || style="width:40%;" | GUI V3 (Komponenten Pubman/Imeji) | ||
|- | |- | ||
| Application Layout || || | | <strong>Application Layout</strong> || || | ||
|- | |- | ||
| Header || || | | Header || || | ||
| Line 236: | Line 236: | ||
| Start Page || || | | Start Page || || | ||
|- | |- | ||
| Lists || || | | <strong>Lists</strong> || || | ||
|- | |- | ||
| Paginator (DD-VB View Item Body Media) || – || [[Paginator]] | | Paginator (DD-VB View Item Body Media) || – || [[Paginator]] | ||
| Line 244: | Line 244: | ||
| List media || || | | List media || || | ||
|- | |- | ||
| | | <strong>Detail View</strong>|| || | ||
|- | |||
| 2 Column Detail View || || | |||
|- | |||
| Item Meta Only || || | |||
|- | |||
| <strong>Forms</strong>|| || | |||
|} | |} | ||
Revision as of 12:35, 25 November 2011
| APPLICATION AREAS |
|---|
|
|
| PROJECTS |
|
Research- and Metadata Handling Corporate & Interface Design (under Rework) |
| edit |
Schriftart[edit]
Die Schriftart kann vom Institut oder den Projektpartnern frei gewählt werden. Bei der Verwendung mehrere Schriftfamilien sollte eine Antiqua (Times New Roman) und eine Grotesk Schrift (Arial) verwendet werden.
Die Anlehnung an ein bestehendes Corporate Design, bzw. eine Hausschrift sollte in Betracht gezogen werden.
Schriftschnitt[edit]
Der Schriftschnitt beinhaltet die Schriftstärke (normal, fett), Schriftbreite (schmal, normal, breit) und die Schriftlage (normal, kursiv).
| Schriftstärke | Normal | Wird in der Regel verwendet. |
| Bold | Als besondere Auszeichnung. | |
| Schriftbreite | Normal | Ausschliesslich |
| Schriftlage | Normal | Wird in der Regel verwendet |
| Italic | Zitate und Suchergebnisse in Copytext. |
Schriftgröße und Zeilenabstände[edit]
Die verwendeten Schriftgrößen müssen so gewählt werden, dass die Abstände dazwischen eindeutig sind.
| FS* | ZAB | Pattern | Beschreibung | Anwendung |
|---|---|---|---|---|
| 11 | – | Paginator | Seitenzahl (klein) | Basic |
| 14 | – | Paginator | Seitenzahl (mittel) | Basic |
| 18 | – | Paginator | Seitenzahl (groß) | Basic |
| 24 | – | Paginator | Seitenzahl (selected) | Basic |
| 16 | 20 | Bibliografische Ansicht, Item List | Titel | Basic |
| 20 | 24 | Bibliografische Ansicht, Item List | Titel | Advanced I, DigiLife (Mehrbandwerk) |
| 12 | 18 / 27* | Bibliografische Ansicht, Item List | Metadaten | Basic |
| 12 | – | Metanavigation | Links | Basic |
| 18 | – | Seitentitel | Seitentitel | Basic |
| 12 | – | Seitentitel | Breadcrumb | Basic |
| 12 | – | Seitentitel | Messages | Basic |
| 12 | – | Listenkopf (List Header) | Basic |
FS*= Schriftgröße, ZAB*=Zeilenbstand in Pixel, 27*= 1,5 Zeilen (Strukturieren der Metadaten)
Allgemeine Abstände und Ausrichtung[edit]
| Element 1 | Element 2 | Wert |
| Icon | Label | horizontal, 10 px |
| Formelement | Text | horizontal, 6 px |
Farben[edit]
Keine Vorgaben. Umsetzung in Graustufen (Corporate Design). Contrast Analyzer, GUI Vorgaben Mindestwerte
| Hex | Element | Verwendung | Anwendung |
|---|---|---|---|
| #FFFFFF | Hintergrund | Grundsätzlich | Basic |
| #– | Hintergrund | Bib View (Hover) | Basic |
| #eef2f0 | Hintergrund | Seitentitel | Basic |
| #eef2f0 | Hintergrund | Supplement Material | Basic |
| #000000 | Link | Grundsätzlich | Basic |
| #555555 | Text | Grundsätzlich | Basic |
| #00aa11 | Hover | Grundsätzlich | Basic |
| #7f7f7f | Trennlinie | Paginator, Metanavigation, Itemlist | Basic |
| #- | Inaktiv | Paginator (z.B. erste und letzte Seite) | Basic |
| #00aa11 | Highlight (Aktive Auswahl) | Grundsätzlich | Basic |
| #- | Systemmessages (Erfolg) | z.B. Searchresult | Basic |
| #- | Systemmessages (Fehler) | Basic | |
| #b2b2b2 | Rahmen, Input und Dropdown | Paginator, Table Header, Metamenu… | Basic |
Pattern[edit]
Listen (DD-LB List Body)
Listenkopf (DD-LH List Header)
Metanavigation (NF-HM Horizontal Menu)
Paginator (DD-VB View Item Body Media)
Seitentitel (Optional mit Breadcrumb und Systemnachricht)
Supplement Material (Mediabar)
| Komponenten | DLC | GUI V3 (Komponenten Pubman/Imeji) |
| Application Layout | ||
| Header | ||
| Navigation Area | ||
| Metanavigation | ||
| Sitetitle | Seitentitel | |
| Breadcrumb | ||
| Start Page | ||
| Lists | ||
| Paginator (DD-VB View Item Body Media) | – | Paginator |
| List with 3 columns | ||
| List media | ||
| Detail View | ||
| 2 Column Detail View | ||
| Item Meta Only | ||
| Forms |