{Blog-Design} Use Graphics to style up your blog!

Nachdem euch mein Eintrag über den Einsatz von Schriften im Blog schon so gut gefallen hat, gibt es nun auch noch ein paar Tipps zum Einsatz von Grafiken für euren Blog. Denn Grafiken machen euren Blog erst richtig lebendig! 

Vor allem in langen Textposts sind Grafiken wirklich Gold wert. Sie lockern längere Passagen auf und sorgen für ein bisschen Farbe. Schaut euch meinen heutigen Post zum Beispiel an: Eigentlich nur Text und keine Fotos, aber durch die farbigen Überschriften und Beispiele dazwischen wirkt das viel weniger schlimm!
Und ihr wisst ja mittlerweile auch, wie super ich ein durchgängiges Konzept im Blog finde. Grafiken helfen ungemein dabei, eurem Layoutkonzept einen schönen roten Faden zu verleihen.



Und darüber hinaus macht es einfach Spaß, mit verschiedenen Farben und Formen zu experimentieren. Selbst wenn ihr denkt, ihr könnt das eh nicht - probiert es einfach mal aus! Wer nicht wagt, der nicht gewinnt. ;)

Bevor es ans Eingemachte geht, müssen wir erst mal die Basics klären. Um mit Grafiken zu arbeiten und sie zu erstellen, braucht ihr was? Klar, ein Grafikprogramm. Ich muss sagen, ich habe bislang nur mit  zwei Programmen gearbeitet, die meinen Ansprüchen entsprochen haben: das gute alte Photoshop und Gimp

Also ein kurzer Abriss über Vor- und Nachteile: Der Vorteil von Gimp ist, dass es gratis ist. Es hat alle Standardfunktionen, die man benötigt, wenn man nicht so tief in die Materie einsteigen muss. Photoshop kostet dagegen, ist aber meiner Meinung nach komfortabler und bietet wesentlich mehr Funktionen. (Für Schüler, Studenten und Lehrer gibt es übrigens eine Edition von Photoshop, die nur 278 Euro kostet. – ein Drittel des Normalpreises. Diese besitze ich auch, bzw. die ganze Creative Suite zum Studentenpreis). 

Also, kurz und knapp: Beide Programme sind gut, aber die knapp 300 Euro für Photoshop lohnen sich, wenn ihr mehr machen wollt als nur Basic-Bearbeitung und Bilder zusammenfügen. Gerade, wenn ihr mit einem Grafiktablett arbeitet, ist Photoshop Gold wert. Dafür kostet Gimp nichts. Wer sich unsicher ist, kann sich auch eine 30-Tage-Testversion von Photoshop runterladen, um das Programm mal auf Herz und Nieren zu testen.
Was ich euch heute zeige, ist mit beiden Programmen möglich, aber der Einfachheit halber schreibe ich PS für Photoshop. :) Alles, was ich euch erkläre, ist mit Gimp aber genauso möglich.

Oft werde ich gefragt, was das denn für schöne Formen sind, die man überall in meinem Blog findet, wie beispielsweise in den Überschriften dieses Eintrags. Größtenteils sind das Muster, die ich aus PS-Brushes (Pinselspitzen) bezogen habe. (teilweise sind sie auch selbstgezeichnet, aber das ist hier ja jetzt nicht wichtig!) Vielleicht kennt ihr die Standard-Brushes aus Photoshop: Diese Sterne, Grashalme, usw., die es da gibt. Das Praktische an Brushes ist, dass ihr sie in der Größe, in der Farbe und in der Deckkraft regulieren könnt, genau wie alle anderen Pinselspitzen auch, mit denen ihr zeichnet. 

Der Standardpinsel bei Photoshop ist einfach ein Kreis (beziehungsweise ein Punkt, wenn er ganz winzig ist), aber in der großen weiten Welt des Internet findet ihr auch Herzen, Sternchen und eben solche Brushes, wie ich in meiner Sidebar verwendet habe. Und hier in den Überschriften. Um Brushes zu nutzen, klickt ihr einfach auf das Pinselsymbol und auf den markierten Kreis (unten im Bild), dann auf "Brushes laden". Von hier aus könnt ihr runtergeladene abr.-Dateien einfügen und sie nutzen. Links mit schönen Brushes findet ihr weiter unten.

Um einen Button selbst zu erstellen, den ihr mit einem Brush macht, würdet ihr also einfach euren Brush in der richtigen Größe in einem leeren Dokument stempeln und mit einer schönen Schrift dann darauf schreiben. Anschließend schneidet ihr das Dokument in der richtigen Größe zu, speichert es ab, und fertig!

Ich habe auch schon einmal einen Beitrag darüber geschrieben, wie ihr Brushes selbst erstellen könnt: Brushes sind aber nicht die einzige Möglichkeit, um Grafiken in euren Blog einzufügen!


Lust auf Brushes bekommen? Schaut doch mal hier:

Patterns (Muster) sind eine super Sache. Das sind quasi Muster, die ihr in PS einfügt und dann damit „malen“ könnt, ihr könnt sie in Formen einfügen und vieles mehr. Ihr ladet einfach die Dateien runter und fügt sie dann in Photoshop über die Patterns ein. Wie das geht, seht ihr im Bild etwas weiter unten. Dann könnt ihr sie nach Lust und Laune nutzen und schöne, abwechslungsreiche Grafiken damit gestalten.

Schöne Patterns könnt ihr euch beispielsweise hier runterladen:

Und Subtlepatterns, das sicher auch vielen von euch schon ein Begriff ist, bietet sogar ein Plugin zum Download mit vielen großartigen Patterns an!


Eine weitere tolle Möglichkeit, Grafiken in euren Blog zu bekommen, sind Schriften, die quasi aus Grafiken bestehen. Klingt kryptisch, ist aber ganz einfach. Ihr kennt doch bestimmt alle Windings und hattet damit sicherlich schon viel Spaß. Da gibt es Smilies, Bomben und Briefkastensymbole, die für die Buchstaben stehen, wie das sonst bei einer Schrift auch der Fall ist, um nur mal eine Auswahl zu nennen. Natürlich fügt ihr die Schriften nicht direkt in den Blog ein, sondern nutzt sie in Photoshop und speichert sie dann als Bild ab. 

Es gibt noch viel tollere Schriften als Windings, sucht einfach mal nach „Fonts Dingbats“ und ihr werdet definitiv fündig werden. Ich zeige euch mal tolle Fundstücke für Grafiken, die super auf Blogs einsetzbar sind: 


Hier seht ihr zum Beispiel ein paar "Buchstaben" der Adhesive Nr. 7, die sich ganz großartig für Buttons einsetzen lassen.


Das ist nur eine kleine Auswahl, davon gibt es noch viel mehr. Stöbert einfach etwas durchs Netz!


Cliparts... woran denken wir, wenn wir Cliparts hören? Naja, mir kommt sofort so ein komisch überzeichnet dargestellter Business-Mann in den Kopf, der komisch gestikuliert und der mit Vorliebe in Powerpoint-Präsentationen herumlungert, um dort das dröge Thema aufzulockern. Euch auch? Gut. 

Es geht für euren Blog aber schöner, toller, besser. Viele Grafiker bieten ihre selbstgestalteten Cliparts zum Download an - das kostet euch meist so 1-2 Euro pro Package, lohnt sich aber wirklich, weil viele Cliparts einfach total universal verwendbar sind. Schaut doch mal hier:
Und bei etsy könnt ihr auch tolle ClipArt-Sets erwerben! Wenn ihr viele Grafiken einsetzt, lohnt es sich wirklich, über den Kauf von Grafiken nachzudenken. Die Leute, die sie erstellen, haben viel Mühe dabei und freuen sich, wenn ihre Designs gekauft werden. :)

Achtet bei alldem darauf, dass bei all euren Grafiken, Brushes, Bildchen immer noch eine klare Linie herrscht und das man das Gefühl hat – „Ja, das ist Blog X oder Y“ und dass auch eure grafischen Elemente dazu passen. Wenn ihr einen Shabby Header habt, passen dazu keine über-cleanen SocialMedia Buttons und umgekehrt, wenn ihr versteht, was ich meine. Eure Leser wollen verstehen, was sie vor sich haben, und das geht am besten, wenn man direkt ein klares Bild vermittelt. Mehr zur Wahl der Farbkombination und des Designs habe ich hier geschrieben.

Beachtet bitte beim Download aller Grafiken, dass die, die sie erstellt haben, viel Mühe beim Designen hatten. Achtet also darauf, dass die Grafiken "free to use" sind. Oft steht dabei, dass ihr sie nicht kommerziell nutzen dürft. Solltet ihr mit eurem Blog Geld verdienen, zählt das schon als kommerziell. In diesem Fall müsst ihr die Grafiken kaufen, sonst kann euch das Probleme einbringen.


Wenn ihr noch nicht so damit bewandert seid, Grafiken selbst zu erstellen und einzusetzen, geht wirklich nichts übers Ausprobieren! Ladet euch Gimp oder eine Photoshop-30-Tage-Testversion runter und legt los!

Ich hoffe, der Eintrag war hilfreich für euch und hat ein wenig Licht ins Dunkel gebracht, was Grafiken angeht! Wenn ihr Fragen habt, stellt diese sehr gerne im Kommentar. :) Schreibt mir auch sehr gerne, was euch in diese Richtung noch interessieren würde, dann schreibe ich gerne einen Post dazu!

Kommentare

  1. Vielen Dank für die tollen Tipps und vor allem die Links!
    Liebe Grüße, Sonja

    AntwortenLöschen
  2. Hallo, ich fange erst mit einem Blog an und brauche sicher noch ziemlich lange bis er wirklich nett aussieht und alles am rechten Fleck ist. Aber deine Tipps sind immer gut verständlich und eine große Hilfe.
    Liebe Grüße
    Sandra

    AntwortenLöschen
  3. Wow, du designst so schön... da würde ich mir glatt ein bisschen Hilfe wünschen.. danke für deine tollen Tipps!

    Küsschen, Mila

    AntwortenLöschen
  4. vielen dank für die tollen tipps!
    grüsse von
    http://diybybluebondibeach.blogspot.com

    AntwortenLöschen
  5. Interessanter Post! Zwar kenne ich mich mit dem Thema schon aus, aber die Links sind sehr hilfreich. :)

    AntwortenLöschen
  6. großartig, einfach nur großartig =D
    jetzt brauch ich bloß noch die Zeit dafür =(

    ganz liebe Grüße

    Violett Love

    AntwortenLöschen
  7. Danke für Deine tollen Tipps!! Das werde ich auf jeden Fall mal ausprobieren! :)
    Klem
    Alice

    AntwortenLöschen
  8. Vielen lieben Dank für die tollen Tipps. Stehe gerade am Anfang der Bildbearbeitung. Besonders die Grafiken mit den Pfeilen machen es gut nachvollziehbar...
    Liebe Grüsse
    Antje

    AntwortenLöschen
  9. FANTASTISCHER Beitrag!!!Gerade das Thema Grafiken ist im Moment recht weit oben auf meiner Agenda und du hast einen super Überblick und nützliche Infos (z.B die Links!) zum Thema zusammengestellt! Vielen Dank!
    LG
    Moni

    AntwortenLöschen
  10. Diese Posts helfen mir immer sehr! Besonders der, wo du erklärst, wie man Grafiken mit Hover-Effekt einfügen kann. Der Post ist ganz oben in meiner Lesezeichen-Leiste ;)

    http://lus-leben.blogspot.de/

    AntwortenLöschen
  11. Hallöchen, super Tipps, danke fürs teilen :)
    lg Andy

    AntwortenLöschen
  12. toller Post =)
    ich bin froh das ich mir Photosshop angeschafft habe.. ohne geht gar nicht mehr^^

    lg steffi
    L i t t l e ❤ T h i n g s

    AntwortenLöschen
  13. Hach, man ich muss mir echt überlegen, Photoshop zu kaufen. Leider bin ich kein Schüler oder Student mehr :(.

    AntwortenLöschen
  14. Huhu, schöner Beitrag. Eine Frage habe ich: hast du bei den Schriften mal angefragt ob man die so veröffentlichen darf? Bei jeder Schriftart steht nämlich drüber, dass sie nur für den "privaten" Gebrauch bestimmt sind.... :)

    Liebe Grüße
    Corazonisima von www.vintaliciously.de (Danke im Übrigen für deine Antwort bei mir bezüglich der Fotos nebeneinander. Leider habe ich es noch immer nicht hinbekommen :D Ich hätte gerne 3 Bilder in einer Reihe nebeneinander...)

    AntwortenLöschen
    Antworten
    1. "Privater Gebrauch" ist als das Gegenteil von kommerziellem Gebrauch zu verstehen. Solange du kein Geld damit verdienst, ist es okay. :) Wenn du dir ganz sicher sein willst, ist es am besten, die Schriften zu kaufen.

      Löschen
  15. Hallo liebe Lisa,
    DANKE fuer die vielen hilfreichen Tipps!
    Ohne fotoshop geht bei mir gar nicht mehr! Ich habe mir nun eine kleine schoene Sammlungen an Brushes zugelegt und bin total froh darueber, seitdem kriegt man mich nur weniger vom PC weg ;-)
    Deine Seite, die du mir gestern empfohlen hast ist Hammer gut! Ohne die waere ich echt aufgeschmissen. Du gehoerst echt geknutscht fuer diese grossartigen Tipps!
    Lg Brigitte

    AntwortenLöschen
  16. Liebe Lisa,

    vielen Dank für deine klasse Tipps! Sind wirklich immer super-hilfreich! Hab mich heute mal an Fonts in meinen Bildern versucht und bin ganz begeistert! :)

    Ich liieeebe deinen Blog, du gibst dir wirklich total viel Mühe, bist irre kreativ und dein Blog sieht einfach richtig gut aus! Hat dir aber bis jetzt bestimmt noch niemand gesagt ;-)

    lg, Tami

    AntwortenLöschen
  17. Wow, vielen Dank für die Tipps.
    Du scheinst da echt Ahnung von zu haben und dein Blog ist der Beweis :D
    Habe nie wirklich was mit Photoshop oder dergleichen zu tun gehabt, aber ich habe grad richtig lust mich damit auseinander zu setzen :)
    LG
    Roberto

    AntwortenLöschen
  18. Ich finde es klasse, wenn erfahrene Blogger wie du sich die Zeit nehmen, solche Tutorials für uns noch nicht ganz so erfahrene Blogger zu erstellen. Wirklich ganz toll, habe gleich mal den Link zu deinem Post gespeichert! :)

    GLG, Sabrina
    Happiness-Is-The-Only-Rule

    AntwortenLöschen
  19. Liebe Lisa,

    vielen Dank für's Teilen! Das werde ich zukünftig auf jeden Fall einbauen.

    LG Nora

    AntwortenLöschen
  20. Sehr hilfreich . Danke . Bin ganz neu und über jeden Tipp den ich finde dankbar.
    lg Josefine
    http://petitbeaupapillon.blogspot.de/

    AntwortenLöschen
  21. Deine Tutorials sind toll :) Ich habe alle vier über Photoshop schon so gern gelesen, als du sie online gestellt hast, konnte sie da aber noch nicht richtig ausprobieren, weil mir sowohl Photoshop als auch ein Blog gefehlt hat. Ein bisschen mit Gimp habe ich dann immer mal rumgespielt. Jetzt habe ich aber sowohl Blog als auch Photoshop und kann alles richtig ausprobieren, was du zeigst - ich freu mich :)
    Schönes Wochenende dir :)
    Johanna

    AntwortenLöschen
  22. oh wow, toller Eintrag ! :)
    versuch ich gleich mal, danke ! <3

    AntwortenLöschen
  23. Hey :) Ich hab noch nicht ganz verstanden wie man dann die Grafiken im Blogpost einbindet. Läd man die dann hoch wie Bilder? Oder geht das über html?

    AntwortenLöschen

Ich freue mich sehr über jeden eurer Kommentare, in dem ihr mir eure Gedanken, eure Meinung, eure Ideen und Anregungen zu meinem Beitrag mitteilt. Wenn ihr dringende Fragen habt, empfehle ich euch, mir eine Mail zu schreiben: hello@meinfeenstaub.com

Spam werde ich sofort löschen.