Der Begriff Webdesign bzw. Webgestaltung bezieht sich als eine Disziplin des Mediendesigns auf die visuelle und strukturelle Gestaltung von Webseiten für das World Wide Web. Die technische Implementierung von Webpräsenzen wird dagegen mit dem Begriff Webentwicklung bezeichnet.
Inhalt
Historische Entwicklung
Nach einigen anfänglichen Schwierigkeiten veröffentlichte Microsoft 1996 seinen ersten Webbrowser für die breite Öffentlichkeit, der mit eigenen Eigenschaften und Elementen versehen war. So war der Internet Explorer der erste Internetbrowser, der volle Unterstützung für Formatvorlagen (HTML-Programmierung) mit sich brachte, die zu dieser Zeit eine exotische Funktionalität darstellten. Man begriff binnen kurzer Zeit das Potenzial der HTML-Programmierung, die es ermöglichte, komplexe Layouts zu erzeugen, die sonst nicht realisiert werden konnten.
Zu dieser Zeit hatten schönes Design und gute Ästhetik im Webdesign Vorrang, weswegen keine Aufmerksamkeit auf eine gute User Experience und Webzugänglichkeit gelegt wurde. HTML-Webseiten waren jedoch durch die Grenzen des HTML-Standards in ihren Designoptionen ziemlich beschränkt. Um komplizierte und ansprechende Designs zu entwickeln, mussten Webdesigner komplizierte Tabellenstrukturen einsetzen, die für diese Einsatzszenarien überhaupt nicht vorgesehen waren. Um dieses Problem zu lösen und um Webdesignern ein performantes Tool für die optische Gestaltung von Webseiten zur Verfügung zu stellen, wurde im Dezember 1996 von der W3C CSS (Cascading Style Sheets) eingeführt. Lesen Sie hier alles zu CSS.
CSS ermöglichte, das volle Potenzial des World Wide Web für die Webgestaltung zu nutzen, ebenso wurden noch im selben Jahr ebenso allgemeine Protokolle eingeführt, die eine Standardisierung des World Wide Web vorantrieben. Durch diese Entwicklung wurden jedoch weiter Unternehmen davon abgehalten, neue Webbrowser und Websprachen zu entwickeln, was das WWW eventuell als Ganzes verändern hätte können.
Was ist Webdesign?
Webdesign ist das, was das ganzheitliche Design erzeugt, wenn Sie eine Webseite benutzen. Im weiten Sinne handelt es sich dabei um den Prozess der Planung und des Aufbaus aller Elemente einer Webseite, von dem Layout (Struktur) bis hin zu Schriftarten, Farbkombinationen, Bildern, Videos und Grafiken. Webdesign setzt sich aus unterschiedlichen Komponenten zusammen, die als eine Einheit fungieren, um das fertige Erlebnis einer Webpräsenz zu erzeugen, hierzu gehören:
- Grafikdesign
- User Experience Design
- Interface Design
- Content Erstellung
- Suchmaschinenoptimierung (SEO)
Diese einzelnen Elemente bestimmen, wie eine Webpräsenz auf verschiedenen Geräten aussieht und sich anfühlt.
Die Webgestaltung unterscheidet sich von der Webentwicklung, die das eigentliche Programmieren darstellt und festlegt, wie eine Website funktioniert. Wenn Sie eine Webseite erstellen möchten, dann benötigen Sie in der Regel sowohl Webdesigner als auch Webentwickler, denn diese beiden Gebiete haben dennoch viele Gemeinsamkeiten, sodass es auch Webdesigner gibt, die sowohl Designer als auch Entwickler sind und somit verschiedene Fertigkeiten beherrschen.
Webdesign-Elemente im Überblick
Die Gestaltung und der Nutzen von Webseiten werden an entsprechende Zielgruppen ausgerichtet. Im Mittelpunkt aller Aktivitäten steht das Ziel, das der Kunde mit seinem Online-Angebot erreichen möchte. Je nach Zielgruppe, benötigter Usability und gewünschtem Effekt entsteht so ein individuelles Design, das die Geschäftsprozesse des Kunden unterstützt. Die wichtigsten Elemente bei der Erstellung des passenden Webdesigns sind:
- Konzeption
- Gestaltung
- Technik
- Inhalte
Diese Elemente muss man nicht unbedingt in dieser Reihenfolge realisieren. Es kommt immer wieder vor, dass die Bearbeitung vieler Aspekte parallel oder auch asynchron läuft.
- Konzeption
Im Rahmen der Konzeptionsphase muss man den Zweck einer Webpräsenz genau definieren, des Weiteren wird die Zielgruppe festgelegt und das weitere Vorgehen definiert. In diesem Zusammenhang wird auch ein Zeitplan erstellt, in dem die Meilensteine festgehalten werden. - Gestaltung
Die Gestaltung bezieht sich nicht nur auf das visuelle Design der Webpräsenz, sondern auch auf Funktionalität und Effekte. Eine besonders bedeutende Rolle kommt der Usability (Benutzerfreundlichkeit) zu. Sowohl in der visuellen als auch in der technischen Gestaltung des Webauftritts muss darauf geachtet werden, dass sich die Benutzer wohlfühlen und alle Informationen und Funktionalitäten schnell und unkompliziert erreichen. - Technik
Im Rahmen der technischen Gestaltung definieren sich sämtliche Funktionalitäten, welche die Webseite bieten soll. Zum Grundgerüst der Webpräsenz gehört auch der HTML-, CSS- und JavaScript-Code. Die Struktur und das Layout der Webseite werden in diesem Schritt so umgesetzt, dass diese Version bereits nahe am Endergebnis ist, oftmals fehlen jedoch noch textuelle und visuelle Inhalte, wie beispielsweise Texte und Inhaltsgrafiken. - Inhalte
Inhalte der Webseite sollten verständlich sein und dem Besucher einen Mehrwert bieten, zudem können die Texte können auch ruhig umfassend sein. Textuelle Inhalte lassen sich mit Videos und Bildern hervorragend hervorheben und benutzerfreundlich gestalten. Nichtssagende Texte, die mit Füllwörtern angehäuft sind, sollte unbedingt vermieden werden.
Webdesign-Tipps für die perfekte Homepage
- Aufräumen
Einer der häufigsten Anfängerfehler im Webdesign ist ein unordentlicher Bildschirm. Viele Webdesigner haben eine Liste mit all den Funktionen und Features, die sie in ihre Webseite einbauen möchten. Weil sie es oft nicht besser wissen, werfen sie all diese Dinge auf dieselbe Seite. Dies führt jedoch in 99 Prozent der Fälle zu einem schlechten Nutzererlebnis und einer minderwertigen Benutzerfreundlichkeit der Website, weil alles unübersichtlich und kontraintuitiv erscheint, daher sollten Sie Ihre Designs auf die essenziellen Dinge prüfen. Falls ein Element oder Feature nichts Positives zum Gesamterlebnis führt, entfernen Sie es. - Ausreichend Weißräume nutzen
Der Begriff Weißraum (auch Negativraum) wird in der bildenden Kunst als Fachbegriff für Bereiche verwendet, die keine Aufmerksamkeit erregen sollen. Auch im Webdesign lässt sich der Negativraum äußerst effektiv einsetzen. So sollten Sie beispielsweise Ihre wichtigsten Elemente mit Weißraum einschließen, denn je mehr Negativraum sich um ein Element befindet, desto mehr Aufmerksamkeit erhält es.
- Leiten Sie den Blick Ihres Besuchers durch visuelle Hierarchie
Der Begriff „visuelle Hierarchie“ bezieht sich auf die verschiedenen visuellen Elemente wie Größe oder Platzierung. Sie lassen sich verwenden, um die Aufmerksamkeit des Besuchers gezielt zu lenken. Ein großer Titel oben auf einer Seite und winzige Warnhinweise am Ende sind ein treffliches Beispiel dafür, um visuelle Hierarchie optimal zu nutzen, um bestimmte Seiten-Elemente vor anderen vorzuziehen. - Wählen Sie gezielt FarbenErzeugen Sie ein Ihrem Webdesign eine harmonische und klar strukturierte Farbhierarchie. Nutzen Sie jeweils verschiedene Farben für Ihre primären Elemente, sekundären Elemente und die Highlights. Des Weiteren sollten Sie bei einheitlichen Motiven bleiben. Sobald Sie sich für eine Farbpalette entschieden haben, nutzen Sie sie kontinuierlich.
- Fotos und Bilder sind erwünscht
Nutzen Sie echte Menschen, denn Erfahrungen haben gezeigt, dass Bilder von Menschen dazu neigen, Besucher mehr einzubeziehen, insbesondere Bilder Ihrer Mitarbeiter oder Ihrer Kunden.