Design

9 simple Design-Tools, die den Unterschied machen

Mark Lingk
verfasst von Mark Lingk

Hörst du auch ständig, dass deine Nische zu voll ist?

Wahrscheinlich ja! – ich möchte dir daher heute ein paar effektive Grafiktools zeigen, um dein Blogdesign zu verbessern und dir dadurch einen klaren Vorteil gegenüber deinen Blogger-Kollegen zu schaffen.

Mach dir bewusst:

Dein Content kann noch so gut sein – wenn deine Internetseite aussieht wie ein strukturelles Schlachtfeld, gibt es genügend Alternativen für deine Leser sich anderweitig die benötigten Informationen zu beschaffen. Heutzutage ist niemand darauf angewiesen, Websites zu besuchen die ihm nicht gefallen.

Daher solltest du deine Seitenstruktur und vor allem das Design deines Blogs verbessern und direkt mit einem positiven ersten Eindruck punkten.

Das Beste daran: Dafür musst du nicht mal Profi sein.

Ich zeige dir einige Tools, mit denen du dein Blogdesign verbessern wirst.

Steigen wir einen Step früher ein:

Um deine Inhalte effektiv zu präsentieren und dem Leser ein heimisches Gefühl zu geben (schon bevor dieser sich  deine Beiträge durchliest), mache dir Gedanken, in welche Richtung dein Blogdesign sich visuell entwickeln soll.

Durch die Tools sparst du einiges an Zeit – nur die Strategie für dein Blogdesign können sie leider nicht übernehmen.

Genug Theorie – hier sind die Tools & Quellen:

1. Farbgebung „Coolors“

Als Anfänger ist es besonders schwierig ein Gefühl für Farben zu entwickeln. Wie wirken die Farben und welche Farben wirken gut in Kombination. Das Tool Coolors darf natürlich nicht fehlen in dieser Liste. Durch die einfache Bedienung ist es selbst Anfängern möglich, harmonische und individuelle Farbkombinationen zu erstellen – ganz ohne Fachkenntnisse.

Coolors besteht aus 5 verschiedenen Farbflächen, die sich durch das Drücken der Leertaste neu mischen. Du kannst also so lange Farbkombinationen durchklicken, bis dir eine oder mehrere Farben gefallen.

Wenn du eine passende Farbe gefunden hast, gibt es die Funktion diese zu sperren und so im „Farbdeck“ zu behalten. Diesen Vorgang, kannst du so lange wiederholen bis du vollkommen zufrieden bist mit deiner Farbkombination. Du kannst jede Farbe auch noch individuell verändern und farblich anpassen.

Dir werden die Codes der Farben angezeigt, so dass du diese Codes nur noch in dein Bildbearbeitungsprogramm oder dein Blogdesign einfügen musst, um die Farben zu verwenden.

Für mich ist es mit Abstand eines der besten Tools.

Super effektiv, leicht zu bedienen und ein Garant für saftige Farbkombinationen.

Mit einem Klick auf die Grafik zur Website:

cooloors

 

2. Foto-Editor „Befunky“

Befunky ist für mich einer der besten (Online) Foto-Editoren. Nicht jeder hat das Geld für teure Bildbearbeitungsprogramme (wie zum Beispiel Photoshop).

Wer nicht das Geld für derartige Profi-Software ausgeben will, der findet in Befunky eine wirkungsvolle Alternative um seine Fotos und Grafiken zu Bearbeiten.

Ob Headerbild, Artikelbild oder sonstige Grafiken und Fotos – du hast extrem viele Einstellungsmöglichkeiten und Optionen um deine Fotos für deinen Blog aufzubereiten.

Mit einem Klick auf den Button „Foto-Editor“ geht es los. Lade ein Foto von deinem Computer, oder anderen Quellen wie Facebook, Google Drive und Dropbox hoch um mit dem Editieren zu starten.

Wie man ein Artikelbild in wenigen Minuten erstellt, zeige ich dir in diesem Video:

Da es zu lange dauern würde, auf jegliche Funktion von Befunky einzugehen, hier mal eine grobe Übersicht:

  • Zuschneiden, Größe ändern
  • Belichtung, Farbmixer, Farbfilter
  • Drehen, Neigen
  • Weichzeichnen, Schärfen, Verwischen, Glätten
  • Rote Augen entfernen, Fehlerkorrektur, Zähne aufhellen
  • Fotoeffekte, Fotofilter, Kunstfilter
  • Rahme, Überlagerungen
  • Text einfügen
  • Texturen nutzen

Für folgende Dinge, eignet sich Befunky: Social Media Grafiken, Headerbilder, Artikelbilder, Bearbeitung von Fotos

 Mit einem Klick auf die Grafik zur Website:

befunky

 

 

3. Infografiken „Piktochart“

Infografiken sind wohl eine der grafischen Angelegenheiten, auf die Anfänger aus technischen Gründen oft verzichten müssen. Infografiken sind in der Erstellung deutlich komplexer als Artikelbilder oder ähnliche Grafiken. Dennoch ist es eine überaus effektive Methode um seinen Content grafisch darzustellen und Fakten prägnant zu präsentieren.

Mit diesem Tool, ist es dir auch als Anfänger möglich Infografiken in deine Beiträge einzubauen:

Bevor du dieses Tool nutzt, mach dir noch kurz Gedanken welche deiner Inhalte sich besonders gut mit einer Infografik darstellen lassen. Nicht jeder Beitrag eignet sich um Inhalte in einer Infografik darzustellen.
Bevor du also krampfhaft probierst, deinen Content mit Infografiken zu versehen – such dir erstmal den nötigen Input, der es wert ist, grafisch nochmal dargestellt zu werden.

Zusätzlich gibt es noch viele verschiedene Arten von Infografiken. Mindmaps, Diagramme, hierarchische Darstellungen, Statistiken…

Wenn du dir also deinen Content gewählt hast, überlege dir wie man diesen am besten darstellen kann. Worum geht es dabei? Was soll deutlich werden? Wenn es deine Gedankengänge oder ein Brainstorming darstellen soll, eignet sich eine Infografik in Form einer Mindmap.

Solltest du zum Beispiel die Anzahl deiner monatlichen Blogbesucher visuell darstellen wollen, dann wähle ein Diagramm beziehungsweise eine Form mit der sich Zahlen gut darstellen lassen.

Das hört sich deutlich theoretischer an, als es eigentlich ist – entwickle einfach ein Gefühl dafür, wie du Zahlen, Daten oder Fakten besonders deutlich und somit effektiv darstellen kannst.

Form folgt Funktion – halte es daher sehr einfach und für den Betrachter verständlich.

Mit einem Klick auf die Grafik zur Website:

piktochart

 

4. Schrift „WhatTheFont“ & „FontSquirrel“

WhatTheFont ist ein Tool von Myfonts.com, welches dir ermöglicht Schriftarten zu finden.

Immer wieder wenn ich mir Inspiration suche, fallen mir Schriftarten ins Auge, die super zu einem bestimmten Design passen.

Doch da es eine unfassbare Auswahl an Schriftarten im Internet gibt, kann man nicht jede kennen. Genau deswegen nutze ich das Tool so gerne.

Wenn du eine Schriftart entdeckst, die dir richtig gut gefällt – du aber den Namen der Schriftart nicht herausfinden kannst, bietet dir WhatTheFont die Möglichkeit eine Grafik mit dieser Schriftart hochzuladen.

Das Tool erkennt die Buchstaben der Schrift und zeigt dir deine gesuchte Schrift oder möglichst identische Alternativen.

Je besser die Grafik aufgelöst und je deutlicher die Schriftart zu erkennen ist, desto wirkungsvoller funktioniert das Tool.

Mit einem Klick auf die Grafik zur Website:

whatthefont

WhatTheFont ist ein effektives Tool um bei der Suche nach Schriftarten Zeit zu sparen. 

 „Fontsquirrel“

Kostenlose Schriftarten gibt es viele, doch Schriftart ist nicht gleich Schriftart – wenn ihr eure Designs verbessern wollt, müsst ihr auch hier für ein Gefühl entwickeln, ich zeige euch ein paar Internetseiten, wo ihr kostenlose aber hochwertige Fonts findet.

Bei der Schriftart kann ich dir nur raten darauf zu achten, für welchen Verwendungszweck du eine Schriftart brauchst. Solltest du eine Schriftart für dein Logo suchen, dann wähle ruhig eine Schriftart mit kräftigen Linien, um dein Logo gut lesbar werden zu lassen. Zu dünne Linien rauben deinem Logo die Aussagekraft und geben deinem Blog dadurch kein markantes Erscheinungsbild.

Ich würde dir von zu verschnörkelten Schriftarten abraten. Die Typografie sollte deinen Content unterstützen. Gewährleiste durch deine Schriftwahl  einen angenehmen „Konsum“ deiner Bloginhalte.

 Mit einem Klick auf die Grafik zur Website:

fontsquirrel

„Behance“

Behance ist eine Website für Kreative, zum Präsentieren des eigenen Portfolios. Die Website ist also bestens geeignet um Inspiration zu sammeln. Auf Behance lassen sich jedoch einige, sehr schöne kostenlose Schriftarten finden. Die bunte Mischung und sehr kreativen Schriften überzeugen mich immer wieder.

Mit einem Klick auf die Grafik zur Website:

behance

 

5. Mockup Generatoren „PlaceIt“ & „MagicMockup

Ihr braucht ein schickes Headerbild?

Wieso nicht den eigenen Blog als Motiv nutzen und auf verschiedenen Geräten darstellen lassen. Egal ob Blogpräsentation oder Headerbild, durch ein Mockup nutzt du eine effektive Möglichkeit deinen Blog zu präsentieren.

Dafür brauchst du nicht mal ein Bildbearbeitungsprogramm.

Als Grafiker nutze ich Mockups oft, um meine Arbeiten zu präsentieren. Es ist für den Kunden einfach deutlich angenehmer, das Design direkt in Anwendung zu sehen. Dir gibt so ein Mockup-Generator einfach die Möglichkeit, dein Blog grafisch in eine Vorlage einzufügen und auf verschiedenen Geräten darstellen zu lassen.

„PlaceIt“

PlaceIt hat eine große Auswahl an digitalen Geräten. Ihr könnt euer Design also für viele Geräte und Ansichten generieren lassen.

Mit einem Klick auf die Grafik zur Website:

placeit

„MagicMockup“

Magic Mockups funktioniert identisch. Die Auswahl ist etwas geringer, aber die Qualität überzeugt. Ihr könnt zwischen sehr hochwertigen Mockups wählen.

Mit einem Klick auf die Grafik zur Website:

magicmockup

 

6. Stockphotos „Pexels“

Stockphotos sollten gut gewählt sein, ich würde davon abraten nur Fotos zu nutzen um Lücken zu füllen.

Es gibt viele Quellen für lizenzfreie Fotos, doch nur die wenigsten taugen etwas.

Die besten Erfahrungen habe ich mit der Website Pexels gemacht, da die Fotos künstlerisch und qualitativ sehr hochwertig sind.

Mit einem Klick auf die Grafik zur Website:

pexels

 

7. Texturen „Frebbble“

Du findest keine passende Farben für den Hintergrund deines Blogs?

Texturen bieten dir eine Alternative zu einfarbigen Hintergründen. Probier es doch einfach mal. Vielleicht ist etwas für dich dabei.

Die Texturen kannst du natürlich auch für dein Headerbild oder Social Grafiken nutzen.

Mit einem Klick auf die Grafik zur Website:

freebbble

 

8. Icon-Sets „Graphicburger“ & „Iconfinder“

Icons sind eine gute Möglichkeit, um deinen Content visuell zu strukturieren.

Es gibt einiges an hochwertigen Icon-Sets, die sich ganz leicht einbauen lassen. Icons können dein Blogdesign unterstützen und als Eyecatcher fungieren – dafür sollten sie aber sinnvoll und bedacht eingesetzt werden.

Möglicher Verwendungszweck:

  • Auflistungen
  • Call to Action – Elemente (z.B. Buttons)
  • Grafische Darstellung von Informationen (bei Grafiken)

„Graphicburger“

Graphicburger ist eine gute Quelle für Grafik-Ressourcen. Doch besonders die Icons haben es mir angetan. Schau doch mal vorbei.

Mit einem Klick auf die Grafik zur Website:

graphic-icon

„Iconfinder“

Bei Iconfinder findet ihr eine Vielzahl an verschiedenen Icons. Ihr könnt hier gezielt nach Icons suchen und nach verschiedenen Kategorien trennen. Bei dieser Website gibt es sowohl kostenlose wie kostenpflichtige Icons und ihr könnt vorher selektieren, welche Art ihr euch anzeigen lassen wollt.

Mit einem Klick auf die Grafik zur Website:

iconfinder

9. Design Check „Responsive Design Checker“

Responsive Design ist heutzutage ein großes Thema. Dennis und ich haben auf Letsblognow auch eine hohe Anzahl an mobilen Zugriffen beziehungsweise Seitenbesuchen. Ich bin kein SEO Experte, doch Google legt seit dem neuen Algorithmus wert auf die mobile Ansicht.

Durch den Responsive Design Checker, kannst du prüfen wie dein Blog auf anderen Geräten (z.B Laptop, Ipad, Iphone) aussieht. Einfach deine URL eingeben und auf verschiedenen Geräten anzeigen lassen.

Durch das Checken, kannst du deinen Blog für die mobile Ansicht optimieren und deinen Content auf jeglichen digitalen Geräten zugänglich machen.

Mit einem Klick auf die Grafik zur Website:

responsive

 

Ich könnte diese Liste noch um einige ähnliche Tools erweitern. Doch zu viele verschiedene Tools machen dich wahrscheinlich auch nicht produktiver.

Daher halte ich diese Liste relativ kurz und gebe dir ein paar Tools an die Hand, welche ich auch als Grafikdesigner nutze.

 

Ich hoffe die Tools sind dir eine Hilfe und unterstützen dich bei deinem Blogprojekt 🙂 !

Schreib mir doch in den Kommentaren, welche Tools du nutzt oder ob du noch weitere hilfreiche Quellen kennst.

Grüße aus Hamburg

Mark

Über den Autor

Mark Lingk

Mark Lingk

Hey, ich bin Mark. Grafik & Screendesigner aus Hamburg und Mitgründer von Letsblognow. Ich bin zuständig für den Grafischen Bereich und zeige euch, wie ihr auch als Anfänger ein schönes Blogdesign erstellen könnt und worauf es wirklich ankommt beim Design.

3 Kommentare

Schreibe einen Kommentar