Ansprechende Kachel-Hintergründe für Web-Seiten gestalten

Als dezentes grafisches Hintergrundmotiv für eine Web-Seite eignet sich oft auch ein Schriftzug. Wenn der in Form eines Kachelmusters erscheinen soll, reicht es aber nicht, ihn einmal zu schreiben, als Bilddatei zu speichern und als Muster darstellen zu lassen. In diesem Fall würde der Text in immer gleichen Kolumnen erscheinen - langweilig.

Besser ist es, das Wort zeilenweise versetzt anzuordnen, im Muster etwa wie gemauerte Ziegel. Wie Sie das im Photoshop umsetzen, sehen Sie gleich. Das Prinzip läßt sich aber auch in nahezu jeder anderen Bildbearbeitung anwenden.

- So geht's: Legen Sie eine neue Bilddatei an und achten Sie bei ihrer Größe darauf, daß der Schriftzug zweimal nebeneinander und dreimal übereinander Platz findet. Wählen Sie dann das »Textwerkzeug« aus und klicken Sie in das neue Dokument. Im Dialog legen Sie die Schriftart, -farbe , -größe und die Laufweite fest. Zentrieren Sie den Text und geben Sie ihn dann, wie in der obigen Abbildung, in der ersten Zeile einmal, in der zweiten Zeile versetzt zweimal und in der dritten wieder nur einmal ein. Abschließend klicken Sie auf »OK«.

- Nun gilt es, dieses Gebilde zu einer "Kachel" für das Hintergrundmuster zu beschneiden. Am besten nehmen Sie dazu die Markierung innerhalb der Wörter vor. Dies freihändig mit dem »Markierungswerkzeug« zu erledigen, dürfte jedoch eine Zitterpartie werden. Eleganter geht es mit Hilfslinien. Um sie zu setzen, müssen Sie im »Ansicht«-Menü die »Lineale einblenden«. Dann vergrößern Sie die Darstellung auf 300 oder 400 Prozent.

Zunächst nehmen Sie das oberste Wort in Angriff. Suchen Sie einen markanten Punkt, etwa den Querstrich eines »T«. Dann klicken Sie auf das obere Lineal und ziehen bei gedrückter Maustaste eine Hilfslinie an diesen Punkt. Diese Prozedur wiederholen Sie in gleicher Weise beim untersten Wort.

Nun sind die beiden senkrechten Hilfslinien an der Reihe. Suchen Sie auch dort eine typische Stelle im linken Wort der mittleren Zeile und ziehen Sie eine Hilfslinie aus dem linken Lineal an diese Position. An der gleichen Stelle des rechten Wortes der zweiten Zeile plazieren Sie ebenfalls eine senkrechte Hilfslinie.

Nachdem Sie den Zoom-Faktor auf 100 oder 200 Prozent reduziert haben, sollten Sie alle vier Hilfslinien sehen. Nun ist es kein Problem mehr, das so entstandene innere Rechteck mit Hilfe des »Markierungswerkzeugs« zu markieren. Betätigen Sie dann die Tastenkombination [Strg]+ [C], um den markierten Bereich zu kopieren.

Mit »Datei | Neu« legen Sie nun eine weitere Datei an. Lassen Sie die angebotenen Einstellungen unverändert, da diese der Größe des soeben kopierten Bereichs des ersten Bildes entsprechen. Mit [Strg]+[V] fügen Sie diesen Bereich in das neue Bild ein. Die Kachel für den Hintergrund ist nun fertig, und Sie können sie im GIF- oder JPEG-Format speichern.

- Feinschliff: Lassen Sie Photoshop und die Datei, in der sich der dreizeilige Text befindet, am besten geöffnet. Starten Sie nun Ihren Web-Editor und laden Sie die Kachel in die entsprechende Muster-Funktion. So können Sie kontrollieren, ob sich die Kacheln nahtlos aneinanderfügen. Ist das nicht der Fall, nehmen Sie die notwendigen Korrekturen vor und testen das Ergebnis erneut. Wenn Sie das Ergebnis im BMP-Format speichern, können Sie mit dieser Datei auch den Desktop von Windows verzieren.