Schimmi's Paint Shop Pro Studio

Version: PSP 7, Erstellen einer Hintergrundgrafik für Websites

psp_hint16.gif
So sollte es Aussehen.
Klick hier


psp_hint01.jpg Hier ist das Ursprungsbild zu sehen. Diese Kornblume wollen wir für einen Webseitenhintergrund verwenden. Natürlich kann jede beliebige Grafik dazu verwendet werden. Es kann auch als Entwurf für ein eigenes Briefpapier, zum versenden von eMails eingesetzt werden. Man nennt diese Briefpapiere auch Stationary's.



In meinem Tutorial „Briefpapier erstellen” habe ich ein Beispiel dargestellt. Aber jetzt zur eigentlichen Aufgabe.
Wie gehen wir vor? Für jede Aufgabe gibt es auch verschiedene Lösungsansätze, hier ist einer von vielen. Ich überlege mir, wie soll der Hintergrund aussehen? Gut, ich habe mich für einen Farbverlauf in gelb und zwar verlaufend von links nach rechts heller werdend entschieden.


psp_hint13.png,21KB Also erstelle den Hintergrund wie folgt:

Neue Datei öffnen, mit weißen Hintergrund und der Größe 400 x 150 Pixel. Einen Farbübergang wählen mit dem die Fläche gefüllt werden soll.



psp_fill.gif,2KB Das Symbol für die Farbfüllung.



psp_hint14.png,33KB Der Farbverlauf kann mit dem Farbübergangs-Editor nach eigenen Wünschen anpaßt werden. Hier muß man ein wenig experimentieren. Ich habe für unser Beispiel die in der Grafik gezeigte Einstellung genommen.



psp_hint18.jpg Das Ergebnis sollte in etwa so aussehen wie in der linken Abbildung. Speichere dieses Ergebnis erst einmal als "Paint Shop Pro-Datei" unter einem entsprechenden Namen ab. Das hat den Vorteil, wenn man mal einen Fehler gemacht oder auch der Rechner abgestürzt ist, die ganze Arbeit nicht umsonst war.


psp_mag.gif,16KB Mit dem Zauberstab (Magig Wand) werden wir jetzt die Selektionen vornehmen. Die eingestellten Werte dienen nur als Anhaltspunkt. Man muß das immer wieder für seine Zwecke neu ausprobieren.

psp_hint05.png,3KB Stil-Palette - Zauberstab
Auswahlmodus : RGB-Wert
Randschärfe: 2
Toleranz: 20



psp_hint02.jpg Klicke jetzt in den dunklen Bereich und es wird die Selektion wie im Bild gezeigt, markiert. Sollte nicht alles selektiert  sein, dann betätige dabei die SHIFT-Taste, das Kannensymbol bekommt ein +. Dann kannst Du den Rest selektieren. Auch hier wieder, ein bisschen Übung brauch'st schon. Jetzt haben wir nur den äußeren Teil selektiert, was wir aber brauchen ist der Innere. Also die Blume. PSP bietet da die Auswahl-Umkehrung an.

psp_ausw.gif



psp_hint03.jpg Die Auswahl wird wie folgt umgekehrt. Entweder aus der Menüleiste die "Auswahl" und anschließend "Umkehren" anklicken oder gleich die Shortcuts Strg+A und Umsch-Strg+I benutzen.



psp_hint04.jpg Mit Strg+C kannst Du die Auswahl kopieren und mit Strg+V als neues Bild einfügen. Jetzt ist dieses Bild aber viel zu groß für die Hintergrundleiste. Es muß also verkleinert werden. In diesem Beispiel auf etwa 125x128 Pixel. Beim Ändern der Größe sollten die Seitenverhältnisse beibehalten werden. Es sei denn, daß noch Änderungen vorgenommen werden sollen.

Zur Sicherheit speichern wir dieses Bild wieder ab.



psp_versch.gif,1KB Jetzt rufe das Bild mit dem Farbübergang auf. Normalerweise steht es noch im PSP-Fenster und braucht nur angeklickt zu werden. Mit der Tasten-Funktion Strg-L wird jetzt die Blume als neue Ebene eingefügt. Mit dem Verschiebesymbol kann sie richtig positioniert werden. Jetzt das Ganze nur noch als Grafik mit verbundenen Ebenen, wird nach gefragt, abspeichern.



psp_hint19.jpg Der Hintergrund ist fertig und kann mit folgenden HTML-Befehlen angezeigt werden:


<body background="images/hintergrund.jpg">
Oder schau im Quelltext der Musterseite nach.

RSS-Feed dieser WebsiteRSS Feed

Impressum

Die URL dieser Seite ist: www.alschim.de/psp_allg/hintergr/index.php
©Copyright All Contents 2002 - 2017 A.Schimmeck
Commercial Use prohibited.