Wähle eine ansprechende Ästhetik für die Schriftarten und Farben deiner Website.

Wie die Farbe und Tapete eines Raums geben Schriftarten und Farben den Ton für deine Website an und helfen, einen guten ersten Eindruck zu hinterlassen.

Wenn du dir nicht sicher bist, wo du anfangen sollst, lass dich von den Ideen in diesem Leitfaden inspirieren, um das Design deiner Website zu erstellen. Wir empfehlen, vor der Veröffentlichung mit verschiedenen Kombinationen zu experimentieren.

Dieser Leitfaden ist ein guter nächster Schritt, nachdem du eine neue Website erstellt und einige Inhalte hinzugefügt hast. Um die Grundlagen des Änderns von Schriftarten und Farben zu lernen, besuche unsere anderen Anleitungen:

• Schriftarten ändern
• Farben ändern

Schriftarten an deine Marke anpassen

Bei der Gestaltung deiner Website ist es hilfreich, das Design deiner Website an die Ideen und Ziele deiner Inhalte anzupassen.

Verschiedene Arten von Schriftarten können unterschiedliche Stimmungen hervorrufen. In der Typografie ist eine Serife eine kleine Linie oder ein kleiner Strich, der am Ende eines größeren Strichs in einem Buchstaben oder Symbol innerhalb einer Schriftfamilie angebracht ist. Eine serifenlose Schrift hat keine zusätzlichen Striche und sauberere Linien.

Serifenlose Schriften kommen für Texte im Internet häufiger zum Einsatz, da feine Details wie Serifen auf Displays mit niedrigerer Auflösung verschwinden oder zu groß erscheinen können. Dennoch kann eine Serifenschrift für deine Website sinnvoller sein. Wenn du einen Blog über mittelalterliche Manuskripte schreibst, wird eine Serifenschrift wahrscheinlich eher dem Charakter deines Blogs gerecht. Wenn du moderne Möbel verkaufst oder einen Programmierkurs anbietest, kann eine serifenlose Schrift eine klare, zeitgemäße Stimmung erzeugen.

Wenn du eine Schriftart auswählst, stell dir einige Fragen zu deiner Zielgruppe und deinen Inhalten, um deine Auswahl zu begrenzen. Bedenke Folgendes:

• Worum geht es bei deiner Website? Was ist der Hauptzweck?
• Wer wird deine Website besuchen? Was ist ihre Altersgruppe?
• Wie ist die Stimmung deiner Marke? Lustig oder ernst? Modern oder klassisch?

Wenn du ein Gefühl für den Ton und die Struktur deiner Website gewonnen hast, durchsuche unsere Sammlung von über 600 Google Fonts und 1.000 Adobe Fonts, um eine Schriftart zu finden, die zu deinem einzigartigen Stil passt. Beachte, dass diese Sammlung nicht alle verfügbaren Google oder Adobe Fonts enthält. Das Schriftarten-Menü zeigt standardmäßig die beliebtesten und zuletzt verwendeten Schriftartenpakete an, um deine Optionen einzugrenzen. Wenn du den Namen der bevorzugten Adobe- oder Google-Schriftart kennst, kannst du gezielt danach suchen. 

Beliebige Kombinationen

Wie Wein und Käse passen einige Schriftarten perfekt zusammen. Wenn du eine einfache serifenlose Schrift verwendest, kannst du sie mit einer kunstvollen Serifenschrift kombinieren. Dünne, feine Schriftarten passen gut zu fetten Schriftarten.

Durchsuche zunächst im Menü „Schriftarten“ die voreingestellten Kombinationen im Tab Gemischt. Versuche, eine Serifenschrift und serifenlose Schrift zu finden, die gut zum Rhythmus und zur Stimmung deiner Website passen.

Eine Faustregel in der Typografie lautet: Weniger ist mehr. Es ist am besten, nicht mehr als zwei Schriftarten auf deiner Website zu haben. Zwei Optionen, die sich ergänzen, machen deine Website lesbar, wobei gleichzeitig die wichtigsten Punkte hervorgehoben werden.

Experimentiere mit verschiedenen Textgrößen, um noch mehr Kontrast zu erzeugen. Möchtest du ein neues Produkt in deinem Shop hervorheben? Versuche es mit einer Überschrift. Schreibst du einen langen Blogeintrag? Verwende eine Schriftgröße, die kleiner, aber immer noch barrierefrei ist. Weise verschiedenen Textgruppen unterschiedliche Größen zu, um die Botschaft auf deiner Website konsistent zu halten.

Charakter durch Farbe kreieren

Was ist die große Idee hinter deiner Website? Wenn du Bademode verkaufst oder deine Porträtfotografie präsentierst, kannst du durch Anpassen deiner Inhalte an ein Farbschema deiner Website Charakter verleihen. Zur Bademode könnten weiche Blau- und Gelbtöne passen, während ein klassisches Schwarzweiß deine Fotografie hervorhebt.

Was auch immer deine Vision ist: Es gibt eine passende Farbpalette, die deine Ideen zum Ausdruck bringt. Sieh dir zunächst deine Umgebung an. Wenn du ein Restaurant besitzt, lass dich von dessen Farbschema leiten. Führst du einen Blog über die Natur? Erdtöne können die richtige Stimmung zaubern. Du veranstaltest Fitnesskurse? Helle und aufregende Farben könnten die zusätzliche Motivation bringen. Wenn du ein Markenlogo hast, solltest du dessen Farbe in Akzente wie Buttons und Navigation integrieren.

Ein weiterer guter Ansatzpunkt sind deine Bilder. Sieh dir die Bilder an, die du mit deiner Marke verwendest, und überprüfe, ob bestimmte Farben oder Töne immer wieder vorkommen. Verwende das Menü „Farben“, um eine Palette zu finden, die zu deinen Bildern passt, oder lade ein Bild hoch und lass deine Website eine Farbpalette für dich erstellen.

Wie bei der Typografie können zu viele Farben die Botschaft verzerren. Wenn du dich an die Designs hältst, die automatisch von deiner Farbpalette generiert werden, ist deine Website ausgewogen und einfacher zu navigieren. Wenn du deine Designfarben anpasst, speichere die Farben außerhalb deiner Palette für kleinere Akzente wie Buttons und Social-Media-Symbole.

Stelle sicher, dass die Farben nicht im Gegensatz zueinander stehen. Eine gelbe Schrift auf weißem Hintergrund kann deinen Text unleserlich machen, während eine schwarze Schriftart auf rotem Hintergrund bei einigen Kopfschmerzen verursachen kann. Wenn du einen hohen Kontrast zwischen den Farben beibehältst, bleibt deine Website barrierefrei.

Das Wichtigste ist jedoch, dass du Spaß damit hast. Deine Website ist eine Erweiterung deiner Gedanken und deiner Identität in der Online-Welt. Squarespace hilft dir dabei, deine Ideen online zu präsentieren, aber du kannst den Charakter, die Farbe, den Ton und das Design deiner Website natürlich selbst gestalten. Eine Website, die sich so anfühlt, als ob man zu Hause im Kleiderschrank ist oder am Arbeitsplatz sitzt, besucht man gerne erneut und verbessert sie, während die Ideen weiter wachsen und sich weiterentwickeln.

Weitere Hilfestellungen

Weitere Hilfe bei der Gestaltung deiner Website findest du in unseren anderen Ressourcen:

• Sieh dir unser Video über gute Designpraktiken an.
• Lass dich von der Community im Squarespace-Forum beraten.
• Beauftrage über Squarespace Marketplace einen unabhängigen Designer damit, das Design deiner Website anzupassen.