Antialias auf Farbverlauf

[Mark]

Hallo,

ich habe ein Problem mit einer Logo-Grafik, die auf einem Hintergrund mit Farbverlauf angezeigt werden soll. Als Bildbearbeitungsprogramm steht mir Photoshop zur Verfügung. Damit kann ich beim Speichern des Logos eine Hintergrundfarbe angeben, doch mit einem mittleren Farbwert des Farbverlaufes sieht es immernoch unschön aus.

Hier das Original-Logo:

Mein bisheriger Versuch auf dem Hintergrund-Farbverlauf:
http://procosara.org/index_de

Was ich bräuchte, wäre die Möglichkeit, statt nur der Hintergrundfarbe ein Hintergrundbild anzugeben. Geht das mit Photoshop oder einem anderen Grafik-Programm? Oder hat jemand eine andere Idee? Oder sollte ich einen ganz neuen Layout-Ansatz machen?

Danke im Voraus!
Mark

[Mathias Brodala]

Hallo Mark.

Hier das Original-Logo:

Mein bisheriger Versuch auf dem Hintergrund-Farbverlauf:
http://procosara.org/index_de

[…] Oder hat jemand eine andere Idee?

Ja: Erkenne die wunderbaren Vorzüge des PNG-Formates und nutze sie.

Damit es im IE auch noch akzeptabel aussieht, empfehle ich folgendes:

<div class="left"><a href="http://procosara.org/"><img src="images/blank.gif" alt="Pro Cosara" /></a></div>

(blank.gif ist, wie der Name schon sagt, eine volltransparente GIF-Grafik)

Dazu das CSS:

div.left img {  
  background:url(logo.png) no-repeat center; /* Für Browser */  
}  
  
* html div.left img {  
  background-image:url(logo.gif); /* Für den IE */  
}

(Letzteres ist natürlich deine derzeitige Grafik.)

Einen schönen Mittwoch noch.

Gruß, Mathias

[Mark]

Hallo Mathias,

danke für Deine Antwort, das hört sich sehr vielversprechend an! Zwei Fragen hätte ich dazu noch:

• Was mus ich beim Erstellen der PNG-Grafik beachten?

• Wenn ich es richtig verstehe, macht die Lösung optisch leider keinen Unterschied im IE, oder?

Grüße
Mark

[Mathias Brodala]

Hallo Mark.

danke für Deine Antwort, das hört sich sehr vielversprechend an! Zwei Fragen hätte ich dazu noch:

• Was mus ich beim Erstellen der PNG-Grafik beachten?

Im Grunde nur eines: dass du einen volltransparenten Hintergrund festlegst. Die Alphatransparenz sorgt dann an den Kanten der Schrift für glatte Übergänge.

• Wenn ich es richtig verstehe, macht die Lösung optisch leider keinen Unterschied im IE, oder?

Ja, zumindest bis Version 7.

Einen schönen Mittwoch noch.

Gruß, Mathias

[Mark]

Hallo Mathias,

• Was mus ich beim Erstellen der PNG-Grafik beachten?

Im Grunde nur eines: dass du einen volltransparenten Hintergrund festlegst. Die Alphatransparenz sorgt dann an den Kanten der Schrift für glatte Übergänge.

OK, danke! Ich versuche das mal.

Grüße
Mark