Neue Webseite – das habe ich verbessert

Bei meiner alten Webseite habe ich Fehler gemacht. Diese Fehler führten in Summe dazu, dass ich meine Webseite von Grund auf neu gestalten wollte. Warum und weshalb möchte ich dir gern erklären. Vielleicht helfen dir meine Erkenntnisse bei der Entwicklung oder Optimierung deiner Seite.

Als ich 2016 meine alte Webseite konzipierte, hatte ich noch nicht die Kenntnisse, die ich heute habe. Ich hatte noch kein UX Design Seminar absolviert und habe aus Usability-Sicht einiges falsch gemacht.

Ich habe zu wenig darauf geachtet, was meine Zielgruppe favorisiert und womit sie sich komfortable fühlt. Das und vieles mehr habe ich zuletzt im Online-Coaching bei Sandra Holze (Dein Online-Business Kick) gelernt.

SEO hatte ich auch nicht vollumfänglich im Blick. Auch hier gibt es in meinem Fall Gründe, die gegen den Aufbau meiner alten Seite sprachen. Dazu später mehr.

Hinzu kommt, dass sich meine Ziele geändert haben: Ich habe zwar damals den Blog berücksichtigt, bin aber zunächst nicht davon ausgegangen, dass ich regelmäßig Artikel schreiben werde.

Inzwischen habe ich neben dem Blog sogar meinen Design-Letter (Newsletter) gestartet und ein kleines E-Book geschrieben, welches Tipps und Inspiration zum Thema Logo Design enthält und welches der User sich über meine Landingpage downloaden kann. Beides war damals noch nicht in Planung. Ich hatte also noch keinen Schimmer, dass ich Online-Marketing betreiben und ein Online-Business aufbauen will.
Entsprechend habe ich relevante Dinge vernachlässigt und Fehler gemacht, aus denen ich inzwischen gelernt habe.

Was ich bei der Neuentwicklung meiner eigenen Webseite unbedingt besser machen wollte:
 

Zielgruppe stärker in den Vordergrund rücken

Schaut man sich Webseiten von internationalen Designern an, sind sie oft hip und ihrer Zeit voraus. Mein OnePager plus Bog war damals auch recht innovativ, aber meine Zielgruppe fand sich dort nicht zurecht. Sie orientiert sich lieber an einer Seite, die auch für sie selbst in Frage kommt, die also klar aufgebaut ist und intuitiv bedienbar.
Deshalb habe ich meine neue Seite mit dem WordPress-Theme aufgebaut, welches ich meinen Kunden empfehle. Dieses Theme ist extrem benutzerfreundlich und bietet unzählige Möglichkeiten. Es wurde meinen Anforderungen und meinem Markendesign angepasst, genauso wie ich es bei meinen Kunden handhabe.
 

Langfristige Ziele berücksichtigen

2016 hätte ich mich noch gerechtfertigt: „ich hab das mit dem Online-Marketing nicht kommen sehen – ich konnte also die Anforderungen damals nicht berücksichtigen.“ Heute habe ich einen Plan mit langfristigen, großen Zielen, die auf kleine Ziele und Zeiträume runtergebrochen sind. Insofern weiß ich heute schon, wo die Reise in ein paar Jahren hingeht.

Natürlich wird es technische Entwicklungen geben, die ich nicht vorhersehen kann. Deshalb habe ich weiterhin auf das Content Management System WordPress gesetzt, das meist genutzte CMS, welches kontinuierlich verbessert und weiterentwickelt wird und es mir ermöglicht, die Webseite zukünftig anzupassen und zu erweitern.
 

SEO & Benutzerfreundlichkeit verbessern

 

H1-Hx sinnvoll wählen

Google bewertet die Relevanz von Headlines chronologisch: Die Headline 1 (H1) wird in ihrer Bedeutung stärker gewichtet als die H2, H3, usw..
Diesen Punkt habe ich übersehen, beziehungsweise ich habe mich damals nicht selbst um die Verteilung von Überschriften gekümmert. Die Überschriften in meinem Blog lauteten H4 und H5. H1 und H2 waren als Schrift zu groß für die Artikel, sie kamen ausschließlich auf der Webseite vor. Das war sehr ungünstig. Denn ich veröffentlichte regelmäßig Artikel, deren Überschriften von Google nur mittelmäßig bewertet wurden.
Wenn du bloggst, achte also unbedingt darauf, dass die großen Überschriften im Blog als H1 und die Zwischenüberschriften als H2 und ggf. noch als H3 und H4 definiert sind.
 

Eine konsistente CTA-Farbe

Ich habe meine alte Seite zu Beginn schwarz/weiß gestaltet. Schließlich sind das meine Corporate Design-Farben. Als ich dann ein Jahr später im UX Design Seminar saß, hat mir dieser Satz unseres Seminarleiters Bauchschmerzen bereitet: „Es ist ein grober Fehler, wenn Designer Webseiten nur in den CD-Farben gestalten. Da müssen wir als UX Designer eingreifen“. Warum? Weil Farben dem User helfen sich zurecht zu finden.
Ich habe mir also Sekundärfarben zugelegt: Ein pastelliges Gelb und Grün. Das Gelb zeigt an, wenn eine Aktion auf meiner Webseite möglich ist. Ich nutze diese Farbe für Buttons und für Flächen, die verlinkt sind. Das Gelb ist also meine Call-to-Action-Farbe (CTA-Farbe). Das pastellige Grün zeigt an, wenn eine Handlung richtig durchgeführt wurde, z. B. die Anmeldung zum Design-Letter.
Je nach Größe und Umfang der Webseite sollten noch weitere Farben zum Einsatz kommen: Rot zum Beispiel. Rot sollte eine Meldung erscheinen, wenn der User eine Handlung falsch durchgeführt hat.
 

Kein OnePager mehr

Ich fand den OnePager damals toll: Er bietet alle Informationen auf einer Seite und er funktioniert oft ohne große Anpassungen prima auf mobilen Endgeräten.

Deine Webseite konvertiert schlecht?

Dann hol dir jetzt die 6 Schritte-Anleitung für ein nutzerfreundliches Webdesign, das die Usability fördert und hilft, dass deine Angebote genutzt werden.

Auf Webseiten mit Unterseiten und komplexer Struktur kann der User sich schonmal „verlaufen“, bei einem Onepager kann das nicht passieren.

Das klingt erstmal nach günstigen SEO- und UX-Bedingungen. ABER bei meinen Inhalten waren die SEO-Bedingungen trotzdem ungünstig, weil ich alle Inhalte auf einer Seite hatte und zwar etliche: Bilder, Bildgalerien, andere Gestaltungselemente und lange Texte. Dass bedeutet, die Ladezeit war entsprechend lang und das führte dazu, dass die User schnell absprangen. Wenn die Seite lädt und lädt, verlieren viele User die Geduld. Das merkt auch Google und straft die Webseite im Ranking ab.

Zudem haben Inhalte, die auf einer Webseite weiter oben angezeigt werden, eine höhere Relevanz. Auch diesbezüglich war meine Wahl kein Glücksgriff. Hätte ich meine Inhalte auf mehrere Seiten verteilt, hätte ich logischerweise öfter Inhalte mit höherer Relevanz.
Zudem konnte ich nicht auf Unterseiten verlinken, was auch blöd ist, denn Google bewertet Verlinkungen innerhalb einer Seite positiv.

In meinem Fall sprechen also gute Gründe gegen einen OnePager.
 

Anpassung der Typografie

Meine Hausschrift gehört von Beginn an zu Goldmarie und ich habe sie beibehalten. Eine serifenbetonte Schrift (mit kleinen Häkchen an den Buchstaben) sieht man im Web eher selten und das hat einen Grund: Serifen sind oft sehr fein und brechen in der Bildschirmansicht weg. Dadurch sind sie im Web nicht ideal anzuwenden.
Meine Hausschrift hat kräftige Serifen, insofern trifft das nur bedingt auf sie zu. Ich habe sie weiter für Headlines und Button-Texte eingesetzt, aber die Body, den Fließtext und die Navigation habe ich nun in einer serifenlosen Schrift abgebildet.
 

Funktioneller Blog

In meinem Blog hatte ich schon vieles nachgerüstet, z. B. Anleser für weitere interessante Artikel auf der Blog-Übersichtsseite und auf der Artikel-Seite. Aber ich wollte noch weitere Verbesserungen vornehmen:
 

Kategorien

Ich habe damals keine Kategorien genutzt, diese machen aber durchaus Sinn: Manche Leser interessieren sich nur für Logodesign, andere ausschließlich für Webdesign. Anhand von Kategorien kannst du jetzt, die für dich relevanten Artikel sortieren.
 

Kürzere Zeilen

Die Zeilen in meiner Artikelansicht waren etwas zu lang, das beeinträchtigte den Lesekomfort: Das Auge muss beim Umruch zu weit wandern um an den nächsten Zeilenanfang zu gelangen. Eine Zeilenlänge von 55-90 Zeichen hält den Leser bei Laune.
 

CTA-Elemente in Artikeln

Ich hatte unter meinen Artikeln ein Bild platziert, welches auf meine Landingpage verlinkt. Diese CTA-Elemente (Call-to-Action-Elemente) kann ich nun via Shortcode einbinden, also nicht mehr als Bild. Das bedeutet weniger Ladezeit.
 

Das behalte ich bei

An meiner alten Seite war nicht alles verbesserungswürdig. Puh! Das wäre auch übel. Bewährtes wird beibehalten:
 

Die Zusammenarbeit mit einem Programmierer

Der Crawler von Google liebt technisch sauber entwickelte Webseiten und das Webdesign sollte Updates vom System und installierten Plugins überstehen. Deshalb habe ich auch meine neue Seite mit einem geschätzten Programmierer umgesetzt.
 

Mein Markendesign

Natürlich habe ich mein Design ein wenig modernisiert, aber die grundlegenden Design-Elemente, das Look & Feel habe ich beibehalten.
 

Inhalte und Artikel

Die Inhalte wurden teils angepasst, im Kern hat sich aber nichts geändert.
 

Fazit

Auch ich lerne als Webdesignerin ständig dazu. Aus meinen Fehlern ergeben sich neue Lösungen und ich sehe zu, dass ich am Ball bleibe. Dieser Bereich entwickelt sich so schnell, dass ich mich ständig fortbilden muss, um auf dem neusten Stand zu bleiben.
Der Aufbau meiner neuen Seite war ein Kraftakt. Was auf den ersten Blick wie „mal eben gemacht“ wirkt, bedeutet in der kreativen Branche oft vielmehr Arbeit, als sich manch einer vorstellen mag. Ich musste immerhin auch noch das Tagesgeschäft stemmen. Insofern bin ich froh, dass ich das nun vom Tisch habe.

Happy day!
Goldmarie a.k.a. Su Wiemer

Susanne Wiemer
Hola, ich bin Goldmarie a.k.a. Su Wiemer und ich zeige dir, wie du einen Online-Auftritt gestaltest, der deine Wunschkunden magisch anzieht und sie in Kunden umwandelt – Design matters!

Kommentar absenden

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.