Webseitengestaltung (Webdesign)

Weltkugel

INHALT

  1. Definition und Begriff
  2. Aufgaben des Webdesigners
  3. Benutzerfreundlichkeit von Webseiten
  4. Bedeutung von Suchmaschinen
  5. Anforderungen an das Design von Websites
  6. Checkliste zum Erstellen einer Webseite
  7. Komplett-Internetlösungen

Definition und Begriff

Webdesign: Was ist das ? Was bedeutet das ? Der Begriff » Webseitengestaltung « (englisch: Webdesign) beinhaltet alle Aufgaben (Konzept, Funktionalität, Struktur, Programmierung, Gestaltung) zum Erstellen einer Webseite mittels Layout und Benutzerführung (Navigation).

Layout

Bei der Gestaltung einer Webseite mit Hilfe des Layouts können die folgenden Grundlagen und Kriterien festgelegt werden:

  • Schriftarten, Schriftgrößen, Schriftfarben für Fließtexte, Überschriften und beschriftete Grafiken

  • Hintergrundfarben

  • Seitengröße mit Seitenbreite und Seitenhöhe

  • Bildgrößen und Videogrößen

  • Mengen-Verhältnis von Texten und Bildern

  • Leerräume bzw. freier Raum innerhalb der festgelegten Seitengröße (Weißraum-Abdeckung)

  • Einsatz von Bannern, Grafiken, Header, Logos und Themes ( z.B. Layout-Vorlagen für WordPress)

  • Benutzerführung mittels Verlinkungen (Navigation, Textbestandteile, Bilder), vgl. nachfolgend

Das Erstellen des Layouts ist das Element in der Webseitengestaltung / im Webdesign, die den Besuchern als allererstes auffällt und ihren ersten Eindruck prägt.

Benutzerführung (Navigation)

Die Benutzerführung (Navigation) von einer Unterseite zur nächsten Unterseite, also die Verknüpfung einzelner Unterseiten miteinander, kann zum Beispiel auf folgende Arten gestaltet werden:

a) Feste Navigation für Hauptseiten und Unterseiten mittels Unternavigationen (fest, aufklappbar)

b) Text-Links innerhalb des Fließtextes zu anderen Unterseiten wie zum Beispiel bei Wikipedia

c) Grafikdesign-Links innerhalb des Fließtext-Bereiches

Möglich sind auch Kombinationen aus den Varianten a) bis c), um die Benutzerführung (Navigation) beim Webdesign zu gestalten.

Aufgaben des Webdesigners

Bei der Konzeption, Programmierung und Gestaltung von Layout und Benutzerführung zählt es zu den Aufgaben des Webdesigners, die Kommunikationsziele, Botschaften und Identität eines Unternehmens (vgl. » Corporate Design) im Internet abzubilden.

Wenn eine Webseite für größere Unternehmen und Organisationen zu erstellen ist, muss der Webdesigner bei der Realisierung die Kunst beherrschen, die Wünsche und Vorstellungen verschiedener Abteilungen miteinander zu vereinbaren.

Weiter muss ein Webdesigner selbständig die goldene Mitte zwischen den technischen Möglichkeiten, den Wünschen des Auftraggebers („Geht nicht, gibts nicht“) und den Ansprüchen potentieller Besucher zum Beispiel bzgl. der Benutzungsfreundlichkeit finden.

Neben der kontinuierlichen Auffrischung der Qualifikation für die Webseitengestaltung zählt ferner zu den Aufgaben eines Webdesigners, flexibel Konzepte für verschiedene Branchen zu entwickeln.

Sei es für ein Hotel, die Gastronomie, einen Handwerker, einen Immobilienmakler, eine Zahnarztpraxis oder Gewerbe aller Art. Denn jede Branche stellt individuelle Anforderungen an das Webdesign.

Benutzerfreundlichkeit von Webseiten

Die Benutzerführung von Webseiten bestimmt maßgebend ihre Benutzerfreundlichkeit für Besucher.

Bei einem benutzerfreundlichen Webdesign geht es allgemein darum, wie Besucher zu gewünschten Informationen auf einer Webseite mittels Hyperlinks (kurz: Links) gelangen können.

Bei einer geöffneten Seite dreht sich die Frage der Benutzerführung darum, wie die Besucher von einer Stelle zur anderen navigieren können: ob mittels Sprungmarken oder durch Scrollen der Seite.

Ein attraktives Webdesign sollte daher nicht auf Kosten der Benutzerfreundlichkeit realisiert werden.

Weitere Beispiele für Kriterien, die bei der Benutzerfreundlichkeit (Usability) einer Webseite eine Rolle spielen, sind auf der Seite » Web-Usability zu finden.

Bedeutung von Suchmaschinen

Falls die Auffindbarkeit in Suchmaschinen für eine Webseite von Bedeutung ist, sollte bereits bei der Konzeption und Gestaltung darauf geachtet werden, dass die Website für Suchmaschinen lesbar ist.

Denn auch ein optisch attraktives Webdesign kann es im Nachhinein nicht ausgleichen, wenn eine Webseite aus technisch bedingten Gründen nicht von Suchmaschinen indexiert werden kann.

Egal ob in Berlin, Dortmund, Düsseldorf, Frankfurt, Hamburg, Hannover, Köln, Mainz oder München.

Wenn eine Webseite optimal für eine Suchmaschine lesbar sein soll, dann ist professionelles Webdesign weit mehr als beeindruckende Header, Grafikdesign, Buttons, Animationen oder aufwendige Programmierung von Layout-Templates (Vorlagen).

Bei der Planung und Gestaltung von Internetseiten (Webgestaltung) sollte von Anfang an sichergestellt werden, dass die Erfordernisse von Suchmaschinen berücksichtigt werden.

Auf dieser Grundlage können bereits bei der Website-Erstellung nachfolgende Kosten für eine erfolgreiche Platzierung im Internet verringert werden.

Anforderungen an das Design von Websites

Folgende Anforderungen können an das Design von Websites (Webdesign) gestellt werden:

  • Kurze Ladezeiten von Inhalten, insbesondere von Filmen, Videos und Fotos

  • Hohe Benutzerfreundlichkeit (Usability) und visuelle Kommunikation

  • Einfache und intuitive Navigation, mit der Besucher schnell die gesuchten Informationen finden

  • Ansprechendes und freundliches Erscheinungsbild (Layout)

  • Verständliche Sprache, klare Aussagen und leichte Lesbarkeit

  • Barrierefreies Webdesign nach Regeln des WCAG *, verpflichtend für öffentliche Stellen in der EU

  • Darstellung der Webseite mit allen Webbrowsern und Betriebssystemen (responsive Webdesign)

„Wenn Sie einen Dollar in ihr Unternehmen stecken wollen, so müssen Sie einen weiteren bereithalten, um das bekannt zu machen.“

( Henry Ford, amerikanischer Unternehmer und Industrieller 1863 – 1947 )

Checkliste zum Erstellen einer Webseite

Beim Erstellen einer Webseite kann folgende Checkliste als Grundlage für das Webdesign dienen:

  • Konzeption unter Berücksichtigung der Benutzerfreundlichkeit (Usability)

  • Konkurrenzanalyse im Internet, um Layout-Trends zu erkennen oder Inspiration zu gewinnen

  • Individuelles Erscheinungsbild mittels Header, Grafikdesign-Elemente, Fotos und Schriften

  • Logo-Erstellung mit Symbol-Wirkung und unter Berücksichtigung des » Corporate Designs

  • Web-Programmierung nach HTML-, CSS- und WCAG-Standard des » W3C *

  • Programmierung von individuellen Formularen, Vorlagen (Templates) und Medien-Plugins

  • Hilfe beim Finden einer Wunschadresse (URL) und der Webspace-Einrichtung bei einem Provider

  • Entwicklung einer Online-Marketing- und Kommunikationsstrategie

  • Integration von einem News-Blog, Web-Shop, Stadtplan oder Routenplaner

  • Integration von Multimedia-Elementen wie Animationen, Videos oder Intros

Komplett-Internetlösungen

Komplett-Internetlösungen einer Webdesign-Agentur können über das Webdesign hinausgehend zum Beispiel folgendes Portfolio abdecken:

  • Content-Management-Systeme: Einfaches Aktualisieren der Webseite über einen Webbrowser online ohne Eingriffe ins Webdesign (z.B. mit WordPress) und ohne Programmier-Kenntnisse.

  • Wettbewerbsvergleiche: Durch das Analysieren des Wettbewerbsumfeldes lassen sich Ideen gewinnen, um das eigene Webdesign im Online-Marketing wirkungsvoll hervorzuheben.

  • Web-Controlling: Mit der gezielten Besuchererfassung von Webseiten erfahren, welche Begriffe von Besuchern gesucht wurden oder welche Unterseiten und Klickpfade am beliebtesten sind.

Eine Webseite ist die Visitenkarte einer Firma im WWW und eine der wichtigsten Schnitt-Stellen zur Außenwelt. Die Webseitengestaltung bestimmt maßgebend den ersten Eindruck von einem Angebot.

Informationen und Referenzen im Bereich Programmierung und Webdesign gibt es zum Beispiel beim freiberuflich tätigen Medienberater Benjamin Latsko.

* Das W3C (World Wide Web Consortium) ist ein internationales Konsortium, das seit 1994 Grundlagen für Webstandards und die Webgestaltung erarbeitet. Beispiele sind: HTML (Hypertext Markup Language), CSS (Cascading Style Sheets) oder WCAG (Web Content Accessibility Guidelines), d.h. für ein barrierefreies Webdesign von Webseiten. Das W3C ist nicht zu verwechseln mit den W3Schools, der größten Webseite im Bereich Webentwicklung. Die W3Schools vermitteln Grundlagen, bieten Lernprogramme (englisch: Tutorials) und geben Tipps zur Webentwicklung, die im Webdesign von Nutzen sein können. So gibt es zum Beispiel Web-Tutorials für HTML, CSS, JavaScript, PHP oder XML, um die für das Webdesign wichtigsten Sprachen der Web-Programmierung zu nennen.