Frage von attributan 30.06.2011

Soll man für CSS eher Hex oder RGB für Farben benutzen?

  • Antwort von derwendtde 30.06.2011

    Eine begründete Frage, die leider nicht pauschal beantwortet werden kann: Im "Krieg der Farbdefinitionen" gibt es keine eindeutigen Sieger, weil es auf den Verwendungszweck ankommt. Es gibt sogar Fälle, wo man beide Formen mixen muss:

    • Verwende für einfache Seiten mit wenig Besuchern ruhigen Gewissens RGB, da kann man sich etwas mehr unter der Notation vorstellen als bei HEX. Ebay zB wandelt im HTML-Editor HEX automatisch in RGB um.

    • Nutze HEX, wenn es auf jedes Bit ankommt und das CSS in minimierter, ZIP-komprimierter Form ausgegeben wird, d.h. ohne Einrückung, Zeilenschaltung etc. Dies ist besonders bei Seiten mit sehr vielen Zugriffen pro Tag sinnvoll, wenn für den Daten-Traffic bezahlt werden muss.

    • Nutze RGBA, wenn Transparenz ins Spiel kommt.

    • Nutze eine Mischform mit HEX mit 4 Farbgruppen, wenn Du Transparenz an jeden Browser übergeben willst, siehe .box_rgba Beispiel auf http://css3please.com/ . Damit kommen einzig die grässlichen IE-Filter zuverlässig zurecht – das allerdings schon lange, es ist keine CSS3-Spezifikation.

    Um die Verwirrung komplett zu machen: Es gibt einen CSS3 Spezifikationsentwurf für ein weiteres Format, nämlich HSL(A).

    Hue, Saturation, Lightness, (Alpha) stehen für:

    • den Winkel auf dem Farbkreis (Dezimal-Ganzzahl von 0-359)

    • Die Sättigung (Abstand vom Mittelpunkt in %)

    • Die Belichtung (Hell/Dunkel in %)

    • Alpha-Kanal Transparenz, in Dezimalzahl

    Ein Beispiel sieht dann so aus:

    em { color: hsla(120, 100%, 50%, .5) }
    

    Der große Vorteil von HSL ist, dass Farbschemata mit der bloßen Veränderung des Winkels zB. in 15° Schritten sehr leicht umsetzbar ist. Unterstützt wird das Format von FF und Safari ab Version 3, von Opera evtl. seit V 9, von Camino und IE kleiner 9 allerdings gar nicht.

    Zum Ausprobieren von HSL sieh Dir mal mothereffinghsl.com/ an.

Bitte noch eine Antwort ... Frage erneut stellen

Verwandte Fragen

Fragen Sie die Community –

anonym und kostenlos!