Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

--- styleguide [04.11.2019 09:51] – kevin
+++ styleguide [05.11.2019 15:57] (aktuell) – kevin
@@ Zeile 1: / Zeile 1: @@
-====== Farben ======
+====== Styleguide ======
-===== Primärfarben =====
+Gültig ab 2019. Angaben gelten fürs Web. Für Print gibt es derzeit keine Vorgaben, es sollte jedoch optisch möglichst zum web passen.
+===== Farben =====
+==== Primärfarben ====
 ^ Verwendung           ^ HEX      ^ Beispiel ^
 | Primärfarbe          | #dc0067  | <color #dc0067>■■■■■■■■■</color> |
@@ Zeile 6: / Zeile 9: @@
 | Links                | #009ee0  | <color #009ee0>■■■■■■■■■</color> |
-===== Sekundärfarben =====
+==== Sekundärfarben ====
-^ Verwendung                                 ^ HEX      ^ Beispiel ^
+^ Verwendung                       ^ HEX      ^ Beispiel                          ^
-| Hintergrund (hell)                         | #ffffff  | <color #ffffff>■■■■■■■■■</color> |
+| Hintergrund 1                    | #ffffff  | <color #ffffff>■■■■■■■■■</color>  |
-| Hintergrund (mittel)                       | #f7f7f7  | <color #f7f7f7>■■■■■■■■■</color> |
+| Hintergrund 2                    | #f7f7f7  | <color #f7f7f7>■■■■■■■■■</color>  |
-| Hintergrund (dunkel)                       | #333333  | <color #333333>■■■■■■■■■</color> |
+| Hintergrund 3                    | #ebebeb  | <color #ebebeb>■■■■■■■■■</color>  |
-| Fließtext (heller & mittlerer Hintergrund) | #666666  | <color #666666>■■■■■■■■■</color> |
+| Hintergrund 4                    | #333333  | <color #333333>■■■■■■■■■</color>  |
+| Fließtext (Auf Hintergrund 1-3)  | #666666  | <color #666666>■■■■■■■■■</color>  |
+| Fließtext (Auf Hintergrund 4)    | #ffffff  | <color #ffffff>■■■■■■■■■</color>  |
+===== Logo =====
+{{:werbematerial:logo:ffpi_baum_rz.svg?200 |}}
+----
-====== Logo ======
-{{ :werbematerial:logo:ffpi_baum_rz.svg?200 |}}
 Wann immer möglich sollte das Logo als Vectorgrafik genutzt werden. Sonst als PNG mit Transparenz.
-Befindet sich das Logo im Header gehört es an den Linken Rand des Contents. Das Logo sollte die Höhe einer Zeile Überschrift + eine Zeile Fließtext haben.
+Befindet sich das Logo im Header gehört es an den Linken Rand des Contents. Das Logo sollte die Höhe einer Zeile Überschrift + eine Zeile Fließtext haben.\\
+Beispiel:\\
+{{::styleguide:header_beispiel.png|}}
+===== Schriften =====
+Der "Freifunk Pinneberg" Schriftzug sollte nach möglichkeit in "Swiss911 XCm BT" sein. Da die Font nicht kostenlos genutzt werden kann, bietet sich als Alternative "Alternate Gothic No. 2 (BT)" mit Letterspacing -3% an, oder in allergrößter Not "Roboto Condensed"
+Allgemeine Überschriften sind in "Roboto Condensed Bold", fließtexte in "Roboto".\\
+Überschriften sind immer und Fett und sofern auf hellen Hintergrund in der Primärfarbe. Auf dunklem Hintergrund bietet sich Weiß an.

Wiki - Freifunk Pinneberg

Benutzer-Werkzeuge

Webseiten-Werkzeuge

Unterschiede

Seiten-Werkzeuge