Gutes Webdesign – Was ist das?

Schreibe einen Kommentar
Allgemein / Gestaltung / Inhalt und Design / Konzeption / Screendesign / Webdesign
gutes webdesign bilder

„Design is not just what it looks like and feels like. Design is how it works.“ Steve Jobs*

Ob eine Website gut gemacht ist, bewerten die Nutzer/innen, nicht die Betreiber! Dabei geht es nicht nur um das „Look and Feel“ der Seiten. Gutes Webdesign richtet sich nach den Bedürfnissen der Nutzer. Suchen sie Informationen, Unterhaltung, Interaktion oder Transaktion mit dem Betreiber (z.B. einem Unternehmen)? Jede einzelne Seite und Unterseite der Website sollte daher einen sinnvollen Zweck erfüllen. Alle ihre Inhalte sollten einem entsprechenden Bedarf nachkommen.

Gesuchte Informationen möchte ein Besucher möglichst rasch finden. Daher ist es wichtig, klar und prägnant zu kommunizieren. Texte sind im Idealfall einfach zu lesen und zu verarbeiten.

Das braucht ausreichende Schriftgrößen und gut lesbare Schriften, die gestalterisch die Thematik des Textes unterstützen. Genügend große Zeilenabstände sind für die gute Lesbarkeit ebenso wichtig, wie eine Textfarbe, die ausreichend Kontrast zum Hintergrund bietet. Es macht Sinn, Informationen mit Überschriften in Kategorien zu gliedern und Aufzählungslisten verwenden, statt langer, komplexer Sätze.

Eine durchdachtes Farbkonzept kann die Nutzererfahrung wesentlich verbessern. Komplementärfarben erzeugen Spannung, Balance und trotzdem Harmonie. Kontrastfarben für Schrift und Hintergrund machen den Text angenehmer zu lesen. Allerdings sollten gesättigte Bunttöne nur sparsam und bedacht verwendet werden, also zum Beispiel bei Buttons oder bei Interaktion. Außerdem können Weißraum (Leerraum) und dezente Farbfllächen der Seite ein modernes, schlichtes Aussehen verleihen.

Sinnvolle, passende Bilder helfen, die Marke zu positionieren und die Nutzergruppe auch emotional zu erreichen. Diagramme, Videos und Grafiken können manchmal effektiver kommunizieren als der bestausformulierte Text.

Wer zum ersten Mal auf eine Webseite kommt, will sich schnell orientieren. Das Webdesign muss ihm signalisieren, was ihn hier erwartet. Headlines, Navigationen, Logos, Teaser sollten ihm einen schnellen Überblick gewährleisten. Ein übersichtlicher, nicht überladender Seitenaufbau hilft dabei. Es ermöglicht ein schnelles Scannen der Inhalte. Dazu sollten die Inhalte einer Struktur folgen.

Die Navigation, deren Struktur und die Benennung der Navigationspunkte schaffen eine hohe Usability (Benutzerfreundlichkeit). Die technische Umsetzung, die eine schnelle und einfache Bedienung der Webseite auf jedem Gerät sichert, ist gleichermaßen wichtig. Die Besucher sollen möglichst wenige Klicks benötigen, um an das gewünschte Ziel zu kommen. Einige Möglichkeiten im Webdesign für eine effektive Navigation sind:

  • Breadcrumbs („Brotkrümel“: Zeigen den aktuellen Pfad in der Webseite an)
  • eine logische (auch visuelle) Hierachie bzw. Kategorisierung
  • klickbare Buttons
  • die „3-Klick-Regel“ einhalten, d.h. User können mit 3 Klicks auf alle Webseitenbereiche gelangen

Wenn Elemente zufällig auf einer Seite platziert werden, kann schnell die Übersicht verloren gehen. Grid-basierte Layouts ordnen die Inhalte in Abschnitte, Spalten und Boxen, die an Kanten und Achsen ausgerichtet sind und ordentlich wirken.

Eye-Tracking Studien haben ergeben, dass Leute am PC-Bildschirm in einem „F“-Schema lesen. Das Erste, was betrachtet wird, ist die obere linke Ecke des Bildschirms. Die rechte Seite wird seltener bzw. zuletzt betrachtet. Statt dem User ein ungewöhnliche Anordnung der Elemente aufzuzwingen, kommt eine effektiv gestaltete Webseite dem Nutzer entgegen. Sie richtet sich nach dem natürlichen Lesefluss. Informationen werden nach Wichtigkeit sortiert, also von oben nach unten und von links nach rechts).

Webseiten werden nicht nur auf dem Desktop-PC betrachtet. Verschiedene Endgeräte mit unterschiedlichen Bildschirmgrößen, wie z.B. Tablets und Mobiltelefone erfordern eine „mobile friendly“- Optimierung auf Mobilgeräte. Grundsätzlich gibt es hier zwei Möglichkeiten:  Erstellen einer speziellen mobilen Ansicht,  oder  eine Full Responsive Lösung (bei der sich das Design an das jeweilige Gerät automatisch anpasst).

Niemand mag Webseiten, die ewig zum Laden brauchen oder gar erst ein Ladesymbol aufzeigen. Zu beachten sind Bildoptimierung (Größe und Skalierung), Kombinieren und Verkleinern von HTMLCSS und Javascript und das Verwenden von Cache. Skripte sollten nur geladen werden, wenn ihre Funktion auch wirklich gebraucht wird. Alles andere verschwendet nur die kostbare Zeit der Besucher.

Webseiten, die nicht in ein zeitgemäßes Webdesign passen, tendieren dazu, bei Google Analytics schlechte Ergebnisse zu erzielen. Damit sind hohe Absprungraten, geringe „time-on-site“ und wenige Seitenaufrufe pro Besucher gemeint. Also, was macht gutes Webdesign aus? Einer ästhetische, leicht zu benutzende, für ihre Nutzer effektive und attraktive Webpräsenz erfüllt eine Reihe wichtiger Kriterien.

Aufgaben:
1) Fassen Sie in eigenen Worten den Inhalt der Textabschnitte zusammen und erstellen Sie eine Merkliste „Die 7 wichtigsten Kriterien für eine gelungene Website“!
2) Untersuchen Sie eine Seite, die Sie von mehreren Besuchen her bereits kennen, im Blick auf die notierten Kriterien!


Quellen:

*https://de.slideshare.net/stevepyoung/13-steve-jobs-quotes

frei zitiert nach: https://sketch.media/blog/web/205-10-prinzipien-fuer-effektives-webdesign.html
https://www.webdesign-journal.de/die-7-prinzipien-effektiven-webdesigns/

 

Kommentar verfassen