Sehr oft sieht man bei transparenten GIF's ausgefranste Kanten. Woher kommt das?
Nun, diese Frage ist einfach zu beantworten. Bildbearbeitungsprogramme arbeiten mit Pixel und die sind ja bekanntlich quadratisch. Müssen nun Rundungen dargestellt werden, sind diese "Treppen" unumgänglich. Das sieht zwar schlecht aus, ist nun mal aber so. Kann man was dagegen tun und wenn ja, wie?
Am oberen Button ist ganz deutlich der "Treppeneffekt zu sehen, während er beim unteren Button nahezu verschwunden ist.
Aber wie macht man das jetzt? Es ist eigentlich viel einfacher, als man denkt. Ich möchte es hier anhand von Photoshop erläutern.
Der normale Weg zur Herstellung von Buttons ist , diese zunächst in Photoshop (im PSD-Format) anzulegen. Es empfiehlt sich sogar, eine Hintergrundebene in der geplanten Hintergrundfarbe der Website, wo der Button eingesetzt werden soll, anzulegen und so den Farbwert der Web-Site zu erhalten. Wenn Sie den Farbwert haben, löschen Sie bitte diese Ebene wieder, sie wird nicht mehr benötigt. Solange der Button im PSD-Format vorliegt, sieht er einwandfrei aus. Wird er dann aber im GIF-Format gespeichert und auf der Website eingebunden, erscheinen die so ungeliebten Treppen.
Der Grund: Die Information, mit welcher Hintergrundfarbe das Antialiasing berechnet werden soll, fehlt beim GIF. Photoshop kann keine Antialiasing-Pixel anlegen, der Button bleibt fransig.
Um nun diese Treppen weitestgehend zu eliminieren, sind mehrere Schritt notwendig.
Diese Methode hat sich bestens bewährt, allerdings hat sie auch ihre Grenzen. Bei bereits vorhandenen GIF's ist eine nachträglich Bearbeitung in der Regel fast unmöglich. Sie benötigen dazu immer die Original PSD-Datei, also löschen Sie diese Datei nicht. Denn wenn Sie einmal die Hintergrundfarbe wechseln oder auf einer anderen Site einsetzen möchten, muss dieser Weg immer von vorne neu beschritten werden. |