Hier zeige ich einige Beispiele wie sich Hintergrundfarbe und Schriftfarbe im Webdesign zueinander verhalten. Die Lesbarkeit der Homepage sollte immer gegeben sein. Daher wird auch meist auf einen passenden Kontrast gesetzt. Es gibt allerdings Farbkombinationen, bei denen sich die Schriftfarbe mit der Hintergrundfarbe nicht verträgt und der Text flimmert auf dem Bildschirm, wenn er denn überhaupt zu lesen ist. Das gilt es zu vermeiden. Das Auge des Users sollte nicht schmerzen.
Gut lesbare Schriftfarbe auf farbigen Untergründen
Diese Farbhintergründe sind gut zu lesen, wenn die Schriftfarbe Schwarz oder Weiß ist. Zum Hervorheben sind sehr helle Schriftfarben auf dunklen Hintergrundfarben gut, aber eine ganze Seite ist damit eher schwierig zu lesen. Auch wenn das alten noch kennen, die mit einem c64 gearbeitet haben: Schwarzer Bildschirmhintergrund und weiße, hellgrüne oder hellblaue Schrift.
Hintergrundfarbe: #000000
Schriftfarbe: #ffffff
Hintergrundfarbe: #ffffff
Schriftfarbe: #000000
Hintergrundfarbe: #abb8c3
Schriftfarbe: #000000
Hintergrundfarbe: #f78da7
Schriftfarbe: #000000
Hintergrundfarbe: #cf2e2e
Schriftfarbe: #ffffff
Hintergrundfarbe: #ff6900
Schriftfarbe: #000000
Hintergrundfarbe: #fcb900
Schriftfarbe: #ffffff
Hintergrundfarbe: #7bdcb5
Schriftfarbe: #000000
Hintergrundfarbe: #00d084
Schriftfarbe: #ffffff
Hintergrundfarbe: #8ed1fc
Schriftfarbe: #ffffff
Hintergrundfarbe: #0693e3
Schriftfarbe: #ffffff
Hintergrundfarbe: #9b51e0
Schriftfarbe: #ffffff
Schwarzer Hintergrund mit verschiedenen Schriftfarben
Ein schwarzer Hintergrund mit hellen Schriftfarben, wie hellgrau, rosa, hell-orange, hellgrün und hellblau eignen sich für den Header, für manche Buttons oder die Menüleiste. Für den Body, also den allgemeinen Texthintergrund kann ich das nur bei Seiten empfehlen, die sich mit Hacken, Programmieren oder dunklen Geschäften und Stimmungen beschäftigen.
Hintergrundfarbe: #000000
Schriftfarbe: #abb8c3
Hintergrundfarbe: #000000
Schriftfarbe: #f78da7
Hintergrundfarbe: #000000
Schriftfarbe: #fcb900
Hintergrundfarbe: #000000
Schriftfarbe: #7bdcb5
Hintergrundfarbe: #000000
Schriftfarbe: #8ed1fc
Schlechte Farbkombinationen
Rot-Blau oder Magenta-Blau, Grün-Orange Hintergrund und Schriftfarben Kombinationen sind meistens sehr schwierig zu lesen.
Hintergrundfarbe: #cf2e2e
Schriftfarbe: #0693e3
Hintergrundfarbe: #7bdcb5
Schriftfarbe: #fcb900
Bei schlecht aufeinander abgestimmten Hintergrund- und Schriftfarben ist, dass der Text entweder unangenehm in den Augen flimmert oder gar nicht lesbar ist. Mit einer bestimmten Schriftgröße kann man das manchmal ausgleichen, aber bei bestimmten Farbkombinationen geht einfach nichts mehr.