Weiße Ränder bei Text als Bild?!

[derhesse]

Hallo,

habe folgendes Problem:
Ich möchte auf einer sehr simplen Homepage meine Texte als Bild anzeigen, diese sollen dann auf einer farbigen Vollfläche stehen. Also quasi ein GIF ohne Hintergrund, bzw. Transparenz.

Soweit hab ich das in Photoshop auch hinbekommen, nur wenn ich dann durch das GIF-Bild meinen Text darstellen möchte, habe ich auf der Homepage um den Text herum immer eine weiße Kontur, die unprofessionell aussieht und einem Blitzer gleichkommt.

Was müsste ich tun, bzw. welche Schritte in Photoshop machen, damit diese Blitzer nicht entstehen und man keinen Übergang zwischen Text und Hintergrundfläche sieht?

Vielen Dank im Vorraus

Lg, derhesse

 

[Herr Sin]

Stell mal bei deiner Schrift das Antialiasing (Kantenglättung) ab.

Ich weiß zwar nicht, was du als Text darstellen willst, aber genau das finde ich meist auch unprofessionell. Warum kein "normaler" Text?

 

[Nighthawk]

Das kommt wohl von der Kantenglättung, die einen kleinen Rand um den Text einfügt. Bei Gimp zumindest kann man die abschalten, bei PS bin ich mir nicht sicher.

Allerdings bin ich der Meinung, dass Texte als Bild nur viele Probleme schafft und ich sehe auch keinen Vorteil dabei.

EDIT: Zu spät

 

[derhesse]

Die Seite wurde nicht von mir gemacht, ich bin nur derjenige der es jetzt ausbaden darf. *grml*

Nunja, damit ihr besser seht, was ich meine. www.musik-im-museum.org

Diese Texte müssen aktualisiert werden, also auf Stand 2007

Wo finde ich denn das mit dem Antialiasing beim Text?

 

[Nighthawk]

Die Kantenglättung findest du irgendwo in der Menüleiste, wenn das Textwerkzeug ausgewählt ist.

 

[Herr Sin]

Wow. Da ist ja kein einziger Text auf der Seite: nur Bilder.

Die Kantenglättung findest du in deinem Grafikprogramm. Das hat nichts mit HTML zu tun.

 

[derhesse]

Aber wo da genau? Also bei PS. Wenn ich Glättung auf OHNE stelle, dann ist der Text total verpixelt... Brauche das Ergebnis so wie vorhanden auf der Seite. *Leider*

 

[klausimausi]

Da hilft nur der alte Trick, den Text NICHT freizustellen, sondern auf einem Hintergrund in der selben Farbe wie der Hintergrund der Website (#F7af1a in Deinem Fall) zu "komponieren"!

GIF KANN leider nur 1-Bit Transparenz, das sieht dann bei Deinen Anforderungen immer Kacke aus


Gruß

Klaus

 

[Nighthawk]

Spricht was gegen PNG?

 

[Herr Sin]

Aber wo da genau? Also bei PS. Wenn ich Glättung auf OHNE stelle, dann ist der Text total verpixelt... Brauche das Ergebnis so wie vorhanden auf der Seite. *Leider*

Das ist klar, dass es dann verpixelt wirkt. Du bist dir im klaren, was bei Kantenglättung passiert? Bzw. warum es ohne Glättung so verpixelt aussieht?

Wenn du es so wie auf der Seite haben willst, muss die Kantenglättung eingeschalten bleiben.

 

[Herr Sin]

Spricht was gegen PNG?

Nicht alle Browser zeigen PNG sauber an.

 

[derhesse]

Ja, es muss leider so wie auf der Homepage sein, nur wie krieg ich dann das Problem mit meinem weißen Rand in den Griff, die GIFs die hier zugrunde liegen, scheinen eine Umrandung in Hintergrundfarbe zu haben, so dass es keine Blitzer gibt. Wie wurde das denn mit PS gemacht?
Kann das jemand von euch nachvollziehen??

 

[landplage]

Ich würde die Seiten umbauen und Text als Text darstellen.
Das "handschriftliche" Logo kann ja als Bild belieben.
Sonst fängst Du bei jeder Programmänderung (z. B. anderer Künsterler wegen Erkrankung) wieder von vorn an.

 

[Herr Sin]

Öffne in Photoshop ein neues Dokument. Hintergrund in der Farbe der Webseite einfärben. Text schreiben.

 

[Herr Sin]

Ich würde die Seiten umbauen und Text als Text darstellen.
Das "handschriftliche" Logo kann ja als Bild belieben.
Sonst fängst Du bei jeder Programmänderung (z. B. anderer Künsterler wegen Erkrankung) wieder von vorn an.

Meine Rede:

Ich weiß zwar nicht, was du als Text darstellen willst, aber genau das finde ich meist auch unprofessionell. Warum kein "normaler" Text?

 

[landplage]

Nachtrag: Wenn Du keinen Text, keine Überschriften usw. auf der Webseite hast, kann Google damit nichts anfangen.
Bei den Bildern fehlen auch noch die Alternativtexte - ganz schlecht.

Nur so, als Argument für den Umbau.

 

[landplage]

Meine Rede:

Ich wollte Dir doch nur zur Seite springen. So wie die Seite jetzt aufgebaut ist, das tut doch richtig weh.

 

[derhesse]

Vielen Dank für eure regen Beiträge, es geht hier eigentlich weniger um die perfekte Umsetzung, ich will einfach nachvollziehen, wie derjenige der das gemacht hat, dies genau so gemacht hat. Also dass der Text in dem Bild so umrandet ist, dass man keine Blitzer in der Darstellung sieht.

Hoffe ich hab mich verständlich genug ausgedrückt?!

 

[Herr Sin]

Vielen Dank für eure regen Beiträge, es geht hier eigentlich weniger um die perfekte Umsetzung, ich will einfach nachvollziehen, wie derjenige der das gemacht hat, dies genau so gemacht hat. Also dass der Text in dem Bild so umrandet ist, dass man keine Blitzer in der Darstellung sieht.

Hoffe ich hab mich verständlich genug ausgedrückt?!

Wir haben uns doch auch verständlich ausgedrückt:

Da hilft nur der alte Trick, den Text NICHT freizustellen, sondern auf einem Hintergrund in der selben Farbe wie der Hintergrund der Website (#F7af1a in Deinem Fall) zu "komponieren"!

Öffne in Photoshop ein neues Dokument. Hintergrund in der Farbe der Webseite einfärben. Text schreiben.

 

[nickcaveman]

typische »grafiker bietet fullservice an, hat aber keine ahnung von html und css« seite.

ich selber habe auch keine ahnung davon, deshalb lasse ich das dann auch nach meinen vorlagen von leuten machen, die das können.

wie hier schon mehrmals erwähnt worde, ist es das beste, den text als text einzubauen. dann hat man bei späteren änderungen auch bedeutend weniger arbeit.
und natürlich ist die seitengrösse auch erheblich kleiner.

ansonsten so machen, wie ebenfalls schon erwähnt: den orangeton in photoshop als hintergrungfarbe nehmen, text rauf, über »für websepeicher« speichern, möglichst mit wenigen farben (8 dürften reichen) und fertig ist es.

achja, bei solchen grafiken (grosse farbflächen) immer gif nehmen und nicht jpeg, da sonst ekelige fraktale enstehen. und ausserdem sind gifs bei farbflächengrafiken auch kleiner.

ps: warum willst du denn eigentlich, das die hintergrungfarbe transparent ist? macht doch gar keinen sinn, wenn sie immer auf dem gleichen orange