227 % mehr Umsatz durch Mobile Marketing*

Webdesign

Aus Marketing United
Wechseln zu:Navigation, Suche

Ein ansprechendes Design deiner Website erhöht die Chancen auf Verkäufe und viele Besucher auf deiner Seite.

1 Webdesign-Tipps

  • Der erste Eindruck deiner Website ist sehr wichtig. Bei einem schlechten Design, fehlender Übersichtlichkeit oder schlechten Inhalten ist der Besucher wieder schnell von deiner Website verschwunden.
    Wenn du ein Infoprodukt anbietest, muss der Besucher schnell erkennen können, dass hier definitiv eine Lösung für sein Problem angeboten wird. Auf deiner Website muss (schnell) ersichtlich sein, dass du ein Experte in deiner Nische bist.
  • Hat man am Design seiner Website etwas Grundlegendes geändert, so sollte man mit Hilfe eines Tracking-Tools überprüfen, ob man dadurch die Besucher länger auf seiner Website halten kann. Dazu notiert man sich das Datum der Design-Änderung und vergleicht die Tracking-Statistiken vor und nach diesem Datum.

2 Webdesign-Grundregeln

Im Folgenden ein paar Grundregeln des Webdesign:

  • Unterstreichungen sollten nie für optische Verschönerungen deiner Texte verwendet werden, da die Nutzer unterstrichene Wörter im Web für Links halten. Setze das <u>-Tag also bedacht ein.
  • Schriftgrößen sollten immer in relativen Größen (em oder Prozent) definiert werden. Siehe auch hier. Wähle die Schriftart so, dass sie im Endeffekt mindestens 14px groß ist.
  • Verwenden einen Schriftsatz (font-family), der gut lesbar ist - zum Beispiel Verdana, Tahoma, Helvetica, Arial oder Georgia.
  • Kursive Texte können auf manchen PCs schlecht aussehen und bei kleinen Schriften schwer zu lesen sein. Deshalb sollte man Kursivtext nicht zu häufig einsetzen.
  • Die Lesbarkeit von Texten hängt stark davon ab, wie viele Wörter sich in einer Zeile befinden. Für eine optimale Lesbarkeit solltest du deine Texte so gestalten, dass sie um die 12 Wörter pro Zeile haben. Wenn du mehr Worte pro Zeile hast, kann es hilfreich sein den Zeilenabstand zu vergrößern (CSS-Attribut "line-height").
  • Schwarze Schrift auf weißem Hintergrund ist der Standard und kommt im Gegensatz zu weißer Schrift auf schwarzem Hintergrund gut an. Es kann ratsam sein einen statt einem knall-weißen Hintergrund (#fff) einen ganz leicht gräulichen Hintergrund zu verwenden. Der helle Hintergrund strengt die Augen nämlich mit der Zeit an. Sanfte Hintergrundfarben können das Look& Feel deiner Website verbessern. Gute Hintergrundfarben für schwarzen Text sind beispielsweise #F8F8F8 oder #e8eae8.
  • Füge Bilder zu deinen Websites hinzu. Es ist statistisch nachgewiesen, dass Websites mit Bildern mehr Umsatz erzeugen als Websites die auf Bilder verzichten.
  • Nutze als Kontaktmöglichkeit nicht ausschließlich einen mailto-Link, sondern lieber ein Kontaktformular - zur mailto-Problematik siehe dieser Artikel.

3 Flat Design

Flat Design bedeutet, dass man seine Website auf das Wesentliche reduziert. Dies trifft zu für

  • die Grafik: flache 2D-Optik, keine Schatten -> Geschwindigkeitsvorteile beim Laden der Seite
  • die Benutzerführung: Konzentration auf das Wesentliche - der Besucher findet schnell das was er sucht

4 Navigation

Die Navigation ist der „rote Faden“ beim Weg durch deine Website. Sie muss den Nutzer schnellstmöglich an sein Ziel bringen. Eine gute Navigation ist einfach und verständlich.

Das Hauptmenü deiner Navigation sollte das Thema deiner Website wiederspiegeln. Es sollte nicht mehr als sieben Hauptpunkte geben. Eine schlechte Navigation wäre zum Beispiel „Home, Leistungen, Philosophie, Wir über uns, Kontakt“, da sie zu allgemein ist. Die gewählten Begriffe bilden die Wegweiser zu den detaillierten Informationen auf deiner Webseite und sollten daher auch auf den Inhalt abgestimmt sein.

Weitere Tipps zur Navigation:

  • Spreche den Website-Besucher direkt an. Wenn du Coaching anbietest könnte ein Menüpunkt zum Beispiel "Deine Ziele" lauten.
  • Die Hauptnavigation sollte sich horizontal im oberen Viertel der Website befinden.
  • Eine weitere Navigation kann in einer Seitenleiste untergebracht werden.

5 Weblinks

5.1 Webdesign-Tools

5.2 Artikel

5.3 Interessante Infografiken rund ums Webdesign

6 Weiterführendes

6.1 Tools

6.2 Dienstleistungen

  • 99designs - Logo-Design und Webdesign von über 250.000 Designern Bleistift.png
  • crowdSPRING - The world's #1 marketplace for logos, graphic design and naming Englisch Bleistift.png

6.3 Artikel

6.4 Infografiken

6.5 Weblinks

  • designprinciplesftw.com - Collection of design principles from designers and websites Englisch Bleistift.png
  • fltdsgn.com - Showcase of some of the best examples of web design using the flat UI style/aesthetic Englisch Bleistift.png


Erzähl's weiter:

Wir freuen uns über deinen Kommentar: