Logo für den eigenen Blog erstellen

Mein Theme ist so weit fertig und ich bin größtenteils zufrieden. Natürlich gibt es noch einige Baustellen. Bei eigenen Entwicklungen ist man bekanntlich oft der eigene größte Kritiker. Schließlich weiß ich im Gegensatz zu dir, welche Punkte auf meiner Agenda noch nicht erledigt sind.

In diesem Artikel widme ich mich daher nun einem elementaren Bestandteil einer jeden Website. Ein gestalterisches Element, das auch außerhalb der eigenen Seiten für Widererkennung sorgen soll. Die Rede ist vom eigenen Website-Logo.

Da meine Fantasie auch Grenzen hat, habe ich mir für den Anfang ein einfaches Logo zusammengeklickt, das vor allem als Platzhalter dienen sollte. Generell würde ich im Entwicklungsprozess immer empfehlen mit Platzhaltern zu arbeiten. So hat man schon mal die ungefähren späteren Proportionen vor Augen.

Allerdings sollte man sich auch nicht zu sehr an die Platzhalter gewöhnen oder noch schlimmer: diese vor lauter Betriebsblindheit komplett vergessen. Praktisch ist es daher, wenn man sich von Anfang an einen Merkzettel oder wie in meinem Fall eine To-Do-Liste (z.B. in Trello) bastelt.

Zurück zum Logo. Auch als Nicht-Designer kann man sich zum Glück, dank vieler praktischer Tools, relativ einfach und schnell ein eigenes Logo erstellen. Ich nutze hierfür beispielsweise Canva.

Woraus besteht ein Logo?

Bevor ich mit der Arbeit für mein Blog-Logo beginne, wollte ich sichergehen, dass ich nichts Elementares übersehe. Daher habe ich zu den Bestandteilen eines Logos recherchiert.

Ich verzichte an der Stelle darauf eine Passage aus Wikipedia zu zitieren, daher hier eine sinngemäße Zusammenfassung.

Was ich an dieser Stelle fälschlicherweise als Logo bezeichne, ist streng genommen eine Wort-Bild-Marke. Das eigentliche Logo, auch als Signet bezeichnet, ist dabei eigentlich nur das grafische Zeichen, das meist neben dem Firmennamen und ggf. noch dem aktuellen Slogan steht.

Interessanterweise werden der Slogan und das Signet dabei als optionales Element genannt.

Es wäre zwar schön, wenn ich bei dieser Gelegenheit zufällig das Rad neu erfinden würde, aber ich mache mir keine Illusionen, dass ich im ersten Versuch DAS Logo entwerfen werde. Zumal ich mich hierbei auch noch an der Datenbank von Canva bediene.

Vielmehr versuche ich diese Aufgabe praktisch anzugehen. Ich orientiere mich daher an den Bestandteilen aus der Definition von Wikipedia.

Hauptelement 1: Der „Unternehmensname“ bzw. Wortmarke

Da es sich hierbei um meinen persönlichen Blog handelt und die Domain ebenfalls meinen Namen trägt, ist dieser Punkt schnell abgehakt. Mein „Markenname“ ist mein persönlicher Name. Dieser sollte den Großteil des Website-Logos ausmachen.

Hauptelement 2: Die angebotene Leistung

Es ist zugegebenermaßen nicht sonderlich kreativ, aber es handelt sich hierbei um meinen persönlichen Blog. Ich biete hier meine Erfahrungen als Produkt an. Daher lautet der Untertitel oder Slogan meines Blogs kurzerhand „Persönlicher Blog“.

Solltest du einen Blog mit einem thematischen Schwerpunkt betreiben oder dies zumindest vorhaben, würde sich anbieten, diesen Schwerpunkt in das Logo mit aufzunehmen. Der Untertitel des Blogs kommt in der Regel häufig vor und ist damit auch seo-relevant.

Mir ist bewusst, dass dies in meinem Fall auch nicht sonderlich schlau gelöst ist. Ich wollte bzw. konnte mich vorab leider nicht für einen thematischen Schwerpunkt entscheiden, war aber auch zu faul, zu jedem Thema einen eigenen Blog anzulegen. Das Überthema meines Blogs sind meine privaten Interessen. Daher kann ich meine „angebotene Leistung“ leider auch nicht präziser als „Persönlicher Blog“ formulieren.

Nebenelement: Signet bzw. Bildmarke

Zu guter Letzt benötige ich noch ein Signet, um das Thema meines Blogs zu illustrieren. Eine Idee wäre mein Gesicht mit in das Logo integrieren. Das machen auch viele Blogger. Allerdings erschien mir die Idee etwas zu abgedroschen und zeitaufwendig. Daher habe ich mir eine Grafik ausgesucht, die andeuten soll, worum es auf meinem Blog geht.

Da meine Hobbys meist einen gemeinsamen Nenner namens Technik haben. Soll dieses Element den technischen Aspekt illustrieren. Technik ist immer noch ein sehr weit gefasster Begriff. Konsequenterweise müsste der Untertitel meines Blogs dann eigentlich auch „Mein persönlicher Technik-Blog“ lauten, aber das war mir einfach zu sperrig. Ganz glücklich bin ich damit zwar noch nicht, aber ich möchte auch Fortschritte erzielen und mich nicht zu lange mit relativ unwichtigen Detailfragen befassen.

Vorteile des Canva Logo Makers

Einer der offensichtlichen Vorteile des Canva Logo Makers ist die einfache Bedienung. Ich beherrsche zwar Photoshop und auch Illustrator, allerdings nicht in dem Umfang, als dass ich spontan ein astreines Logo entwerfen könnte. Hier spielt der Faktor Zeit eine zu große Rolle. Mit dem Canva Logo Maker kann man schnell viele Logos im eigenen Blog Design erstellen. Feinheiten kann man immer noch mit Photoshop bearbeiten.

Ein viel wichtigerer Punkt stellt für mich allerdings der rechtliche Aspekt dar. Mit einem Canva-Abo erhält man nämlich Zugang zu etlichen Grafiken inklusive Lizenzen. Das ist vor allem im anfänglichen Designprozess praktisch, wenn man noch häufig die eigene Meinung ändert. Bevor man sich etliche Grafiken auf anderen Plattformen lizensiert, kann man mit Canva erst einmal zum Festpreis beliebig viele Designs ausprobieren.

Sollte man auf Canva schließlich fündig werden, kann man das Logo im Anschluss unter bestimmten Bedingungen auch problemlos nutzen. Dies ist aus meiner Sicht ein großer Vorteil gegenüber vielen kostenlosen Image-Datenbanken, bei denen man nie sicher sein kann, ob die angebotenen Grafiken auch tatsächlich auf der eigenen Website benutzt werden dürfen. Auf die genauen rechtlichen Bedingungen gehe ich aber an späterer Stelle in diesem Artikel noch genauer ein.

Nachteile des Canva Logo Makers

Die oben genannten Vorteile beinhalten aber auch jeweils eine negative Komponente. Canva bietet sich zwar wunderbar für einfache Grafiken an, allerdings wird die Umsetzung aufwendiger Grafiken schnell unübersichtlich. Eine Übersicht der einzelnen Ebenen, wie man sie aus Photoshop kennt, habe ich bisher jedenfalls nicht gefunden. Das ist besonders unpraktisch, wenn man höher liegende Elemente zur Seite schieben muss, um tiefer liegende Elemente zu bearbeiten.

Mein Hauptbeweggrund zur Nutzung von Canva sind die beinhalteten Lizenzen bzw. die damit verbundene Datenbank mit ihren Fotos und Vorlagen. Dies schließt logischerweise eine gewisse Exklusivität aus, da jeder Canva-Nutzer Zugriff auf diese Elemente hat. Zwar kann man viele Grafiken bearbeiten und an das eigene CI anpassen, aber ein exklusives Logo mit Alleinstellungsmerkmal wird man hier auf Anhieb nicht finden.

Ein Logo mit Canva erstellen

Wie erstellt man denn nun ein eigenes Logo mit Canva? Bevor ich das tausendste Video zu diesem Thema aufnehme, binde ich an dieser Stelle kurzerhand zwei praktische Tutorials ein.

Canva Logo Tutorial von „So geht Canva“

Sie sehen gerade einen Platzhalterinhalt von Youtube. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Mehr Informationen

Inhalt entsperren Erforderlichen Service akzeptieren und Inhalte entsperren

Elisabeth Frisch hat auf ihrem Blog noch viele weitere Artikel zum Thema Canva.

Canva Logo Tutorial von Julian Weber

Mehr Informationen

Inhalt entsperren Erforderlichen Service akzeptieren und Inhalte entsperren

Julian Weber bringt das Thema Logo mit Canva erstellen in folgendem Video ebenfalls präzise auf den Punkt.

Meine ersten Entwürfe

Während du dir gerade die beiden Videos angeschaut hast, habe ich die Zeit genutzt, um einige Entwürfe für mein Logo zu erstellen. ;-) Spaß beiseite. Tatsächlich habe ich bereits einige Entwürfe erstellt, konnte mich allerdings noch für kein finales Logo entscheiden. Je nachdem wann du diesen Artikel liest, wirst du feststellen, dass sich am Logo noch nichts geändert hat.

Ich wollte meine Entwürfe dennoch gerne mit dir teilen. Zum einen möchte ich damit untermauern, dass ich, selbst mit einem einfach zu bedienenden Tdaool wie Canva, keine direkten One-Hit-Wonder gelandet habe. Zum anderen wird so mein persönlicher roter Faden etwas besser deutlich. Du kannst also etwas besser nachvollziehen, worauf ich bei der Erstellung meines Logos geachtet habe.

Die richtige Schriftart

Auf meinem Blog nutze ich primär die Open Sans Schriftart von Google. Keine Panik! Ich habe diese lokal eingebunden. Mein Website-Logo soll sich vor allem gut in die restliche Seite einfügen. Aus diesem Grund nutze ich auch hier den Open Sans Font von Google.

Denkbar wäre auch, den Titel, also „Daniel Beuing“, in einer anderen Schriftart darzustellen und lediglich den Slogan „Persönlicher Blog“ in Open Sans zu gestalten, um eine grafische Verbundenheit zur restlichen Website zu erhalten.

Form, Ausrichtung und Seitenverhältnis

Bei der Form und Ausrichtung meines Website-Logos versuche ich mich an geraden Linien zu orientieren. Ist das Logo rechteckig, sollten Titel und Slogan jeweils oben und unten bündig mit dem daneben befindlichen Signet abschließen. Ist das Logo hingegen quadratisch, versuche ich alle Elemente horizontal zu zentrieren.

Guidelines erstellen

Wohlwissend, dass dies ein riesiger Fehler ist, treffe ich die gestalterischen Entscheidungen aus dem Bauch aus. Dies hat in meinem Fall zum einen mit mangelnder Expertise und zum anderen mit dem Faktor Zeit zu tun. Dennoch möchte ich an dieser Stelle nicht verschweigen, dass es nicht ohne Grund Guidelines gibt und große Brand nicht grundlos komplette Kataloge zur eigenen Corporate Identity anlegen. Wenn du also etwas mehr Zeit in die Gestaltung deines Blogs investieren möchtest und gegebenenfalls mit dem Gedanken spielst dir ein eigenes Ruleset oder einen Guide anzulegen, empfehle ich dir für den Einstieg folgenden Artikel von 99designs.de.

Ein Logo aus Canva exportieren

Beim Export meines Logos aus Canva stehen mir mehrere Optionen zur Verfügung. Neben den offensichtlich unpassenden Dateiformate PDF und MP4, wäre zu entscheiden, ob ich mein Logo auf meiner Website als JPG, PNG, SVG oder GIF einbinden möchte.

JPG, PNG, GIF oder SVG?

Hierzu eine kurze Entscheidungshilfe:

JPG bietet sich eigentlich nur für Fotos oder Bilder mit hohem Detailgrad an. Mein Logo verfügt über wenige Farben, keine Farbverläufe und soll zudem einen transparenten Hintergrund haben. Damit scheidet JPG schon einmal aus.
GIF kann zwar transparente Hintergründe darstellen, allerdings verfügt dieses Dateiformat nur über 256 Farben. Da die Farben meines Blogs so nicht korrekt abgebildet werden können, fällt GIF als Dateiformat für mein Logo ebenfalls aus.
PNG kann transparente Hintergründe darstellen, eignet sich generell gut für Grafiken und bietet auch eine ausreichende Farbtiefe. Aber auch wenn es hier um Kilobytes geht, ist ein Logo im PNG-Format eigentlich zu groß.
Die richtige Antwort lautet also SVG. SVG-Dateien vereinen für ein Website-Logo alle Vorteile einer PNG und verbrauchen obendrein weniger Speicherplatz. Da es sich bei SVG-Dateien um Vektordateien handelt, können diese problemlos skaliert werden. Das ist bei responsiven Websites besonders praktisch.

Probleme mit SVG in WordPress ?

Dann kann ich mein SVG Logo jetzt hochladen, oder? Leider lautet die Antwort nein, denn standardmäßig erlaubt WordPress den Upload von SVG-Dateien nicht. Schaut man sich eine SVG-Datei mit einem Editor wie Notepad++ einmal genauer an, wird auch klar wieso.

Da es sich bei SVG-Dateien im Grunde um xml formatierte Dateien handelt, bietet sich dieses Dateiformat hervorragend an, um versteckte Links oder Schadcode in eine Seite zu schleusen. WordPress will hier also wohl vor allem die Nutzer schützen, die unbedacht SVG-Dateien von anderen Websites auf ihrer WordPress -Installation hosten.

Ein SVG-Logo in WordPress einbinden

Da ich mir zum einen selbst vertraue und mein exportiertes Logo im SVG-Format kontrolliert habe, steht aus meiner Sicht einer Verwendung nichts im Wege. Daher habe ich zwei Wege ermittelt, um WordPress SVG-ready zu machen.

SVG-Upload mittels Plugin

Wer es schnell und einfach lösen möchte, installiert sich kurzerhand eines der vielen Plugins, die den SVG-Support ermöglichen. Hier wäre SVG Support von Benbodhi zu empfehlen.

SVG-Support selbst programmieren

Da ich gerne auf externe Plugins verzichte und möglichst viele Features in mein eigenes Theme integrieren möchte, habe ich ebenfalls eine Lösung parat, wie man den SVG-Support ohne Plugins ermöglicht. Hierfür ergänze ich folgende Zeile in der wp-config:

define(‚ALLOW_UNFILTERED_UPLOADS‘, true);

Und schon kann ich SVG-Dateien (und alle anderen Dateiendungen auch) hochladen.

Rechtlicher Aspekt: Nutzungsvereinbarung

Wichtig zu wissen: der nachfolgende Abschnitt bezieht sich auf die sogenannten „Lizenzen für Inhalte und die kommerzielle Nutzung von Canva-Designs“ mit Stand vom 13.03.2023.

Ich bin zwar eingangs des Artikels schon auf die rechtlichen Rahmenbedingungen eingegangen, habe aber noch einen Aspekt ausgelassen: die Nutzungsvereinbarung (von Canva). Da mir der rechtliche Aspekt besonders wichtig ist, gehe ich im Folgenden noch einmal etwas detaillierter darauf ein.

Unter der Zwischenüberschrift „Vorteile des Canva Logo Makers“ habe ich die Lizensierung durch Canvas bereits positiv hervorgehoben. Aber Lizenz ist nicht gleich Lizenz. So gibt es mit den Creative-Commons-Lizenzen einige standardisierte Urheberrechtslizenzen, die sich im Nutzungsumfang untereinander stark unterscheiden und von sehr restriktiv bis zur praktisch freien Verwendung reichen.

Im Fall von Canva ist einfacher aufzulisten, welche Nutzung eines lizensierten Elements erlaubt ist, als alle erlaubten Verwendungen aufzulisten. Prinzipiell darf man alle in Canva lizensierten Assets auch gewerblich nutzen.

Lediglich der direkte Weiterverkauf von Inhalten ist untersagt. Dies leuchtet auch ein. Andernfalls könnte man in Canva hochauflösende Stock-Fotos gegen ein geringes Entgelt lizensieren und auf anderen Datenbanken mit einem höheren Preisniveau zum Verkauf anbieten. Sofern ich noch die Lizenz für die Schriftart klären würde, könnte ich also damit beginnen, mein Website-Logo auf T-Shirts, Kaffeetassen usw. zu drucken und zum Verkauf anzubieten. Für den Start reicht mir aber erst einmal die Einbindung in meine Website. ;-)

Canva unterscheidet zwischen Free-Inhalten und Pro-Inhalten. Mit einem Free-Abo kann man alle kostenlosen Assets lizensieren und gegen eine geringe Gebühr auch ausgewählte Pro-Inhalte lizensieren. Ich habe vor kurzem ein Pro-Abo abgeschlossen, sodass ich auf alle Premium-Inhalte Zugriff habe und diese entsprechend lizensieren kann.

Die Lizensierung erfolgt dabei automatisch durch die Nutzung des jeweiligen Assets. Urheber bzw. Creator müssen meines Wissens nicht genannt werden. Allerdings finde ich es eine gute Praxis, entsprechende Urheber zu nennen. Im Übrigen arbeite ich bereits an einer automatischen Lösung für diese Aufgabe innerhalb meines Blogs. Aber dazu an anderer Stelle mehr.

Für eine korrekte Auskunft solltest du dennoch die entsprechenden Vereinbarungen selbst lesen. Die entsprechenden Nutzungslizenzen habe ich am Ende des Artikels noch einmal verlinkt.

Zusammenfassung

Wenn man nicht zufällig selbst Designer oder Grafiker ist, sollte man sich meiner Meinung nach nicht zu lange mit dem Thema Website-Logo aufhalten. Das schließt zwar nicht aus, dass man sich über die Wortmarke, den Slogan bzw. die angebotene Leistung und das Signet Gedanken macht, aber ich möchte hier nicht zu viel Zeit verlieren.

Wichtiger ist mir daher ein simples und sauberes Logo, anstatt auf zu viel kitschigen Firlefanz zu setzen.

Beim Dateiformat empfehle ich die Nutzung eines Logo im SVG-Format. Wenn du bei der Erstellung und Einbindung zu viele Probleme hast, tut es ein Logo im PNG-Format aber ebenfalls.

Mein vorerst finales Website-Logo werde ich in den kommenden Tagen austauschen. Selbst wenn ich am Ende nicht hundertprozentig zufrieden bin, werde ich davon absehen mein Logo zu häufig zu ändern. Darunter würde schließlich auch der Wiedererkennungswert leiden.

Sollte dieser Blog jemals erfolgreich werden, kann ich immer noch einen Grafiker mit der Erstellung eines einzigartigen und vor allem professionellen Logos beauftragen. Der Erfolg dieses Blogs wird aber sicherlich nicht an einem hässlichen Logo scheitern. :-D