Webdesign

Aus Marketing United
(Weitergeleitet von Design)
Wechseln zu:Navigation, Suche

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

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.

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.
  • Definiere Schriftgrößen immer in relativen Größen (em oder Prozent). Wähle die Schriftart so, dass sie im Endeffekt mindestens 14 Pixel groß ist.
  • Verwende einen Schriftsatz (font-family), der gut lesbar ist - zum Beispiel Verdana, Tahoma, Helvetica, Arial oder Georgia.
  • Wenn du eine eigene Schriftart lädst, beachte am besten diese Tipps. Dort liest du auch, welche Schriftart-Dateitypen welcher Browser unterstützt (.svg, .eot, .ttf, .woff, .woff2).
  • 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.

Mobile Design

  • "Mobile first" bedeutet, dass man sein Web-Angebot vorrangig auf mobile Geräte designt.
  • Die kleinste Bildschirmbreite, für die du deine Website designen musst, sind 320 Pixel (Stand September 2020).[1]

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

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.

Above the fold

Der "Above the fold"-Bereich ist der Teil deiner Website, der ohne Scrollen sichtbar ist. Beim Online-Marketing ist es wichtig, dass man in diesem Bereich die wichtigsten Elemente einfügt, zum Beispiel das Optin-Formular oder auch eine Benefit bar.

Stand 2023 ist die Höhe des Above the fold-Bereichs circa 650 Pixel hoch.[2]

Weblinks

  • 12designer.com - Logo, Webdesign, Banner im Design-Wettbewerb erstellen lassen
  • designenlassen.de* - Individuelles Design von über 9000 Designern. Nutze diesen Gutscheincode um 10 % Rabatt zu erhalten: dl20marketing23af

Weiterführendes


Tools

                   

  1. Erfahrung von Stefan Seidner-Britting, Gründer von Marketing United
  2. KlickTipp präsentiert neue Splittest-Ergebnisse, abgerufen am 16.3.2023