Modul 4: Webangebotsoptik, Inhalte und Navigation

Modul 4.2: Schwarz, Grau oder Weiss: Moden und Unarten im WorldWideWeb - soll ich mich anpassen oder nicht?

Das WorldWideWeb unterliegt rascher Wandlung und dabei sind nicht nur Anpassungen an komplexere Technik und umfassenderes Informationsmanagement von Bedeutung, sondern zu einem guten Anteil auch Moden. Was heute vielleicht als Super-Layout angesehen wird, war vor einiger Zeit möglicherweise noch verpönt oder wird in Zukunft zum alten Eisen gehören. Sie sollten sich also auch überlegen, ob Sie WWW-Modeerscheinungen mitmachen sollten oder nicht. Wenn Sie eine Eye-Catcher-Site haben möchten, müssen Sie sich ggf. an diese Moden anpassen, haben aber vielleicht dadurch auch einen besonders hohen Pflegeaufwand, wenn Sie Ihre Seiten dann zukünftigen Moden anpassen müssen. Klassischeres Layout ist weniger ins Auge stechend, aber kann vielleicht länger bestehen. Das schönste Layout nützt natürlich nichts, wenn der Inhalt nicht stimmt. Umgekehrt erregt auch ein äußerst interessanter Inhalt ohne ansprechende Verpackung und funktionelle Navigation nur wenig Aufmerksamkeit.

Nachstehend einige wenige Punkte, die vielleicht die Entscheidung für ein bestimmtes Design bzw. einen Navigationstyp erleichtern können. Die teilweise als Beispiele mit vorgestellten Websites "aus eigener Produktion" werden uns noch mehrfach zur weiteren Erläuterung begegnen.

• Seitenhintergrundfarbe: Zu Beginn des WWW hatten alle Webseiten einen grauen Hintergrund. Nach Einführung der tags für Hintergrundfarbe bzw. Hintergrundbilder wurde es häufig poppig, mit dem Effekt, dass viele Schriften schlecht lesbar waren. Zeitweise waren auch schwarze Seitenhintergründe sehr beliebt. Danach setzte sich häufig Weiß als neutrale Hintergrundfarbe durch. In letzter Zeit beobachten man auch zunehmend wieder graue Hintergründe, man nennt dies nun aber eher "platin" oder "titan", Glück für die, die ihre alten Seiten diesbezüglich nicht angepasst haben ;-)
  
  
• Sonstige Hintergründe: Mit Hintergrundbildern wurde längere Zeit zuviel des Guten getan; viele Texte wurden dadurch schlicht unleserlich. Eine Zeitlang besonders beliebt waren auch Hintergrundbilder, die links eine farbige Spalte produzierten und vielleicht noch einen Ringbuch-Effekt erreichten. Auch in Frames werden häufig verschiedene Farben zur Unterscheidung von Kopfleiste, Navigation und Hauptteil verwendet (so auch in unserer Kurssite). Seit einiger Zeit gehen viele Webdesigner hier von den rechteckigen Farbaufteilungen weg und bevorzugen geschwungen abgegrenzte Hintergrundfarben.
  
  
• Tabellen: als Tabellen aufkamen, waren die Webseiten voll davon. Voller Stolz hat man gezeigt, dass man mit Tabellen arbeiten kann und hat deshalb auch die Rahmen stehen lassen. Selbst einzelne Bilder saßen oft in einer aus nur einer Tabellenzelle bestehenden Tabelle, damit man einen "schönen" Bilderrahmen darum legen kann. Dies ist heute fast vollständig von Webseiten verschwunden. Tabellen sind aber nach wie vor eines der wesentlichsten Layout-Elemente von Webseiten. Außer bei typischen Tabellenanwendungen (Vergleichende textliche bzw. zahlenmäßige Darstellung von Eigenschaften) werden sie heute ohne Rahmen angewandt und dienen vor allem zur gezielten Verteilung von Text und Bildern auf der Website.
  
  Nebenstehendes Bild zeigt ein Angebot des Kursleiters aus dem Jahr 1995 (mit nur geringen nachfolgenden Änderungen), den Jurassic Reef Park. Voller Stolz prangt das Inhaltsverzeichnis in einer Tabelle. Klick auf Bild führt zur Seite (alternativ können Sie einen Screenshot hier aufrufen, 63 KB)
  
  
• Reduktion vs. Überfüllung auf der Eingangsseite: Früher waren die Eingangsseiten von Sites häufig besonders übersichtlich und mit einem schönen Bild oder einer schönen Grafik und nur sehr wenigen Navigationsknöpfen für die Hauptkategorien des Angebots versehen. Oft gab es sogar eine aufwändige Animation, v.a. seit Flash-Animationen aufkamen, die sehr schnell laden (vgl. Kursteil B), bevor man auf die eigentliche Eingangsseite mit den Navigationselementen geleitet wurde. Das Flashfieber hat sich stark gelegt; Flash ist aber für thematische Anwendungen (z.B. Visualisierungen geowissenschaftlicher Prozesse, vgl. Kursteil B) nach wie vor ein besonders leistungsfähiges Mittel.
  
  Heute herrscht die Meinung vor, dass der typische Internet-Nutzer nur zu einem Angebot gelockt werden kann, wenn er nach sehr wenigen Mausklicks (3-4) gefunden hat, was er sucht (siehe dazu auch den nächsten Kursmodul). Das brachte insbesondere Frameset-Seiten sehr in den Blickpunkt des Interesses. Auch auf unserer Site wird ja durch Frames die möglichst rasche Navigation erleichtert.
  
  Bei besonders umfassenden Angeboten haben sich deshalb Portale durchgesetzt, bei denen dichtgedrängt und beim ersten Besuch eigentlich eher schlecht auffindbar, alles Wesentliche von Seite 1 zu erreichen ist. (Ein Beispiel hierzu finden Sie auch auf der Eingangsseite der Ludwig-Maximilians-Universität: www.lmu.de) Damit hat sich auf weiten Bereichen das krasse Gegenteil dessen durchgesetzt, was noch vor wenigen Jahren als optimal angesehen wurde, nämlich eine auf wenige Grundkategorien beschränkte Homepage zu einer Website, eine Empfehlung, die ich immer noch für viele Site-Typen aussprechen kann.
  
  Beispiele: Links unten: Beispiel für ein Ihnen wohl bekanntes Portal des Kursleiters: www.palaeo.de; Mitte: Beispiel für eine Website des Kursmasters mit reduzierten Grundkategorien: www.palaeontologische-gesellschaft.de; Rechts unten: Beispiel für eine Eingangsseite mit vielen Grundkategorien: www.palaeo.de/wissenschaftstage2001 (erstellt durch K. Henßel, München; technische Beratung durch Kursleiter). Klick auf Abbildungen führt zur entsprechenden Seite, analog kann ein Screenshot aufgerufen werden.
  
  

Portaltyp: www.palaeo.de (alternativ Screenshot, 116 KB)	Site mit 8 Unterkategorien: www.palaeontologische-gesellschaft.de (alternativ Screenshot, 52 KB)	Site mit 16 Unterkategorien: www.palaeo.de/wissenschaftstage (alternativ Screenshot, 79 KB)

Siehe auch Modul 4.6.2 zur weiteren Diskussion dieser Seiten.

• 
  
  
• Der letzte Trend in dieser Richtig ist die Personalisierung von Webangeboten. Der Benutzer kann sich selbst zusammenstellen, was er beim nächsten Besuch alles an Kategorien vorgesetzt bekommen lassen will. Beispiele sind z.B. myNetscape-Portal, myYahoo etc. Dahinter steht die Einschätzung, dass es dem Benutzer zunehmend zu umständlich wird, sich alles selbst aus dem Web zusammenzusuchen, er will sich lieber sein Angebot servieren lassen. Hinter derartigen personalisierten Portalen steht aber eine hochkomplexe Technik, bei der die Webangebote aus Datenbanken erst beim Aufruf der Seite zusammengesetzt werden (in Modul 9 werden wir einen Blick auf derartige Techniken werfen).
  
  
• Animationen: In der ersten Ausbreitungsphase des Webs war auch bildmäßig noch alles sehr statisch. Dann wurden animierte Gif-Bilder interessant und es zappelte an allen Ecken und Enden (auch auf meinen Webseiten übrigens). Da dies überzogen war, beruhigte sich diese Welle auch wieder. Mit dem Aufkommen von dhtml wurden insbesondere Rollover-Efffekte große Mode (Austausch eines Bildes, insb. eines Buttons bei Berühren und Klicken mit der Maus). Auch dies hat sich wieder etwas beruhigt, ist aber nach wie vor recht weit verbreitet. Java erlaubte dann noch sehr viel weitergehende Animationsmöglichkeiten, die sich aber wegen teilweiser Inkompatibilitäten mit manchen Browsern oder Plattformen sowie ihrer gewissen "Absturzfreude" nicht so weit verbreitet sind, wie man dies bei ihrer Erfindung dachte.
  
  Nachdem es heutzutage keine Besonderheit mehr ist, dass sich auf Webseiten etwas bewegt, liegt die erfreuliche Tendenz vor, dass Animationen v.a. zielgerichtet eingesetzt werden, d.h. zur leichteren Benutzerführung (z.B. Erscheinen von Submenus als Rollover-Effekt) sowie zur Visualisierung bzw. Erläuterung von Vorgängen, die anderweitig nur sehr langatmig zu erläutern sind. Auch wir wollen dies überwiegend so in unserem Kurs halten. Alles diesbezüglich Wissenswerte zu Animationen erfahren Sie in Modul 8
  
  

Mit diesem kleinen und nur sehr ausschnittsweisen "webgeschichtlichen Abriss" im Hinterkopf können wir uns nun an die Planung einer größeren Webseite wagen.

>> zum nächsten Kursteil Modul 4.3:Planung
<< Modul 4.1