Was ist eigentlich gutes Design? Ich bin sicher, du fühlst immer sofort, ob eine Website „passt“, ob das Design stimmig ist. Aber es benennen zu können, ist noch mal ganz etwas anderes.
Dabei musst du kein Designprofi sein, um deine Website so zu designen, dass sie Besucher anzieht. Du musst dafür lediglich ein paar Regeln beherzigen.
Die helfen dir, auch wenn du nicht so recht Ahnung hast wie du anfangen sollst deine Homepage zu designen.
(Web)Design-Grundlagen
Noch bevor du über das Design nachdenkst, muss du dir über diese drei grundlegenden Punkte klar sein:
Begeistere deine Lieblingskunden
Deine Lieblingskunden sollen sofort das Gefühl haben, dass sie bei dir auf der Website zu Hause sind.
Deshalb musst du wissen, wer deine Lieblingskunden sind. Welche Werte ihnen wichtig sind.
- Sind sie eher traditionsbewusst?
- Oder mögen sie es minimalistisch?
- Schätzen sie ein verspieltes Design?
Meine Beispiele sollen dich inspirieren. Befasse dich intensiv mit den Werten, die deine Lieblingskunden haben.
Schreibe aber auch deine Werte auf. Du wirst sehen, es gibt (meistens) viele Übereinstimmungen.
Jetzt hast du die grobe Richtung für dein Design.
Fessle die Aufmerksamkeit deiner Website-Besucher
Eine Website hat nur wenige Sekunden, um die Besucher zu überzeugen. Und das oft unter erschwerten Bedingungen. Denn häufig wird deine Website nicht zu Hause geöffnet, sondern unterwegs.
Dann ist da nur ein kleiner Handybildschirm. Die Besucher sind ausserdem nicht voll konzentriert, da sie von allem drumherum abgelenkt sind.
Deshalb musst du die Aufmerksamkeit sofort fesseln. Das gelingt am besten mit einem Blickfang, einem Eyecatcher.
Meistens ist das ein Bild. Etwa ein Bild von dir oben auf der Seite.
Wichtig ist, dass das Bild zu den Erwartungen passt, die der Besucher hat. Dass der Inhalt, der Website mit ihm harmoniert.
Nehmen wir an du bist Ernährungsberaterin. Dann wäre ein Foto von dir mit gesunden Lebensmitteln perfekt. Zum Beispiel in der Küche.
Oder du bist Ernährungsberaterin für Hunde. Dann passt das natürlich nicht. Dann wäre ein Bild perfekt, auf dem du zu sehen bist mit einem Napf in der Hand und einem Hund, der dich erwartungsvoll anschaut.
Du siehst, worauf ich hinauswill. Der Gesamteindruck ist entscheidend. Das Bild muss sofort den Blick fesseln und zu dir und deinem Thema passen.
Dazu passt auch der nächste Punkt:
Die wichtigste Information muss herausstechen
Sobald du die Aufmerksamkeit des Besuchers gefesselt hast, ist er bereit zu lesen. Deine wichtigste Botschaft muss deshalb klar als solche zu erkennen sein.
Du kennst sicher die Redewendung: „Den Wald vor lauter Bäumen nicht sehen“. Das passt hier perfekt.
Denn häufig geht es Websitebesuchern genau so. Es gibt keine Botschaft, die hervorsticht, sondern nur viele Texte. Die wichtigste Information MUSS auch als solche zu erkennen sein. Sonst geht sie unter.
Du musst dir also darüber klar sein, was die Besucher deiner Website UNBEDINGT wissen müssen.
Diesen Text hebst du hervor.
Danach gehst du die weiteren Texte durch und priorisierst sie. Je nachdem wie wichtig sie sind, werden sie in der Gestaltung dann stärker hervorgehoben oder nicht.
Weglassen ist eine Kunst
Ich weiss, das ist ein schwieriges Thema, denn du empfindest alles als wichtig, was auf deiner Homepage steht.
Du überforderst damit aber deine Besucher und bringst sie dazu wieder wegzuklicken. Es ist eine deiner wichtigsten Aufgaben zu entscheiden, was du weglassen kannst.
Die wichtigsten Gestaltungselemente im Webdesign
Du hast dir die Grundlagen erarbeitet und weisst genau was du für wen auf deiner Website aufführen willst. Nun zeige ich dir die grundlegenden Gestaltungselemente.
Weissraum – Lass denn Elementen genügend Freiraum
Stell dir vor, du kommst in eine Halle, in der eine Gruppe Menschen zusammensteht. Daneben, mit einigem Abstand, steht eine einzelne Person.
Du wirst deine Aufmerksamkeit als Erstes auf diese Person lenken. Denn durch den Abstand wird Spannung erzeugt.
Genau das Gleiche passiert beim Design. Du kannst ein bestimmtes Element so hervorheben und ihm eine Bedeutung geben.
Weissraum ist aber auch nötig, um die ganze Website übersichtlich zu gestalten. Wenn Bilder und Texte eng zusammengedrängt werden, wird es schnell unübersichtlich.
Ausserdem lädt eine solche Website nicht zum Lesen ein.
Mit Blöcken arbeiten
Du hast Informationen, die zusammengehören und die auch so wahrgenommen werden sollen? Dann pack sie in einen Block. So nimmt das Auge sie als Einheit wahr.
Das hilft deine Inhalte klar zu strukturieren und du kannst den Blick des Betrachters führen.
Gestaltungsraster – Elemente wirkungsvoll auf der Website anordnen
Nicht nur der Weissraum ist entscheidend, sondern auch wie du die einzelnen Elemente auf deiner Website anordnest.
Eine der wichtigsten Regeln hier ist der Goldene Schnitt.
Es gibt viele Berechnungsmethoden für den Goldenen Schnitt. Du kannst es dir aber auch einfach machen und dein Design in 1/3 zu 2/3 aufteilen. Das ist nicht perfekt, aber auf jeden Fall ausreichend.
Der Goldene Schnitt wird nicht nur im Design verwendet, auch in der Natur wirst du ihn überall entdecken. Das ist sicher auch der Grund, weshalb wir dieses Teilungsverhältnis als besonders harmonisch betrachten.
Hier wird der Goldene Schnitt beachtet.
Hier ist die Karte in zwei Hälften geteilt.
Blickführung
Wir lesen von rechts nach links und von oben nach unten. Allerdings meist nicht systematisch, sondern mehr in Form eines „Z“.
Mit Bildern lässt sich der Blick hervorragend führen.
Das siehst du gut am Bild unten. Das Auge folgt dem Weg nach rechts.
Bei Porträts folgt unser Blick automatisch dem Blick der abgebildeten Person. Ein wichtiger Text sollte also in Blickrichtung eingefügt werden. Mehr dazu erfährst du hier: Eyecatcher-Fotos – Einsatz und Tipps für die Website.
Farben und Schriften richtig nutzen
Ganz am Anfang dieses Artikels hast du dir Gedanken zu deinen Werten und denen deiner Lieblingskunden gemacht. Nimm diese Notizen zur Hand, wenn es darum geht die Farben und Schriften auszuwählen.
Die Farben
Farben beeinflussen unsere Emotionen, gleichzeitig sind sie mit einer Bedeutung belegt. Nicht umsonst sind die meisten Websites von Versicherungen in Blau gehalten.
Blau steht unter anderem für Vertrauen.
Such dir zwei bis maximal drei Farben aus, die den Werten entsprechen, die du dir notiert hast.
Auch hier gilt: Weniger ist mehr.
Die Schriften
Es gibt mittlerweile unglaublich viele kostenlose Schriften. Wenn du dir die bei Google ansiehst, wirst du sehen welche unterschiedlichen Gefühle sie auslösen können.
Deshalb ist es wichtig, dass du auch die Schrift(en) nach den Werten aussuchst.
Du möchtest mehr über Schriften wissen? Dann klicke hier.
Lass dich im Netz inspirieren
Du kennst nun die wichtigsten Grundlagen für gutes Design. Nimm dir eine halbe Stunde und surfe durchs Netz. Schau dir die Websites mit deinem neuen Wissen an.
Was lösen sie bei dir aus? Was spricht dich an und warum? Was stört dich?
Mach das regelmässig und merke dir die Websites, die du besonders gelungen findest.
So wirst du mit der Zeit ein Auge dafür entwickeln und alles viel einfacher bei deiner eigenen Website umsetzen können.