Blog – Wissen für die Zusammenarbeit und die Entwicklung deiner Website

Tipps für die Gestaltung deiner Website-Inhalte

Manches kann dir die Technik nicht abnehmen.

Früher war meine Arbeit sehr viel überschaubarer. Ich konnte ›pixelgenau‹ das Design einer Website festlegen und hatte die alleinige Kontrolle über die Darstellung der Inhalte. Meine KundInnen konnten da nicht mitmischen. Das war natürlich beruhigend, weil ich alles schön im Griff hatte und meine Designerrolle voll ausleben durfte. Das wäre ja noch schöner, wenn da plözlich Laien drin herumpfuschen ;-) Tja, glücklicherweise hat sich das Thema Website aber auch meine Einstellung mittlerweile weiterentwickelt. Aber als Betreiberin deiner Website hast du durch diese veränderte Ausgangssituation auch ein paar Herausforderungen hinzugewonnen, wenn du deine Inhalte selbst pflegst und gestaltest.

Tipps für die Gestaltung deiner Website-Inhalte

Hallo, ich bin Annika, selbstständige Designerin und ich unterstütze Existenzgründer, Selbstständige und kleine Unternehmen dabei, sich sichtbar zu machen.
In diesem Blog teile ich auch nützliches Wissen zu Design-Themen und zur Zusammenarbeit, das dir direkt weiterhelfen kann.

Das Medium Web und die Einfachheit von Tools – Fluch und Segen zugleich.

Früher war eine direkte und aktive Beteiligung von Kundenseite bei der Pflege einer Website und beim Anlegen von Inhalten technisch nicht so einfach wie heute. Erst bei größeren Web-Projekten hat sich der Aufwand eines Redaktionssystems gelohnt und die Möglichkeiten waren begrenzter als heute. Bei einer normalen statischen Website musste ich als Designerin bei jeder Änderung tätig werden. Bei einer Website, die das Unternehmen meiner KundInnen aktuell abbilden soll, eigentlich nicht die optimale Lösung.

Die Zeit der statischen Website ist vorbei, oder?

Streng genommen gibt es den Zustand einer Statischen Website bzw. einer Website, die nur durch eine Fachperson (Designerin, Entwickler) bearbeitet wird, natürlich immer noch. Und auch bei mir ist es so, dass nicht alle meine KundInnen ihre Website selbst pflegen – aus unterschiedlichen durchaus berechtigten Gründen. Je nach Branche und Zielen kann eine weitestgehend statische Website auch in Ordnung sein. Lies dazu auch, wann eine Statische oder dynamische Website für dich geeignet ist.
Aber die Tendenz geht sehr deutlich zu einer ›dynamischen‹ Website, die komfortabel mit Redaktionssystem (in unserem Fall Wordpress) selbst gepflegt und ausgebaut werden kann. Das hat viele Vorteile und passt auch viel besser zur Realität des Internets, das sehr dynamisch ist. Und auch Selbstständigkeit und Unternehmertum ist ja alles andere als statisch. Hier passiert viel hinter den Kulissen und Kundenbeziehungen und Marketing leben natürlich auch von Aktivität. Die statische Website die fast ›nur herumliegt‹ und kaum verändert wird, kann da nicht mehr so richtig mithalten.

Du hast zwar die Macht über deine Website, hast aber auch plötzlich die Rolle der Designerin.

Wenn meine KundInnen ihre Website selbst vervollständigen, pflegen und ausbauen, führt das zwangsläufig zu (neuen) Herausforderungen. Denn plötzlich ist da keine Designerin mehr dazwischengeschaltet, die die Inhalte ansprechend verpackt und Details geraderückt. Als Website-BetreiberIn sitzt du plötzlich allein vorm Bildschirm und ›schubst‹ deine Website-Inhalte selbst hin und her. Das klingt jetzt etwas zu abschätzig. Denn das Selbst-Herumwerkeln ist ausdrücklich erwünscht und das kann auch ganz prima klappen. Aber es braucht meist auch etwas Zeit und Training.

Es wird nicht so aussehen wie in der hübschen Demo-Version.

Nicht von Anfang an sieht alles so toll aus wie in der Werbung oder wie in der hübschen Demo-Version eines vorgefertigten Website-Rahmenaufbaus. Du darfst dir deine Rolle als ›Ersatz-Designerin‹ also ruhig mal bewusst machen, wenn du loslegst.

Beschäftige dich damit, was du da eigentlich tust, wenn du deine Website-Inhalte bearbeitest. Warum stellst du Inhalte so oder anders dar? Welches Ziel hat der Inhalt und die jeweilige Seite und wie kannst du deine Inhalte so gestalten, dass deine Besucher sich wohlfühlen und Infos einfach zugänglich sind. Damit das leichter fällt und weil ich als Designerin eben nicht neben dir sitzen kann, während du deine Website bearbeitest, habe ich hier ein paar Tipps, wie du selbst das Design deiner Inhalte verbesserst:

Tipps, die die Design-Qualität deiner Website-Inhalte verbessern.

1. Baue deine Seiten gleichbleibend nach festen Regeln auf.

Ja, so ein eigentlich selbstverständlicher Allerwelts-Tipp gleich am Anfang. ;-)
Mach dir den Aufbau bewusst, den die Seiten haben sollen bzw. den bisherige Seiten schon haben. Welchen roten Faden gibt es? Ist zum Beispiel oben immer ein großes Bild und ein auffälliger Einleitungstext platziert? Welche Regeln gibt es, die auf allen Seiten eingehalten werden?
Du kannst auch verschiedene Darstellungen der Inhalte als Module betrachten, die immer nach dem gleichen Prinzip aufgebaut sind und die du je nach Bedarf auf deinen Seiten anders kombinieren kannst. Ordne Inhalte innerhalb dieser Module an und geh nicht einfach zufällig mit der Darstellung von neuen Inhalten um.
Und versuche, Inhalte gleicher Art immer gleich darzustellen. Wenn du in einem Artikel auf ein dazu passendes Produkt hinweist, zum Beispiel in einem leicht farbig hinterlegten Kasten, dann mach das auf anderen Seiten auch immer genau so. Dann können sich Besucher leichter orientieren und Inhalte thematisch zuordnen.

2. Versuch regelmäßig die Sicht des Besuchers / der Besucherin einzunehmen.

Diesen Tipp hast du bestimmt schon oft in Bezug auf deine Website gehört aber wendest du ihn schon konkret an?
Nimm beim Überprüfen deiner gestalteten Inhalte immer mal wieder die Sicht eines Besuchers ein. Stell dir vor, jemand anderes (dein Wunschkunde) sieht die Seite zum ersten Mal an. Oft fallen dabei Details auf, die du noch verbessern kannst. Zum Beispiel, dass der Button zu deinem Angebot oder zu einer weiterführenden Seite viel zu unauffällig ist und ein Besucher diesen vielleicht gar nicht auf den ersten Blick findet. Oder du stellst fest, dass zu viele Auszeichnungen und Überschriften miteinander konkurrieren und jemand, der die Seite noch nicht in- und auswendig kennt, damit überfordert sein könnte. Beobachte auch, wie du selbst dich auf Websites von anderen verhältst und was dich dort stört oder anspricht. Und nutze diese Erfahrungen für die Gestaltung deiner Inhalte.

3. Erkenne den Wert von Details.

Häufig sehe ich auf den Websites von anderen Selbstständigen gestalterische Kleinigkeiten, die etwas holperig aussehen oder einfach nicht konsequent durchgezogen wurden. Das kommt auf ›gewachsenen‹ Websites vor, weil sich im Laufe der Zeit Zufälligkeiten eingeschlichen haben aber auch auf Anfänger-Websites, die noch etwas laienhaft mit Leben gefüllt wurden. Eine Überschrift ist versehentlich größer als die anderen Überschriften der gleichen Kategorie oder hat eine andere Schriftart, die nicht zur Logik der restlichen Darstellung passt. Oder Bilder wurden in einer zu kleinen Größe eingebunden und sehen etwas verschwommen aus. Texte sind komisch unterschiedlich eingerückt und es gibt irgendwie keine klare Linie. Du hast dir beim Anlegen der Inhalte vielleicht nichts dabei gedacht.
Aber solche Details machen oft genau den Unterschied, der Websites etwas ›selbstgebastelt‹ oder stimmig und professionell wirken lässt. Es sind die Details, die dafür sorgen, dass die Website insgesamt vertrauenswürdig wahrgenommen wird und die Erwartungen der Besucher eher übertrifft als enttäuscht.

4. Weniger ist mehr.

Wenn du unsicher bist und noch nicht so viel trainiert hast, deine Website-Inhalte zu gestalten, begrenze dich selbst und halte es im Zweifelsfall einfach. Auch wenn es dir vielleicht etwas eintönig vorkommt. Das ›gewisse Etwas‹ und Aufmerksamkeitsverstärker kannst du später immer noch hinzufügen. Und schon ein ansprechendes Bild oder einige gute Zwischenüberschriften lockern ein zu gleichförmiges Gesamtbild schnell wieder auf.
Oft erlebe ich bei meinen KundInnen, dass sie steckenbleiben, weil sie das Gefühl haben, sie müssten irgendetwas besonderes mit den Inhalten anstellen. Aber das muss gar nicht unbedingt sein. Geh erst einmal vom Inhalt aus und sorge dort für Qualität. Hier gibt es Tipps für gute Inhalte. Der Rest ergibt sich oft ganz natürlich. Nach und nach kannst du die Gestaltung erweitern und bekommst ein Gefühl dafür, was auf der Seite gestalterisch noch bereichernd sein könnte.

5. Schau dir deine Inhalte auf verschiedenen Geräten an.

Dein Inhalt sieht auf dem großen Bildschirm schon ziemlich ansprechend aus. Glückwunsch. Allerdings wächst die mobile Nutzung des Internets. Viele Besucher kommen vielleicht mit einem Smartphone auf deine Website. Vielleicht sind es sogar schon mehr als diejenigen mit einem großen Bildschirm. Und erfahrungsgemäß ist die Darstellung auf mobilen Geräten nicht immer vom System schon optimal vorbereitet. Hier gibt es also durchaus Potential deine Inhalte noch anzupassen und zu optimieren. Auf dem kleinen Bildschirm kannst du auch sehr gut überprüfen, ob deine Inhalte einfach konsumierbar sind und trotz der begrenzten Darstellungsmöglichkeiten gut funktionieren.

6. Trainiere und probiere aus.

Gestalten ist weniger ein besonderes kreatives Talent als vielmehr regelmäßiges Training. Tut mir leid, wenn ich dir die Illusion raube, dass das nur Künstlern und Designern vorbehalten ist. Also geh bitte nicht mit der Einstellung daran, dass du so etwas einfach nicht kannst. Du kannst es vielleicht NOCH nicht. Aber das ist ein Riesenunterschied. Akzeptiere, dass dir die Ergebnisse am Anfang vielleicht überhaupt noch nicht gefallen. Nicht direkt am Anfang sieht alles harmonisch und toll aus. Auch nicht bei mir. Aber wenn du gar nicht erst trainierst und es nicht ausprobierst, wirst du vielleicht immer unzufrieden bleiben und die Ergebnisse können mit der Zeit nicht besser werden.

7. Unterschätze nicht den Wert einer guten Darstellung.

Ach ja: Und falls du denkst, die Darstellung deiner Inhalte ist doch gar nicht so wichtig, solange die Inhalte gut sind. Hinterfrage das ruhig nochmal. Gute Inhalte und gute Gestaltung sollten Hand in Hand gehen. Die Gestaltung soll die Inhalte transportieren. Wenn deine Besucher die Website holprig, hässlich oder unprofessionell finden und sich nicht schnell zurechtfinden, verlassen sie die Website vielleicht schon wieder, bevor du sie mit den Inhalten überzeugen konntest.

Konkrete Tipps für die Gestaltung von Inhalten auf einer Seite.

Klingt ja ganz nett, aber was kannst du konkret tun, um deine Inhalte attraktiv, nutzerfreundlich und verständlich zu gestalten?

1. Nutze nicht alle Darstellungsmöglichkeiten (in deinem Wordpress-Editor).

Klingt merkwürdig? Wenn du doch so viele tolle Darstellungsmöglichkeiten im Editor deines Redaktionssystems (zum Beispiel im Gutenberg-Editor von Wordpress) hast, warum sollst du die dann nicht alle benutzen? Warum nicht aus dem Vollen schöpfen?
Versuch dich in deinen Besucher hineinzuversetzen. Dieser möchte in der Regel nicht mit dem vollen Programm an medialer Reizüberflutung konfrontiert werden, um dann so richtig beeindruckt zu sein. Er möchte schnell verstehen, worum es geht und leicht Informationen finden. Und du überzeugst niemanden von deinem inhaltlichen Angebot, nur weil du im Editor alle verfügbaren Blöcke, Stile und Farben ausprobiert hast und stolz auf deiner Website präsentierst. Weniger ist mehr. Aber meistens am schwersten.

2. Gewichte die Inhalte durch die Gestaltung.

Frag dich, welche Inhalte auf der jeweiligen Seite am wichtigsten sind oder an welchen Stellen Besucher hängen bleiben sollen. Auf welche Inhalte und Botschaften möchtest du besonders aufmerksam machen? Gewichte diese Inhalte optisch, indem du sie beispielsweise mit einer Hintergrundfarbe abgrenzt, größer machst oder durch ein grafisches Element (ein Icon oder einen Trennstrich) hervorhebst. Aber geh bitte auch nicht zu inflationär mit Hervorhebungen um. Hervorhebungen können nur wirken, wenn es als Gegenstück auch ausreichend zurückhaltendere Elemente gibt.

3. Nutze Abstände und Weißraum.

Mein absoluter Lieblingstipp!
Wenn Inhalte keine ausreichenden Abstände zueinander haben, sieht die Seite schnell unübersichtlich und etwas vollgestopft aus. Vielleicht auch ohne, dass es dir bewusst auffällt, solange du es nicht mit dem Zustand mit mehr Abständen und Weißraum direkt vergleichen kannst.
Abstände helfen dem Besucher deutlich zu erkennen, welche Elemente zusammengehören und wo ein neuer Abschnitt anfängt. In der Gestaltung kennt man das auch als das ›Gesetz der Nähe‹.

Mir begegnet dieser Fehler auf Websites recht häufig und es kribbelt mich dann immer in den Fingern, für Platz und Freiraum zu sorgen. Auch in der mobilen Ansicht, wenn alle Inhalte linear untereinander folgen, tun Abstände gut. Wenn es keine deutlichen Abstände gibt, ist man nämlich plötzlich nicht mehr sicher, ob zum Beispiel ein Bild eigentlich zum Text darunter oder darüber gehört. Alles wirkt gleichwertig zusammenhängend, man weiß nicht mehr wo etwas aufhört oder etwas neues anfängt.

Aber auch auf großen Bildschirmen tun Abstände zwischen Inhalten gut. Die Inhalte entfalten durch den Platz viel mehr Wirkung und das Auge findet sich leichter zurecht. Abstände und Weißraum sind also definitiv kein verschenkter Raum.
Im Wordpress-Editor gibt es einen passenden Block ›Abstandshalter‹ dafür. Nutze den Block gerne und viel, denn meistens werden Standard-Abstände nicht automatisch schon großzügig genug vorgesehen.

4. Nutze gute Bilder gezielt als Verstärker.

Wenn dein Inhalt noch etwas eintönig wirkt und die eigentlich interessanten Texte gar nicht so richtig rüberkommen, lockern Bilder oder Grafiken das Layout auf. Bilder sind Blickfänger und es macht einfach mehr Spaß als nur ›Textwüsten‹ durchzuscrollen. Aber sei auch hier achtsam und nutze Bilder gezielt und nicht inflationär. Bilder sollten auch nicht benutzt werden, um zu kaschieren, dass Inhalte eigentlich hohl sind und wenig Mehrwert haben. Das durchschauen Besucher recht schnell. Genau so merken Besucher auch, wenn ausschließlich oberflächliche Stockfotos inflationär genutzt werden.
Versuch, die richtige Mischung zu finden und eine ›echte‹, lebendige Wirkung mit Fotos zu erzielen.

5. Strukturiere Texte in angenehme Häppchen.

Nicht nur Suchmaschinen lieben Zwischenüberschriften und gut strukturierte Inhalte. Auch Besucher freuen sich über angenehme Textportionen und gute Überschriften, um den Text ›scannen‹ zu können. Was angenehm und passend ist, hängt immer vom Kontext ab. Frag dich auch hier hier im Zweifelsfall wieder, wie würdest du selbst gern den Text lesen. Was würde dir helfen, mit deiner Aufmerksamkeit dabei zu bleiben. Setze Auszeichnungen und Überschriften logisch und konsequent ein und nicht irgendwie zufällig. Vergleiche deine Seiten und Inhalte miteinander, um zu prüfen, ob ein Muster bzw. ein Rhythmus in deinen Texten erkennbar bleibt.

6. Setze Handlungsaufforderungen / weiterführende Links gezielt ein.

Manchmal gibt es auf Seiten gar keine weiterführenden Links oder Handlungsaufforderungen (sogenannte CTA = Call to Action). Das ist schade, weil Besucher ja vielleicht gerade dabei sind, sinnvolle Angebote oder weiterführende Inhalte auf deiner Website zu suchen und sich gern gezielt weiter umsehen möchten.
Auch das andere Extrem kann schwierig sein. Nämlich, wenn Besuchern zu viele Links / Buttons angeboten werden. Das kann überfordernd und verwirrend wirken. Es gibt keine klare Reiseroute durch die Website. Der Besucher muss ständig entscheiden, welchem Link er folgt und welchen Links nicht. Darum frag dich bei allen deinen Seiten und Inhalten, welches Angebot oder welche weitere Seite auf deiner Website könnte den Besucher jetzt am meisten interessieren. Begrenze diese Handlungsaufforderungen unbedingt auf eine möglichst kleine Anzahl und kennzeichne den wichtigsten Link (CTA) auch optisch (größer, auffälliger). Das volle Programm mit Blinken, Knallfarben und Marktgeschrei ist damit übrigens nicht gemeint. ;-) Aber durch eine klare Hervorhebung kann der Besucher leichter seinen Weg durch deine Website finden und bekommt auch mehr Klarheit über dein Angebot. Deine Website wird dadurch zielgerichteter.

Bewusste Design-Entscheidungen = Manipulation?

Vielleicht hast du gerade beim letzten Punkt Vorbehalte, weil du deine Besucher nicht zu sehr lenken oder gar manipulieren willst. Es geht beim bewussten Gestalten deiner Inhalte nicht darum, Nutzer manipulativ irgendwohin zu lenken (wo sie nicht hinwollen) oder sie mit deinem Angebot solange zuzuballern, bis sie nicht mehr anders können, als zu kaufen. Mit solch einseitigen Sichtweisen kann ich persönlich nichts anfangen. Auch wenn mir bewusst ist, dass gerade im Onlinebusiness / Onlinemarketing viel in diese Richtung läuft und dass es oft auch notwendig ist, um potentielle Kunden zu erreichen und deren Aufmerksamkeit für dein Angebot zu wecken.
Aber ab einem gewissen Grad nerven mich solche Methoden als Anwenderin einfach selbst viel zu sehr. Das bewusste Gestalten deiner Inhalte sollte immer dazu dienen, dass Inhalte für Website-Besucher nützlich und einfach konsumierbar sind und du mit deinen Inhalten eine klare Botschaft kommunizierst. Inhalte sollen Spaß machen und weiterhelfen. Die Gestaltung der Inhalte ist aber auch ein wesentlicher Bestandteil, dass deine Website ihre volle Wirkung entfalten kann und als Kanal für dich und dein Business ›arbeitet‹.

Warum solltest du dich mit der Gestaltung deiner Inhalte beschäftigen?

Und warum übernimmt das nicht einfach irgendein ›Tool‹ (wie Wordpress mit dem Gutenberg-Editor oder ein sog. Page-Builder) für dich? So ein Redaktionssystem bietet dir zwar einen ordentlichen Design-Rahmenaufbau und technisch komfortable Möglichkeiten – meist aber eigentlich zu viele Möglichkeiten und jede Menge Potential zur Überforderung.

Trotz des technischen Komforts musst du in einem gewissen Rahmen immer noch selbst entscheiden wie du deine Inhalte strukturierst und gestaltest. Das kann dir das Redaktionssystem nicht abnehmen. Und auch wenn es in der Werbung (z.B. für Website-Baukästen) immer so unglaublich toll und einfach aussieht, mit einem einfachen Klick lässt sich noch keine ansprechende Darstellung einfach so herbeizaubern. Die Realität ist meist ernüchternder. Darum ist meine Rolle als Designerin auch bei weitem nicht überflüssig, nur weil jeder mit Hilfe von Tools selbst zum Designer seiner Inhalte wird. Es kommt immer noch auf den Anwender, also auf dich und mich an. Es kommt auf Feingefühl und inhaltliche Auseinandersetzung an. Es ist wichtig, die Sichtweise deiner Interessenten und WunschkundInnen einzunehmen und die eigenen Fertigkeiten weiterzuentwickeln und zu trainieren.

Von welchem Startpunkt startest du beim Bearbeiten deiner Website?

Mein vielleicht wichtigster Tipp zum Schluss:
Wenn du mehr oder weniger auf dich gestellt deine Website-Inhalte pflegen und gestalten willst, bleib hartnäckig und hab Geduld mit dir. Sei nicht zu streng mit dir, wenn die Gestaltung am Anfang bescheiden aussieht und deinen Ansprüchen noch nicht genügt. Ich kenne den Zustand von mir selbst (ja, wirklich, ich bin auch niemand, bei dem sofort alles perfekt aussieht) und von meinen KundInnen natürlich auch. Das ist ganz normal und kein Beweis dafür, dass du einfach unfähig oder untalentiert bist.

Wenn du feststeckst oder überfordert bist.

Wenn du aber länger steckenbleibst oder das Gefühl hast, dass das Projekt Website dich in seiner Gesamtheit zu sehr überfordert, überleg dir, ob gezielte Unterstützung der passende Weg für dich sein könnte. Als Designerin setze ich mit dir die Design-Basis deiner Website auf. Und dadurch, dass ich deine Inhalte (mit dir zusammen) gestalte, bekommst du eine optimale Grundlage. Du hast dadurch sozusagen eine Schablone für die weitere Gestaltung und Pflege und startest nicht einfach bei null.
Und ich helfe dir beim Einstieg in die Bearbeitung (mit Wordpress als Redaktionssystem), damit du in Zukunft nicht abhängig sondern fähig bist, selbst weiterzukommen.

Schau dir direkt mein Design-Paket ›Website‹ an. Dann erfährst du gleich mehr über den Prozess der Zusammenarbeit und die Investition: