Farbgestaltung & Typographie bei Webseiten

Farbgestaltung & Typografie bei Webseiten

Was der Webdesigner wissen sollte.

QUELLE http://www.genial-wohnen.de/Bilder/wohnen/Wand-streichen_by_RainerSturm_pixeliode.jpg

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu beachten?3. Wie wird richtig mit Kontrasten gearbeitet?4. Welche Wirkung können Farben haben?

2. Typografische-Regeln

Wie würde das Internet wohl ohne Farbe aussehen?

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu beachten?3. Wie wird richtig mit Kontrasten gearbeitet?4. Welche Wirkung können Farben haben?

2. Typografische-Regeln

Wozu dienen Farben in Webseiten

Corporate Design

Wozu dienen Farben in Webseiten

Farblich stimmiges Gesamtbild

Quelle: http://www.drweb.de/magazin/auch-das-gehort-zur-usability-farben-furs-webdesign-teil-2/

Wozu dienen Farben in Webseiten

Orientierung erleichtern

Usability

Wozu dienen Farben in Webseiten

Orientierungshilfe

Wozu dienen Farben in Webseiten

Farbleitsystem (ARD, SpiegelOnline, futerzone.at)

Wozu dienen Farben in Webseiten

Handlungsaufforderung (http://finderly.com/)

Wozu dienen Farben in Webseiten

Hervorhebung, Betonung, Auffallen, Einprägen

Quelle: http://www.drweb.de/magazin/auch-das-gehort-zur-usability-farben-furs-webdesign-teil-2/

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu

beachten?3. Wie wird richtig mit Kontrasten gearbeitet?4. Welche Wirkung können Farben haben?

2. Typografische-Regeln

Was ist technisch zu beachten

Farbverbindlichkeito Hardwareo Helligkeit, Kontrast, Farbtemperaturo Blickwinkelo Lichtverhältnisse

Monitor kalibrieren und Normlicht verwenden

Was ist technisch zu beachteno Bildschirmfarben (RGB)

Quelle: http://blog.xritephoto.com/wp-content/uploads/2010/05/CMYK-in-Adobe-RGB.jpg

Schnittmenge verwenden

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu beachten?3. Wie wird richtig mit Kontrasten

gearbeitet?4. Welche Wirkung können Farben haben?

2. Typografische-Regeln

Richtig mit Kontrasten arbeiten

Hintergrundo Kein zu hoher Kontrasto Steht auch optisch hinteno Pastellfarben für Hintergründe

Textfarbeo Kein zu hoher Kontrasto Keine komplementäre Farbe zum Hintergrundo Bei längerem Text weder S/W noch W/So Farbfehlsichtigkeit beachten

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu beachten?3. Wie wird richtig mit Kontrasten gearbeitet?4. Welche Wirkung können Farben

haben? 2. Typografische-Regeln

Wirkung von Farben

o Assoziationen und Emotioneno Eure Lieblingsfarben?

BlauRot

Grün

Wirkung von Farben

Meist genutzte Farbe im Web?

Quelle: http://www.colourlovers.com/

BLAU

Quelle: http://www.colourlovers.com/

Inhalt

1. Farbgestaltung1. Wozu dienen Farben in Webseiten? 2. Was ist technisch zu beachten?3. Wie wird richtig mit Kontrasten gearbeitet?4. Welche Wirkung können Farben haben?

2. Typografische-Regeln

Typografie – Regeln

o Selbststrahler statt Reflektiono Systemschriften statt Druckschrifteno Pixelfonts ja aber nicht in HTMLo Unterstrichen werden nur Links

Typografie – Regeln

o Kernaussagen statt Romaneo Texte gliederno Längere Text einleiten und dem

Nutzer die Wahl lassen, zusätzlich per PDF

Vielen Dankfür Ihre

Aufmerksamkeit