new Design (Tutorial)

Besser spät als nie. Haha. Ich wohne jetzt seit 1,5 Monaten alleine und wieder in meiner Heimatstadt und war ständig beschäftigt. Aber hier ist nun die Anleitung zu meinen Blog Icons, die ihr auf der linken Seite meines Blogs seit einiger Zeit findet:
Ich habe das Tutorial gefunden, als ich durch ein paar meiner Lieblingsblogs gestöbert habe. Diese Anleitung habe ich auf Liz Bryson's Blog "Cotton & Curls" gefunden.
Diese Buttons für eure Seite zu machen ist ganz einfach! Alles was ihr dazu braucht ist eine Vorstellung davon, wie sie aussehen sollen und einfach Photoshop Kenntnisse.
Da ich Blogger verwende, ist die Anleitung zum Hochladen auch für diesen Hoster und ich weiß nicht, wie es bei Wordpress oä funktioniert.
Ihr könnt die Buttons einfarbig und schlicht (wie in meiner Sidebar), oder bunt (wie in meinem Header) machen:

Einfarbig:
Ihr öffnet in Photoshop ein neues Dokument mit der gewünschten Größe. Ich habe alle Buttons in der Größe 200 x 200 gemacht und sie dann später auf dem Blog im Layout auf die richtige Größe geändert.
Mit dem Kreiswerkzeug habe ich nun einen Kreis gemacht und ihn mit der gewünschten Farbe ausgefüllt. Dann habe ich darin ein Schriftfenster gesetzt und die Schriftfarbe und -größe ausgesucht. Dann braucht ihr die Buttons nur noch zu speichern.

Fotos als runde Buttons:
Ihr öffnet in Photoshop ein neues Dokument mit der gewünschten Größe. Dann öffnet ihr das Foto und verkleinert es so weit, dass entweder die Seitenkanten oder Ober- und Unterkante identisch mit eurem Dokument sind. Dann könnt ihr euch an diesen beiden Seiten orientieren, wenn ihr den Kreis ausschneidet. Dazu formt ihr den Kreis mit dem passenden Werkzeug und kehrt die Auswahl um, sodass ihr ein kreisförmiges Foto habt, wenn ihr die Auswahl löscht. Jetzt könnt ihr entweder Schrift hinzufügen oder das Foto, so wie in meinem Header, so lassen. Speichern und die Hälfte ist geschafft!

Hochladen & im Blog einfügen:
Ihr ladet eure Datei/Foto in eurem Fotohoster wie z.B. Photobucket, Flickr, etc. hoch. Dann öffnet ihr das Bild und geht auf HTML kopieren. Dann öffnet ihr in eurem Layout an der Stelle, an der ihr es platziert haben wollt (Sidebar, Header, etc.) ein neues Gadget mit "HTML/JavaScript" und fügt den Link dort ein.

...a href="hier gebt ihr euren Blogurl ein/" target="_blank"...
...img src= "hier steht der Link euer Fotos auf der Seite eures Fotohosters (müsst ihr nicht ändern)"
border="0" heigth="150" width="150"(solltet ihr in die gewünschte Größe ändern)
 alt=" photo hier steht der Dateiname eures Buttons (müsst ihr nicht ändern)" ...

Anstatt der Punkte stehen dort jeweils < oder >, die ich allerdings ersetzen musste, sonst hätte es den eigentlichen HTML-Code nicht in Buchstaben angezeigt sondern umgewandelt! Ihr müsst nun also nur euren Blogurl dort einfügen, wie ich es oben markiert habe und die Höhe und Breite des Buttons ändern. Meine kleinsten Buttons in der Sidebar sind 50 x 50, die Großen in der Sidebar sind 150 x 150 und die in meinem Header sind noch größer. In der Sidebar habe ich mit der Größe etwas rumprobiert, bis ich ein Verhältnis gefunden habe, das mir gefallen hat.
Die Fotos in meinem Header habe ich jedoch nicht einzeln eingefügt, sondern in Photoshop in eine Datei eingefügt und so platziert, wie es mir gefallen hat. Dann habe ich die 4 Fotos als eine Datei in der Breite meines Blogs gespeichert.

Viel Spaß beim Ausprobieren!

For the english version of the tutorial how to make these icons check out Liz Bryson's Blog "Cotton & Curls". She also posted a video for the tutorial! 
Bisous bisous, Luu