Workshop Buttons mit Photoshop Elements 7 (Trial) erstellen

Das Programm Photoshop Elements 7 (Trial) von Adobe bietet eine Vielzahl an Effekten und Bearbeitungsmethoden welche sich sehr gut zur Erstellung von Buttons eignen.
Alle Möglichkeiten kann ich Dir hier nicht anbieten - aber mit einer kleinen Anzahl an Möglichkeiten Deine Kreativität fördern - das geht wohl und so entstand dieser kleine Workshop zum Thema Buttons mit Adobe PS Elements 7.

Um Buttons zu erstellen musst Du eine neue Datei öffnen, was Du über "Datei" -> "Neu" -> "Leere Datei..." erledigst.	Im Dialogfeld zur neuen Datei vergibst Du gleich einen passenden Namen zur Datei - zum Beispiel Button - und legst Breite (250 Pixel) sowie Höhe (50 Pixel) fest. Mit einem Klick auf den Button "OK" übernimmst Du alles.	Nun öffnest Du Deine bisherige Startseite mit dem Hintergrundbild und speicherst diese über die "Druck"-Taste (rechts neben der F12-Taste) Deiner Tastatur in der Zwischenablage.	Danach wechselst Du wieder in den Photoshop und fügst es über "Bearbeiten" -> "Einfügen" in diese Datei ein.
Da Hintergrundbild in der untersten Ebene nicht verschoben werden können erstellst Du jetzt eine neue Ebene über "Ebene" -> "Neu" -> "Ebene...".	Im Dialogfeld zur neuen Ebene vergibst Du einen Namen - hier zum Beispiel Hintergrund - und übernimmst alles mit einem Klick auf den Button "OK".	Damit jetzt die neue Ebene unterhalb des Browserabbildes ist musst Du im Feld Ebenen die neue Ebene anklicken, die Maustaste gedrückt halten und so die Maus nach unter ziehen.	Jetzt wechselst Du durch anklicken im Feld Ebenen in die Ebene 1, wählst danach das Verschiebewerkzeug aus und verschiebst das Browserabbild so, dass vom Browser außer dem Hintergrundbild nichts mehr zu sehen ist. Übernehme abschließend das Verschieben mit einem Klick auf den grünen Haken.
Anders wie in vielen anderen Programmen musst Du beim Photoshop für Textebenen nicht zwingend eine neue Ebene erstellen. Du brauchst nur Textwerkzeug anklicken (Schriftart, Größe, Fett, Kursiv, Farbe ... auswählen), danach ins Bild klicken und den Text eingeben.	Wenn Du Deinen Text fertig eingegeben hast klickst Du einfach auf diese Textebene und diese nimmt dann den Namen des Textes an.	Falls Du den Text verschieben möchtest, dann wählst Du das Verschiebewerkzeug aus, klickst ins Bild und verschiebst mit gedrückter Maustaste den Text an die gewünschte Stelle.	Um Deinen Text jetzt noch eine ansprechende Optik zu verleihen wählst Du Dir im Feld Effekte eine Effekt aus (anklicken -> Anwenden), woraufhin das Zeichen "fx" in dieser Ebene (Feld Ebenen) erscheint.

>

Für den nächsten Schritt ist die Lupe nicht von der Hand zu weisen, da diese das Bild vergrößert. Einfach einmal Lupe anklicken und dann 1 - 3 Mal ins Bild und es ist um einiges größer.	Damit die Datei etwas kleiner wird und Du auch mit dieser dann in Deiner Webseite besser hantieren kannst verkleinern wir jetzt das Bild über "Bild" -> "Freistellen".	Mit den im Freistellen angebotenen Punkten kannst Du nun das Bild verkleinern - schiebe dazu die Punkte soweit an die Schrift, dass diese nicht berührt wird. Mit einem Klick auf den grünen Haken (aktuellen Vorgang bestätigen) übernimmst Du die neue Größe.	Bevor Du nun diesen Button abspeicherst bestimmst Du noch die Hintergrundfarbe, klicke dazu auf die Farbpipette und dann auf den Hintergrund im Bild, danach
öffnest Du das Feld der Vordergrundfarbe und liest den Wert bei "#" ab (zu Sicherheit eventuell notieren). Anschließend verlässt Du den Dialog der Vordergrundfarbe mit einem Klick auf "OK".	Nun sind alle Werte bestimmt, der erste Button fertig und kann so gespeichert werden. Da wir den Button als GIF-Bild speichern wollen stellst Du nun den Hintergrund auf unsichtbar (Auge entfernen durch anklicken), danach wählst Du "Datei" -> "Speichern unter...".	Im Dialogfeld zum Speichern wählst Du Speicherort, gibst einen Dateinamen an und bestimmst das Format, was für GIF zwingend "CompuServe GIF (*.GIF)" sein muss. Mit einem Klick auf den Button "Speichern" gelangst Du zum	nächsten Dialog, den indizierten Farben. Wichtig ist hier, dass der Haken vor "Transparenz" gesetzt ist. Nun klickst Du auf die Option "Hintergrund" um Deine aktuelle Hintergrundfarbe eingeben zu können. Im darauf sich
öffnenden Menü klickst Du "Eigener..." an, woraufhin	sich der Dialog zur Mattfarbe öffnet (angesetzte Farbpixel am Bild um den Treppeneffekt zu verringern). Hinter "#" gibst Du nun den im Hintergrund bestimmten Farbwert an. Mit zwei Klicks auf jeweils "OK" gelangst Du	zu den GIF-Optionen, wenn die Zeilenfolge auf "Normal" steht kannst Du mit einem Klick auf "OK" das Bild endgültig speichern.	Und so würde der erste Button aussehen, jetzt fehlt noch der Hover-Button (Bildwechsel beim mit der Maus überfahren).

Für den Hover-Button reicht es aus, wenn Du die Schriftfarbe änderst. Einfach Ebene "Startseite" im Feld Ebenen anklicken, danach das Textwerkzeug auswählen und Textfarbfeld anklicken und andere Farbe wählen, dann	wieder "Datei" -> "Speichern unter..." auswählen, im	Speicherdialog Speicherort, Dateiname und Format bestimmen, mit "Speichern" zum	nächsten Dialog - da die Voreinstellungen noch stehen sollten kannst Du einfach mit einem Klick auf "OK" in die
GIF-Optionen gehen, wenn die Zeilenfolge auf "Normal" steht speicherst Du endgültig mit einem Klick auf "OK".	Zum Schluss nun noch ein Browserabbild mit beiden Buttons.

Auf Grund der Vielfalt der Möglichkeiten mit dem Photoshop Elements 7 (Trial) von Adobe kann diese Vorstellung von Buttons zu erstellen nur als kleine Anleitung dienen - mit mehr Zeit und Kreativität können wesentlich bessere und aussagekräftigere Buttons erstellt werden - hier bist jetzt Du gefragt.