Webdesign bezeichnet die Gestaltung einer Website, also das Zusammenspiel aus Aufbau,
Farbe, Schrift, Bildsprache und Bedienung. Es entscheidet darüber, wie schnell Besucher
sich zurechtfinden, wie glaubwürdig ein Angebot wirkt und ob aus einem Besuch eine
Anfrage entsteht. Gutes Design zeigt sich dabei weniger im ersten Eindruck als in der
Leichtigkeit, mit der Menschen ihr Ziel erreichen.
Gestaltung wirkt, bevor der erste Satz gelesen wird
Über die Glaubwürdigkeit einer Website entscheidet der erste Eindruck innerhalb weniger
Augenblicke, lange bevor jemand einen Satz gelesen hat. Diese Einschätzung entsteht aus
Farbwahl, Schriftbild, Bildqualität und der Ordnung auf der Seite. Ein Angebot mag
fachlich überzeugen, doch eine unruhige Gestaltung sät Zweifel, die der Text anschließend
erst wieder ausräumen muss.
Umgekehrt schafft eine klare Gestaltung Vertrauen, das dem Inhalt zugutekommt. Sie richtet
die Aufmerksamkeit auf das Wesentliche, verringert den Aufwand beim Lesen und macht den
nächsten Schritt selbstverständlich. Genau darin liegt der Nutzen dieser Arbeit, und
daraus ergeben sich die Bereiche, die dieser Überblick behandelt.
Aufbau und Führung
Am Anfang steht die Frage, was ein Besucher zuerst sehen soll. Der obere Bereich einer
Seite, im Fachgebrauch Above the Fold, trägt die
größte Aufmerksamkeit und gehört deshalb der wichtigsten Aussage. Sinnvoll sind dort eine
Überschrift, die den Nutzen benennt, ein aussagekräftiges Bild und ein deutlich sichtbarer
nächster Schritt.
Darunter folgt der Aufbau in einer Reihenfolge, die dem Denken der Besucher entspricht:
erst das Anliegen, dann die Lösung, anschließend der Beleg durch Beispiele oder Stimmen
von Kunden, schließlich die Aufforderung zum Handeln. Großzügige Abstände zwischen den
Abschnitten helfen dabei mehr als jede zusätzliche Linie, denn Weißraum ordnet eine Seite,
ohne sie zu beschweren.
Halten Sie diese Anordnung über alle Seiten hinweg gleich. Wiederkehrende Elemente an
derselben Stelle, etwa die Navigation, die Kontaktmöglichkeit und der Seitenfuß, ersparen
Besuchern bei jedem Seitenwechsel eine neue Orientierung. Diese Verlässlichkeit wirkt
unauffällig und trägt dennoch erheblich dazu bei, dass eine Website als durchdacht
empfunden wird.
Farbe und Schrift
Farben tragen Bedeutung und lösen Erwartungen aus. Gedeckte Blau- und Grüntöne wirken
sachlich und verlässlich, warme Töne einladend, kräftige Signalfarben aktivierend.
Bewährt hat sich eine zurückhaltende Grundfarbigkeit mit einer einzigen kräftigen
Akzentfarbe, die ausschließlich dort erscheint, wo Besucher handeln sollen. Erscheint
dieselbe Farbe überall, verliert sie ihre Signalwirkung. Wie Farbwirkung im Einzelnen
entsteht, führt Farbe im Webdesign aus.
Bei der Schrift entscheidet die Lesbarkeit vor dem Geschmack. Zwei Schriftfamilien genügen
fast immer, eine für Überschriften und eine für den Fließtext. Achten Sie auf eine
Grundgröße ab sechzehn Pixeln, auf eine Zeilenhöhe um das Anderthalbfache und auf
Zeilenlängen zwischen sechzig und achtzig Zeichen. Welchen Anteil die Schrift an der
Wirkung einer Website trägt, beschreibt
Typografie im Detail.
Ebenso zählt die Bildsprache. Eigene Aufnahmen aus dem Betrieb wirken glaubwürdiger als
gekaufte Motive, die auf zahlreichen anderen Websites ebenso erscheinen. Sind eigene Bilder
schwer zu beschaffen, hilft eine einheitliche Bearbeitung aller Motive, etwa in Farbton und
Ausschnitt, damit die Auswahl als bewusste Entscheidung erkennbar wird.
Bedienbarkeit und Barrierefreiheit
Gestaltung erfüllt ihren Zweck erst, wenn sie sich mühelos bedienen lässt. Unter
Usability versteht man genau diese Eigenschaft, also die
Leichtigkeit, mit der Menschen ihr Ziel erreichen. Erkennbar wird sie an vertrauten
Mustern: ein Logo oben links, das zur Startseite führt, eine Navigation mit sprechenden
Bezeichnungen, Verweise, die sich als solche zu erkennen geben, und Formulare, die
Fehleingaben freundlich erklären.
Eng damit verbunden ist die Barrierefreiheit. Ein
ausreichender Kontrast zwischen Schrift und Hintergrund, Bedienelemente von mindestens
vierundvierzig Pixeln Kantenlänge, eine vollständige Bedienung über die Tastatur und
beschreibende Alternativtexte für Bilder helfen Menschen mit Einschränkungen und
verbessern zugleich die Nutzung für alle übrigen. Seit dem Barrierefreiheitsstärkungsgesetz
gelten diese Anforderungen für viele Angebote im Geschäftsverkehr mit Verbrauchern zudem
verbindlich; für die Bewertung des eigenen Falls empfiehlt sich eine rechtliche Beratung.
Formulare verdienen dabei besondere Sorgfalt, weil sie am Ende des Weges stehen. Jedes
zusätzliche Feld kostet Abschlüsse, weshalb die Frage angebracht ist, welche Angaben Sie
tatsächlich für den ersten Kontakt benötigen. Name, Nachricht und eine Möglichkeit zur
Rückmeldung genügen meist, alles Weitere klärt sich im Gespräch.
Gestaltung für kleine Bildschirme
Die Mehrheit der Besuche erfolgt auf dem Telefon, weshalb der Entwurf sinnvollerweise dort
beginnt. Was auf einem schmalen Bildschirm überzeugt, lässt sich anschließend für größere
Fenster erweitern, während der umgekehrte Weg meist im Weglassen endet.
Praktisch bedeutet das eine einspaltige Anordnung, Bedienelemente in Reichweite des
Daumens, Menüs, die sich einhändig öffnen lassen, und Bilder, die auch im kleinen
Format ihre Aussage behalten. Ebenso zählt die Ladezeit, denn Gestaltung, die erst nach
Sekunden erscheint, erreicht viele Besucher überhaupt nicht mehr, wie der Beitrag zur
Ladezeit im Glossar zusammenfasst.
Prüfen lässt sich das ohne Aufwand, indem Sie Ihre Website am Telefon bei Tageslicht
öffnen und versuchen, mit einer Hand eine Anfrage zu stellen. Was dabei stockt, stockt
auch bei Ihren Kunden. Ergänzend zeigt der Bericht zur Nutzererfahrung in der Search
Console, wie die Seiten auf echten Geräten abschneiden.
Von der Gestaltung zur Anfrage
Am Ende bemisst sich Gestaltung daran, ob Besucher den nächsten Schritt gehen. Ein
Call-to-Action gehört deshalb an jede Stelle, an
der ein Anliegen geweckt wurde, formuliert als konkrete Handlung statt als allgemeine
Einladung. „Termin vereinbaren" führt zuverlässiger als „Mehr erfahren", weil es benennt,
was als Nächstes geschieht.
Aussagekräftig ist außerdem die Platzierung. Ein einzelner Aufruf am Seitenende erreicht
nur jene, die vollständig gelesen haben. Sinnvoller ist es, den nächsten Schritt an jeder
natürlichen Zäsur anzubieten, also nach der Beschreibung der Leistung, nach den Beispielen
und am Ende.
Prüfen lässt sich die Wirkung mit einfachen Mitteln. Bitten Sie drei Personen aus Ihrer
Zielgruppe, auf Ihrer Website eine bestimmte Aufgabe zu erledigen, und beobachten Sie
dabei schweigend. Diese kurze Beobachtung deckt mehr auf als lange Diskussionen im Team.
Für die professionelle Umsetzung steht Ihnen unsere Schwestermarke
Early Webdesign
zur Seite, die Gestaltung, Technik und Inhalte gemeinsam umsetzt. Die Beiträge
weiter oben auf dieser Seite vertiefen die einzelnen Themen.
