Online-Design Manual 2020 - Farbwelt, Schrift und Anordnung für Instagram, Facebook, Twitter & Co - Jusos in der SPD
←
→
Transkription von Seiteninhalten
Wenn Ihr Browser die Seite nicht korrekt rendert, bitte, lesen Sie den Inhalt der Seite unten
Online-Design Manual 2020 Farbwelt, Schrift und Anordnung für Instagram, Facebook, Twitter & Co.
Orange
Farbwelt
R G B I C M Y K I #
255 115 86 0 67 62 0 ff7356
Flieder
R G B I C M Y K I #
239 172 255 18 38 0 0 efacff
Grün
R G B I C M Y K I #
166 248 143 39 9 60 0 a6f88f
Blau
R G B I C M Y K I #
150 184 193 46 17 22 1 96b8c1
Petrol
R G B I C M Y K I #
32 82 105 88 55 38 28 205269
Rot (Logo)
R G B I C M Y K I #
227 6 19 0 100 100 0 e30613
Farbwelt
Orange
Farbwelt
R G B I C M Y K I #
255 115 86 0 67 62 0 ff7356
Flieder
R G B I C M Y K I #
239 172 255 18 38 0 0 efacff
Grün
R G B I C M Y K I #
166 248 143 39 9 60 0 a6f88f
Blau
R G B I C M Y K I #
150 184 193 46 17 22 1 96b8c1
Petrol
R G B I C M Y K I #
32 82 105 88 55 38 28 205269
Rot (Logo)
R G B I C M Y K I #
227 6 19 0 100 100 0 e30613
Schriftfarbe beachten Farbwelt
Unser Ziel: Barrierearme Gestaltung
Schriftfarbe beachten Dafür ist es wichtig, die Kontraste zwischen Hintergrund- und
Schriftfarbe möglichst stark zu machen. Verwendet deshalab auf
helleren Hintergründen schwarze und auf den
dunklen Hintergründen weiße Schrift.
Schriftfarbe beachten
Schriftfarbe beachten
Schriftfarbe beachten
Schriftfarbe beachten
Schrift
Headline, Subline, Hashtag
Futura PT Cond Extra Bold
Futura PT Cond Medium
#FUTURAPTCOND Book Großbuchstaben
alternativ
Open Sans Extra Bold vertikal auf 120% skaliert
Open Sans Regular vertikal auf 120% skaliert
#OPENSANS Regular vertikal auf 120% skaliert, Großbuchstaben
Inhalte und Anordnung
Headline,
InhalteSubline,
und Anordnung
Hashtag
Aussagen mit und ohne Symbolbild Zitate mit und ohne Symbolbild
Es gibt 4 Hauptarten von Inhalten
Aussagen und Zitate jeweils mit und ohne Bild
sowie Forderungsslisten
Inhalte und Anordnung
Aussage mit Bild
Innerer Rahmen zur Orientierung, darf am Ende nicht sichtbar sein
Farbbalken unterlegen die Headline
alle sind gleichlang, orientiert an der längesten Zeile
Farbbalken unterlegen die Subline
alle sind gleichlang, orientiert an der längsten Zeile
einzelne Wörter, Wortgruppen oder alles ist farbig unterstrichen
Hintergrundbild/ Symbolbild
Urheberrechte müssen beachtet werden
Gestaltung folgt Vorgaben unter „Bilder“
Balken am unteren Ende der Grafik
Hashtag
sitzt am linken inneren Rand und schließt knapp an der Unterkante des
Balkens ab, ist optional
Logo
liegt rechts am inneren Rand und übersteigt den Balken oberhlab der FaustInhalte und Anordnung
Aussage ohne Bild
Innerer Rahmen zur Orientierung, darf am Ende nicht sichtbar sein
Headline
Subline
einzelne Wörter, Wortgruppen oder alles ist farbig unterstrichen
Farbfläche im Hintergrund
Hashtag
Untere Kante schließt mit unterer Kante des Logos ab
Logo
liegt rechts am inneren Rand und übersteigt den Balken oberhalb der FaustInhalte und Anordnung
Zitat mit Bild
Innerer Rahmen zur Orientierung, darf am Ende nicht sichtbar sein
Zitat
Bild
Logo
liegt rechts am inneren Rand und übersteigt den Balken oberhalb der FaustInhalte und Anordnung
Zitat ohne Bild
Innerer Rahmen zur Orientierung, darf am Ende nicht sichtbar sein
Name und Funktion
der Person hinter dem Zitat rechtsbündig,
Anführungszeichen als Symbol für Zitat linksbündig
Hintergrundfarbe
Zitat
Logo
liegt rechts am inneren Rand und übersteigt den Balken oberhalb der FaustFormate und Plattformen
Formate und Plattformen
Instagram Feed und Instagram Story
900x900 px, mind. 72 ppi I 1080x1920px, mind. 72 ppi, PNG oder JPG
Facebook Beitragsbild
940x788 px, mind. 72 ppi, PNG oder JPG
Twitter Beitragsbild
1200x675 px, mind. 72 ppi, PNG oder JPG - wichtig ist das Verhältnis 16:9 für die mobile Ansicht,
die immer im Fordergrund stehen sollte
Achtet auf die verschiedenen Größen, ein abgeschnittenes Beitragsbild sollte vermieden werden.
Sucht immer mal wieder nach aktuellen Maßen, da sich hin und wieder Details ändern können.Bildsprache
Bildsprache Original und Hintergrundbild
Bildsprache
Original und Hintergrundbild
kühle Farben, hoher Kontrast, starke Weißtöne
und abhängig von den Bildern, hier ist es gut
selbst etwas auszuprobieren, bis es pass
Plattformen für frei kostenfrei zu verwendende Bilder sind z.B.
https://unsplash.com/
https://pixabay.com/de/Ihr habt Fragen?
Juso-Bundesbüro
Willy-Brandt-Haus
Wilhelmstr. 140, 10963 Berlin
Tel.: 030-25-991-366
Fax: 030-25-991-415
jusos@spd.deSie können auch lesen
