1. Startseite
  2. Inhaltsverzeichnis
  3. Glossar
  4. Hilfe
  5. Weitere Services...
  1. Barrierefrei
  2. Grundlagen
  3. Umsetzung
  4. Marketing
  5. Suchdienste
  6. Templates

Grundlagen

Sie sind hier: Startseite › Grundlagen

Das barrierefreie Umsetzen einer Website - barrierefreies bzw. barrierearmes Webdesign - ist nicht auf den ersten Blick erkennbar. Es macht sich jedoch bemerkbar, wenn Nutzer gezielt Informationen abrufen können, dabei ein zufriedenes Gefühl hinterlassen wird, verschiedene Navigationsmöglichkeiten angeboten werden, Suchmaschinen die eigene Website weit oben in den Suchergebnissen auflisten und die Website von der Zielgruppe gut angenommen wird.
Stand 11.09.2008

Inhaltsübersicht:

  1. Grundlagen einer Website
  2. Navigation auf einer Website
  3. Farbwirkung, Farbklang und Kontrastanalyse
  4. Beispiele für Farben als Gestaltungsmedium im Web

Grundlagen einer Website

Der Struktur einer Website kommt eine zentrale Bedeutung zu. Identität und Auftrag der Website müssen jederzeit deutlich sein, so dass dem Nutzer klar ist, auf welcher Website er sich befindet und wozu diese dient. Die Struktur muss transparent, Inhalte mit wenigen Klicks erreichbar und der aktuelle Standort innerhalb der Website erkennbar sein. Über einen hierarchischen Aufbau sind Inhalte, Leistungsmerkmale und Organisation der einzelnen Webseiten in Zusammenhang zu bringen. Wichtig ist ebenfalls eine webgerechte Aufbereitung der anzubietenden Inhalte, eine lesefreundliche Formulierung und das Hervorheben von Schlüsselwörtern.

Artikelvorschau 'Grundlagen einer Website':

Funktionen einer Website

Eine Startseite, Inhaltsseiten und die Kontaktadresse gehören zu den Standardfunktionen jeder Website. Bei einer größeren Website, ab ca. 25 Webseiten, kommen ein Inhaltsverzeichnis (engl. Sitemap), eine Suche und meist eine Seite häufig gestellter Fragen hinzu.

Lesen Sie mehr zu Funktionen einer Website
Die Startseite

Das Hauptanliegen der Startseite (engl. Homepage) ist es, dem Nutzer den Gesamtzusammenhang der Website zu vermitteln. Bereiche, die auf der Homepage hervorgehoben und auffällig beworben werden, bekommen signifikant größere Aufmerksamkeit.

Lesen Sie mehr zu Die Startseite
Schreiben für das Web

Websites haben sich in den vergangenen Jahren gewandelt. Es stehen nicht mehr die technischen und ästhetischen Möglichkeiten im Vordergrund, sondern die sach- und bedürfnisgerechte Vermittlung der Inhalte.

Lesen Sie mehr zu Schreiben für das Web

Seitenanfang

Navigation auf einer Website

Anhand der Navigation werden Hierarchien und Inhalte der Website verdeutlicht. Im Idealfall sagt die Navigation etwas über Start- und mögliche Endpunkte aus. Gewöhnlich versucht der Nutzer, im Web etwas zu finden. Wie im wahren Leben wird entweder gefragt (auf Webseiten über eine Suchen-Box) oder auf gut Glück gesucht. Beim selbstständigen Suchen wird i.d.R. zuerst in den Hauptnavigatoren nach einem entsprechenden Begriff geschaut. Dann werden die Unternavigatoren betrachtet. Und mit ein bisschen Glück ist der Nutzer nach ein oder zwei Klicks bei einer passenden Liste oder Seite gelandet. Eine klare, durchdachte Navigation hinterlässt bei den Nutzern einen guten Eindruck.

Artikelvorschau 'Navigation auf einer Website':

Konventionen der Webnavigation

Eine persistente Navigation (auch: globale Navigation) ist ein Satz von Navigationselementen, die mit einem einheitlichen Aussehen und mit einer gleichbleibenden Funktionsweise auf jeder Webseite am gleichen Platz wiederkehren.

Lesen Sie mehr zu Konventionen der Webnavigation
Navigationshilfen

Neben visuellen Hinweisen sollte jede Webseite einen Navigationspfad, einen sog. Brotkrumenpfad (engl. Breadcrumb) enthalten. Die Sitemap ist eine Übersichtsseite, vergleichbar mit einem Inhaltsverzeichnis. Auch eine Website-interne Suchfunktion ist hilfreich. Ein ebenfalls wichtiger Bestandteil jedes Accessibility-Konzeptes sind kontextbasierte Hilfeseiten.

Lesen Sie mehr zu Navigationshilfen
Tastaturbedienung

Menschen mit einer Sehbehinderung oder mit motorischen Störungen setzen eine Maus nur bedingt ein. Sie profitieren, ebenso wie jeder der lieber mit der Tastatur als der Maus arbeitet, von der Angabe sog. Tastatur-Kurzbefehle (engl. Shortcuts).

Lesen Sie mehr zu Tastaturbedienung

Seitenanfang

Farbwirkung, Farbklang und Kontrastanalyse

Farben sind das zentrale Element des graphischen Layout. Sie können sehr unterschiedlich wirken, Stimmungen beeinflussen, Vorstellungen wecken und Eindrücke verstärken. Bestimmt durch den kulturellen Hintergrund sowie das Geschlecht werden Farben sogar unterschiedlich wahrgenommen. Nicht jede Farbkombination kann ausreichend Kontraste aufweisen, was für die Gebrauchstauglichkeit jedoch von hoher Wichtigkeit ist. Durch entsprechende Tests ist es aber möglich, passende Kontraste zu finden, wenn für eine neue Website das Farbschema angelegt wird.

Artikelvorschau 'Farbwirkung, Farbklang und Kontrastanalyse':

Farbwirkung und Farbklang

Farben stehen nie für sich allein, Farben kommunizieren, setzen Kontraste. Eine Website in Schwarz-Weiß kann ein Zeichen für ein klassisches Unternehmen sein, aber auch die schlichte Eleganz der Produkte betonen. Schwache Farben und wenig Kontraste wirken schüchtern, eine ruhige Farbgebung mit kräftigen Kontrasten durchaus seriös und professionell. Zu viel Farbe und zu viele Kontraste lassen eine Website schnell unangenehm aussehen.

Lesen Sie mehr zu Farbwirkung und Farbklang
Kontrastanalyse

Angenehme Farben bedeuten nicht gleichzeitig gut erkennbare Farben. Farb- und Helligkeitskontraste sind wichtig für die Gebrauchstauglichkeit einer Website. Auch hier stehen zahlreiche Werkzeuge kostenfrei zur Verfügung, um den Kontrast zu überprüfen.

Lesen Sie mehr zu Kontrastanalyse

Seitenanfang

Beispiele für Farben als Gestaltungsmedium im Web

Im Gegensatz zu den "maschinellen Nutzern", die auf eine valide Dokumentenstruktur und informative Inhalte angewiesen sind, profitieren "menschliche Nutzer" auch von einem ausgeglichenen Design. Das Design der Website erzeugt Emotionen, übermittelt Botschaften, löst verschiedenste Reaktionen des Nutzers aus und spiegelt Firmenphilosophie sowie Unternehmenskultur wieder. Anhand konkreter Beispiele werden nachfolgend die Farben als Gestaltungsmedium im Web betrachtet.

Artikelvorschau 'Beispiele für Farben als Gestaltungsmedium im Web':

Farbbeispiele für Rot, Grün und Blau

Für die Farbe Rot werden die Website eines Energiedienstleisters und einer Handelskette vorgestellt. Die Farbe Grün wird bei einem Bierhersteller und einem Ton-Granulat-Produzent untersucht. Ein Versicherungsunternehmen und ein Mineralwasserhersteller repräsentieren die Farbe Blau.

Lesen Sie mehr zu Farbbeispiele für Rot, Grün und Blau
Farbbeispiele für Gelb, Orange und Braun

Für die Farbe Gelb werden die Website eines Briefdienstleisters und eines Eistee-Herstellers vorgestellt. Die Farbe Orange wird bei einem Baumarktbetreiber und einem Flugdienstleister untersucht. Ein Sahnelikör-Hersteller und ein Schokoladen-Hersteller repräsentieren die Farbe Braun.

Lesen Sie mehr zu Farbbeispiele für Gelb, Orange und Braun
Farbbeispiele für Violett und Rosa

Für die Farbe Violett werden die Website eines Schokoladen-Herstellers und eines Parfum-Herstellers vorgestellt. Ein Creme-Hersteller und eine Mädchenzeitschrift repräsentieren die Farbe Rosa.

Lesen Sie mehr zu Farbbeispiele für Violett und Rosa
Farbbeispiele für Weiß, Grau und Schwarz

Für die Farbe Weiß werden die Website eines Schmuckherstellers und einer Pflegemittel-Kette vorgestellt. Die Farbe Grau wird bei einem Elektrokleingeräte-Hersteller und einem Auto-Hersteller untersucht. Eine Getränke-Marke und eine Waschmittelmarke repräsentieren die Farbe Schwarz.

Lesen Sie mehr zu Farbbeispiele für Weiß, Grau und Schwarz

Seitenanfang

Tastaturkürzel:

  • 1: Startseite
  • 2: Barrierefrei
  • 3: Grundlagen
  • 4: Umsetzung
  • 5: Marketing
  • 6: Suchdienste
  • 7: Templates
  • 8: Inhaltsverzeichnis
  • 9: Hilfe
  • 0: Kontakt

Hinweis zur Verwendung:

  • Internet Explorer:
    Alt + Zahl + Enter
  • Firefox:
    Umschalt + Alt + Zahl
  • Opera:
    Umschalt + Esc + Zahl
  • Safari:
    Alt + Zahl

Layout:

Buchtipps:

Alkan, Saim Rolf
Buchdeckel Texten für das Internet
Texten für das Internet. Ein Praxisbuch für Online-Redakteure und Webtexter,
Galileo Press, Bonn, 2. aktualisierte und erweiterte Auflage 2004 (edition PAGE),
ISBN 3898424936
Bartel, Stefanie
Buchdeckel Farben im Webdesign
Farben im Webdesign,
Springer Verlag, Berlin, 1. Auflage 2003 (X.media.press),
ISBN 3540439242
Erlhofer, Sebastian
Buchdeckel Suchmaschinen-Optimierung
Suchmaschinen- Optimierung,
Galileo Computing, Bonn, 1. Auflage 2005 (Galileo Press),
ISBN 3898426203
Jacobsen, Jens
Buchdeckel Website-Konzeption
Website-Konzeption,
Addison-Wesley Verlag, München, 3. erweiterte Auflage 2005 (dpi),
ISBN 3827322499
Krug, Steve
Buchdeckel Don't make me think!
Don't make me think! Web Usability - Das intuitive Web,
mitp-Verlag, Bonn, 1. Auflage 2002 (Mediendesign),
ISBN 3826608909
Manhartsberger, Martina und Musil, Sabine
Buchdeckel Web Usability
Web Usability - Das Prinzip des Vertrauens,
Galileo Press, Bonn, 1. Auflage 2002 (Galileo Design),
ISBN 3898421872
Münz, Stefan
Buchdeckel Professionelle Websites
Professionelle Websites. Programmierung, Design und Administration von Webseiten,
Addison-Wesley Verlag, München, 2. überarbeitete Auflage 2006 (IX-Buchtipp),
ISBN 3827323703
Münz, Stefan und Nefzger, Wolfgang
Buchdeckel HTML-Handbuch
HTML & Web-Publishing Handbuch, Band 1,
Franzis' Verlag GmbH, Poing, 2002,
ISBN 3772375162
Radtke, Angie und Charlier, Michael
Buchdeckel Barrierefreies Webdesign. Attraktive Websites zugänglich gestalten
Barrierefreies Webdesign. Attraktive Websites zugänglich gestalten,
Addison-Wesley Verlag, München, 1. Auflage 2006,
ISBN 3827323797

Service-/Hilfsnavigation:

  1. Startseite
  2. Kontakt
  3. Kontaktformular
  4. Datenschutz
  5. Impressum
  6. Aktuelles
  7. Änderungshistorie
  8. Inhaltsverzeichnis
  9. Glossar
  10. Hilfe
  11. Suche