Transparente PNGs im Internet Explorer 6 einsetzen
Bei der Gestaltung einer Website sind sie sehr hilfreich, PNG 24-Dateien mit Alphakanal, die fein abgestufte Transparenzen erlauben. Ob als Layoutgrafik für weiche und flexible Schatten oder für Buttons verwendet, die sich jedem Hintergrund anpassen können, bieten sie im Regelfall viele Vorteile und erweitern die Möglichkeiten, was im Webdesigns umgesetzt werden kann. Die gute Nachricht: Mehr und mehr Internetnutzer greifen auf Browser zurück, die den Alphakanal korrekt darstellen können.
Das Problem
Die schlechte Nachricht: Je nach Messung und statistischer Auswertung nutzen immer noch ca. 10 - 20 % den Internet Explorer 6 (Stand: Juni 2009), der einzige noch relevante Browser, der nativ PNG-Grafiken nicht im vollen Funktionsumfang unterstützt (und auch in vielen anderen Aspekten versagt). Zwar zeigt der IE6 PNGs an, jedoch wird jeder (semi-) transparente Pixel anstatt mit dem eigentlichen Hintergrund mit einer statischen, türkisähnlichen Hintergrundfarbe gerendert. Dieser Umstand ist weder schön noch ästhetisch tolerierbar. Das Ignorieren des Browsers ist häufig auch keine Lösung, da die wenigstens Website-Betreiber mindestens 1/10 ihrer Besucher verprellen möchten.

Um sich des Problems zu entledigen, existieren mehrere Wege. Zum einen ließe sich im IE6 gänzlich auf transparente PNGs verzichten und stattdessen GIFs einsetzen. Da diese aber nur die Zustände durchsichtig oder Vollfarbe kennen, entsteht an Rändern meist eine unschöne Pixelkante. Weiterlesen …
Intelligentes Färben in Ebenengruppen
Insbesondere bei der Gestaltung von Buttons mit verschiedenen Zuständen (normal, aktiv, hover) probiert man in Photoshop gerne verschiedene Farbigkeiten aus. Besteht ein Button dabei aus mehreren Ebenen wäre der naheliegende Weg das Zuweisen der neuen Farbe für jede einzelne Ebene. Wie es geschickter geht, zeigt dieser Mini-Workshop.
1. Ebene gruppieren und einstellen
Fasst zunächst alle Ebenen die zum Button gehören in einer Gruppe zusammen.

Anschließend markiert Ihr die oberste Ebene darin und erstellt eine neue Einstellungsebene “Farbton/Sättigung” über das entsprechende Icon im Fuß der Ebenenpalette. Weiterlesen …
