Teiltransparentes Bild für Webhintergrund

[ralfeberle]

Hallo!

Im folgenden eine Anleitung, wie man mit FixFoto teiltransparente Bilder für den Hintergrund von Web-Seiten oder auch Web-Tabellen erstellen kann.

Verwendete FixFoto-Werkzeuge:

Farbabgleich
Bild überlagern
Schwarz-Weiß

---

Und los gehts...

1. Arbeitsgang:

Die Transparenz-Funktion befindet sich unter 'Bild überlagern' (s.u.). Wir brauchen aber für die Anwendung von 'Bild überlagern' eine weiße Fläche in der Größe unseres gewünschten Hintergrundbildes!

Alternativ zur folgenden gezeigten Möglichkeit gibts inzwischen in FixFoto ein weißes Bild zu erzeugen zwei weitere einfachere Methoden:

- 'Datei'...'neu' und im aufpoppenden Dialog unten dann Weiß als Hintergrundfarbe wählen
oder
- 'Auf-/Abblenden'...'Hell/Dunkel', Regler ganz rauf schieben.

Startbild:
<table> <tr><td>

</td><td>














[L]XX[/L]

</td></tr><tr><td>Dieses Bild soll unser Hintergrundbild werden.
In Wirklichkeit würde man meistens ein
größeres Bild nehmen, damit auf der Web-
Seite nicht der Kacheleffekt auftritt.
Wichtig: Wenn dieses Bild bearbeitet wurde,
dann vor Beginn dieser Anleitung es erst
speichern, am besten im TIF(F)-Format!</td><td>[L]XX[/L]1. Schritt: Farbabgleich - alle Regler ganz runter, dann OK klicken!






</td></tr><tr><td>

</td><td>















[L]XX[/L]

</td></tr><tr><td>Ergebnis von Schritt 1</td><td>[L]XX[/L]2. Schritt: Farbabgleich - Bild negativ schalten, dann OK klicken!</td></tr><tr><td>

</td><td>











[L]XX[/L]

</td></tr><tr><td>Ergebnis von Schritt 2 -
wir haben unser weißes Bild!</td><td>[L]XX[/L]3. Schritt: Werkzeug 'Bild überlagern' wählen!

</td></tr></table><table> <tr><td>

</td></tr><tr><td>4. Schritt: Maskenverzeichnis wählen, das heißt, hier nun das Verzeichnis, in dem
sich das Startbild befindet!</td></tr><tr><td>

</td></tr><tr><td>5. Schritt: Bild selektieren, Transparenz einstellen. Soll das teiltransparente Bild
hinter Schrift zu liegen kommen, muß diese noch lesbar sein. Daher empfehlen sich
Transparenzeinstellungen um die 55 +/- 30!
Wichtig: Um die Original-Bildfarben zu erhalten, Maskierungsfarbe 'Schwarz' wählen
- siehe roten Pfeil!</td></tr></table>

Fertig! So, damit hätten wir unser teiltransparentes Bild: Speichern!

---

2. & 3. Arbeitsgang:

Varianten von unserem teiltransparenten Bild erstellen:


<table> <tr><td>

</td></tr><tr><td>6. Schritt: Nachdem wir das teil-
transparente Ergebnis gespeichert
haben, gehen wir einfach wieder so
viele Schritte zurück, bis wir beim
Startbild sind!</td></tr></table>

<table> <tr><td>

</td><td>[L]XX[/L]

</td></tr><tr><td>7. Schritt: Werkzeug 'Schwarz-
Weiß'!


</td><td>[L]XX[/L]8. Schritt: Regler wie abgebildet eingestellt sorgen für
maximale Zeichnung des Himmels und machen das Grün
dunkel!
Wichtig: Speichern beim Startbild im selben Verzeichnis!</td></tr></table><table> <tr><td>

</td></tr><tr><td>9. Schritt: Bild kräftig (!) einfärben und Speichern!</td></tr><tr><td>

</td></tr><tr><td>10. Schritt: Nun gehen wir einfach wieder
so viele Schritte vorwärts, bis wir wieder
beim weißen Bild sind!</td></tr><tr><td>

</td></tr><tr><td>11. Schritt: Zweites Maskierungsbild wählen, lila Maskierungsfarbe wählen (roter
Pfeil), Transparenz einstellen! Wenn man genau hinsieht, fällt auf, daß hier das
gesamte Bild - also auch die schwarzen Äste den Lilaton annehmen!</td></tr><tr><td>

</td></tr><tr><td>12. Schritt: Drittes Maskierungsbild wählen, schwarze Maskierungsfarbe wählen
(roter Pfeil), Transparenz einstellen! Hier nun bleiben die Originalfarben wieder
erhalten und die Äste werden nicht gefärbt, sondern nur heller!</td></tr></table>
Viel Spaß beim Nachmachen!

Ralf

 

[guenter_w]

Re: Teiltransparentes Bild für Web-Hintergrund

Hallo Ralf!

Und hiermit verlassen wir den Optimierungssektor und begeben uns in die Bildbearbeitung! &nbsp;

Nachdem &quot;Colorkey&quot; implementiert wurde (so hintenrum), kommen durch die verschiedenen features der reinen Optimierung immer mehr echte Bearbeitungsmöglichkeiten hinzu. Toll!

Da muss dann Michael kräftig pdf-Dateien erstellen bis ein ganzer Wälzer zusammen ist, wenn noch mehr Tipps dazu kommen.

Gruß

Günter

 

[m.s]

Re: Teiltransparentes Bild für Web-Hintergrund

Da muss dann Michael kräftig pdf-Dateien erstellen bis ein ganzer Wälzer zusammen ist

da mache ich doch glatt ein buch draus: &quot;Das FixFoto Kompendium&quot; &nbsp;;D

 

[guenter_w]

Re: Teiltransparentes Bild für Web-Hintergrund

Hallo Micha!

Beim nächsten Treffen geb ich dann einen aus - Apfelschorle vielleicht? &nbsp;;D &nbsp;;D &nbsp;;D

Gruß

Günter

 

[ralfeberle]

Re: Teiltransparentes Bild für Web-Hintergrund

Hallo!

Ein Querverweis fehlt noch ;D:

Wozu man die Funktion 'Bild maskieren' eigentlich einsetzt und wo es jede Menge solcher Masken gibt, erklärt folgendes Posting:
[THREAD]877[/THREAD]

Gruß,

Ralf

 

[ULI]

Re: Teiltransparentes Bild für Web-Hintergrund

Hallo Ralf

Vielen Dank für diese sprechende Anleitung.
Leider habe gleich beim Erzeugen des weissen Bildes ein Problem:
Schritt 1 Klappt  
Schritt 2 liefert jedoch folgendes Ergebnis:  ???

Was nun??

FF Version 2.72 B27

ULI

Aha... 8) &nbsp;(neuer Versuch)
Wenn ich nach Schritt 1 zwischenspeichere und mit diesem gespeicherten Bild weitermache klappts &nbsp;

 

[talmida]

Re: Teiltransparentes Bild für Web-Hintergrund

... also Uli ! :

Von dem Tip (und vor allem seiner InSzeneSetzung) bin ich wieder mal sehr beeindruckt....

@ Günther: also ich könnte mich da vielleicht zur Ausgabe von Äpplwoi aufraffen.... ;D

liebe Grüße
Christa

 

[ULI]

Re: Teiltransparentes Bild für Web-Hintergrund

... also ich könnte mich da vielleicht zur Ausgabe von Äpplwoi aufraffen.... ;D

Also, daß du das Wort überhaupt kennst, und dann auch noch richtig geschrieben... &nbsp;aüßerst beeindruckend &nbsp;;D

ULI

 

[talmida]

Re: Teiltransparentes Bild für Web-Hintergrund

... ja, da siehst as amal, wie vielseitig mir Bayern san... ;D

 

[Juco]

AW: Teiltransparentes Bild für Webhintergrund

Hallo Leute,

vielen Dank !! Mein Bild ist mir auf Anhieb gelungen !

Bis zum nächsten Mal - MfG Jürgen

 

[HeiM]

AW: Teiltransparentes Bild für Webhintergrund

Hallo,
der Thread ist schon älteren Datums und wäre fast versandet, wenn Juco (Jürgen) ihn nicht mit seiner Anfrage wieder ans Licht gefördert hätte.
Anlaß für mich, mich des Themas anzunehmen und wieder ein PDF daraus zu machen.
Wer seine Sammlung vervollständigen möchte - bitte. Es steht ab sofort zum Download bereit.
Ihr wißt ja, nicht suchen. Der Klick auf 'Schlüssel' führt Euch direkt zum Ziel.
Titel des PDF: Teiltransparente Bilder

 

[Josef17]

AW: Teiltransparentes Bild für Webhintergrund

schön das das nochmal angesprochen wurde, hab direkt danach gearbeitet und etwas gespielt. Einige Namen stimmen in der Anleitung nicht, wo Du unter Effekte,Bild maskieren, stehen hast, steht jetzt Bild überlagern, mit den gleichen Effekten. Hat aber alles prima geklappt.