kostenloser Webspace werbefrei: lima-city

Helles Grau, das noch auf weiß angenehm lesbar ist?

lima-city → Forum → Die eigene Homepage → Grafikdesign

1. Autor dieses Themas

   s*****d

   11:45, 10.5.2014

   Hi!
   Ich arbeite zur Zeit an einem neuen Design und es soll sehr hell werden. Nach möglichkeit also weißer Hintergrund und auch ein relativ helles Grau für die Schrift. Ich frage mich nun aber bis zu welchem Graufarbton die Farbe auf weiß noch gut zu lesen ist? Kenntvihr dazu irgendwelche Studien oder so? Habe bereits etwas gesucht aber nichts gefunden... Oder könnt ihr aus eigener Erfahrung sprechen? Ich möchte ungern ständig die ganzen Grautöne ausprobieren müssen.
   
   MfG. Simon D.

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. tchab

   tchab hat kostenlosen Webspace.

   12:05, 10.5.2014

   1. Ich hoffe, dein Monitor ist kalibriert, sonst macht das ganze keinen Sinn.
   2. Ich hoffe, du hast genügend Endgeräte, um verschieden Displays zu testen.
   
   Wenn ja:
   Öffne Inkscape, erstelle eine Form und ändere die Farbe. Dank den Slidern, die du bekommst, wenn du doppelt auf die Farben drückst kannst du schnell etwas finden, ohne umständlich hin und her zu müssen.
   
   Ansonsten würde ich nochmal überlegen, ob du Texte wirklich schlecht leserlich (weil kontrastarm) nutzen möchtest. :)

4. onur-yavuz

   onur-yavuz hat kostenlosen Webspace.

   12:41, 10.5.2014

   Helles Grau auf weiß... naja... du könntest ja text schatten verwenden.
   Hier ein Beispiel:
   
   

   p
   {
       background: #fff;
       color: #CCCCCC;
       text-shadow: 0 -1px 0px #666666, 0 1px 1px #FFFFFF;
   }

   
   
   Bild
   
   Bei kleiner Schrift und auf älteren Displays wirkt es leicht verschwommen.
   
   Ohne Text Schatten würde ich dir bei der Textfarbe mindestens #888 empfehlen. Hintergrund kann weiß bleiben.
   
   Du kannst dir ja meine Website anschauen, helles Design, Hintergrund #f1f1f1, Textfarbe #797777
   
   Wie tchab auch schon erwähnt hat, müsstest du das auf verschiedenen Displays testen. Ich hab früher auch eine helle Textfarbe verwendet und als ich sah, dass man auf älteren Display fast nichts erkennen konnte, hab ich eine dunklere Textfarbe verwendet.
   
   Hier ein paar Websiten: http://webmagazin.de/sites/default/files/u2372/3_16.png http://www.elmastudio.de/wp-content/uploads/2010/10/webdesign-ueber-uns-seiten-14.jpg http://t3n.de/news/wp-content/uploads/2012/05/minimalistisches_webdesign_1.jpg
   
   Bei dem letzten Beispiel ist die Textfarbe #b7b8ba, etwas hell, aber der Text ist fett gedruckt.
5. Autor dieses Themas

   s*****d

   13:44, 10.5.2014

   Hi!
   Danke tchab und onur-yavuz für die Antworten!!
   Ich habe mit Inkscape und http://colorschemedesigner.com/ etwas rumgespielt und bin zu Schluss, gekommen, dass es doch ein etwas dunkleres Grau nehmen werde, da ich das Design responsiv auch für Handys und Tablets verfügbar machen möchte. Ich werde, denke ich #565656 nehmen und für Sachen, die auch heller sein können/sollen nehme ich #737373. Denkt ihr, dass das gehen wird? Es schein auf Notebook, PC, Tablet und Handy, ganz ok auszuschauen.
   
   MfG. Simon D.

6. fatfreddy

   

   fatfreddy hat kostenlosen Webspace.

   17:02, 10.5.2014

   Studien gibt es, zumindest in englisch. Mal mit den Stichworten luminosity contrast ratio u. accessibility googeln.
   
   Das W3C gibt in den Richtlinien zur Barrierefreiheit (WCAG 2.0) Empfehlungen zum minimalen Kontrastverhältnis [Link: Contrast(Minimum)]
   
   Ein Grauwert von #737373 liegt schon am Rande des empfohlenen Kontrastverhältnisses von 4,5:1
   
   Diese Empfehlung ist wirklich nur als Näherungswert zu sehen, der (wie die Vorposter schon schrieben) einen sauber eingestellten, fehlerfrei funktionierenden Monitor und einen durschnittlich gut sehenden Leser voraussetzt. Abhängig ist die Wirkung und Lesbarkeit zusätzlich von Schriftgröße, -stärke und den Lichtverhältnissen rund um den Monitor beim Anwender.
   
   Zur schnellen Bestimmung des Kontrastverhältnisses gibt es auch Tools. z.B. dieses:
   Luminosity Colour Contrast Ratio Analyser
   
   Meine Empfehlung: Gerade bei kleinerer Schrift und Fließtext einen hohen Kontrastwert wählen. Lesbarkeit ist wichtiger, als Design.

7. nyhavn

   

   nyhavn hat kostenlosen Webspace.

   17:00, 4.8.2014

   Ich wusste zugegeben nicht, dass es diese Studien gibt, aber ich denke auch, dass das nur dann für den User Sinn macht wenn man sich da auch auskennt... also helles Grau auf Weiß macht für mich nur dann Sinn, wenn auch ein Schatten dabei ist.

8. germantypography

   germantypography hat kostenlosen Webspace.

   4:52, 2.10.2014

   Habe es selber mal auf einer Website angewendet, sieht ganz nett aus.
   Nur das ganze hatte für meine erst einen Sinn nachdem ich einen Schatten hinzugefügt habe, da es sonst auf verschieden Geräten immer verschieden zu sehen war.. :)

9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?