Document Body Page Navigation Panel Document Outline

Document Outline

Universität Leipzig
Wirtschaftswissenschaftliche Fakultät
Institut für Software- und Systementwicklung
Prof. Dr. Gerd Goldammer
Gestaltungsprinzipien und Gestaltungsmuster für Präsentationen im Internet
Abbildungsverzeichnis
- Abkürzungsverzeichnis
KAPITEL 1 Motivation
KAPITEL 2 Einlußfaktoren und Gestaltungsrichtlinien
KAPITEL 3 Gestaltungsmuster und Beispiele
KAPITEL 4 Schlußbetrachtung
Anhang
Literaturverzeichnis
Erklärung
- 1. Professor Dr. Gerd Goldammer

Pages 1--69 from Untitled

Page 1 2
Universität Leipzig
Wirtschaftswissenschaftliche Fakultät
Institut für Software-und Systementwicklung
Prof. Dr. GERD GOLDAMMER

Gestaltungsprinzipien und
Gestaltungsmuster für
Präsentationen im Internet

Diplomarbeit
Freie wissenschaftliche Arbeit zur Erlangung des akademischen Grades
Diplom-Wirtschaftsinformatiker an der Wirtschaftswissenschaftlichen Fakultät
der Universität Leipzig

Betreuender Hochschullehrer: Prof. Dr. GERD GOLDAMMER
Fachrichtung: Wirtschaftsinformatik
Diplomarbeit vorgelegt von: WALTER STEINBACH
Fachsemester: 11
Matrikel-Nr.: 7565203
Anschrift: Petersstraße 30
04109 Leipzig
Datum der Abgabe: 02.11.1999 1
1 Page 2 3
Inhaltsverzeichnis
2
Inhaltsverzeichnis
Inhaltsverzeichnis . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 2
Abbildungsverzeichnis . . . . . . . . . . . . . . . . . . . . . . . . . . . . 4
Abkürzungsverzeichnis . . . . . . . . . . . . . . . . . . . . . . . . . . . 5
KAPITEL 1 Motivation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.1 Einleitung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7
1.2 Ziel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.3 Aspekte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 8
1.4 Begriffe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 10
1.5 Vorgehensweise und Abgrenzung . . . . . . . . . . . . . . . . . . . . . . . . 10

KAPITEL 2 Einlußfaktoren und Gestaltungsrichtlinien . . . . . . . . . . . . 11
2.1 Standards für Benutzeroberflächen . . . . . . . . . . . . . . . . . . . . . . . 11
2.1.1 Entstehung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
2.1.2 Ein Standard: DIN 66 234 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
2.1.3 Style-Guides für graphische Benutzeroberflächen . . . . . . . . . . . 12
2.1.4 Web-Style-Guides . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13

2.2 Hypertext und Hypermedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
2.2.1 Einleitung und Begriffe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
2.2.2 Historie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14
2.2.3 Hypermedia . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
2.2.4 Anforderungen an Hypertextsysteme . . . . . . . . . . . . . . . . . . . . . . 16
2.2.5 Navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
2.2.6 Struktur der Website . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 20

2.3 Das Übertragungsprotokoll . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 23
2.3.1 HTTP -Hypertext Transfer Protocol . . . . . . . . . . . . . . . . . . . . . . . 23
2.3.2 URL -Uniform Ressource Locator . . . . . . . . . . . . . . . . . . . . . . . . 25
2.3.3 Ablauf der Abfrage einer Seite . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

2.4 HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
2.4.1 Einleitung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26
2.4.2 SGML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 27
2.4.3 Entstehung von HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 28
2.4.4 Zukünftige Entwicklungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
2.4.5 XML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
2.4.6 Frames . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 31
2.4.7 Tabellen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 32
2.4.8 Ein-Pixel-Gifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33

2.5 Menschliche Informationsverarbeitung . . . . . . . . . . . . . . . . . . . . 33
2.5.1 Einleitung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 33
2.5.2 Informationsverarbeitung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 34
2.5.3 Grundlayout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 35
2.5.4 Verwendung von Farben . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 36
2.5.5 Typographie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 39
2.5.6 Plazierung von Navigationselementen . . . . . . . . . . . . . . . . . . . . . 42
2.5.7 Grafische Seitengestaltung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42 2
2 Page 3 4
Inhaltsverzeichnis
3
2.5.8 Größe der präsentierten Informationseinheiten . . . . . . . . . . . . . . 43
2.6 Interface -Schnittstelle zum Nutzer . . . . . . . . . . . . . . . . . . . . . . . 43
2.6.1 Allgemein . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43
2.6.2 Interface von Hypermediasystemen . . . . . . . . . . . . . . . . . . . . . . . 44
2.6.3 Interface-Design . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45
2.6.4 Startseite . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46
2.6.5 Seitenfuß . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 46

2.7 Einschränkungen auf der Nutzerseite . . . . . . . . . . . . . . . . . . . . . 47
2.7.1 Der Web-Browser . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 47
2.7.2 Festlegung der optischen Seitengröße . . . . . . . . . . . . . . . . . . . . 48

KAPITEL 3 Gestaltungsmuster und Beispiele . . . . . . . . . . . . . . . . . . 50
3.1 Einleitung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
3.2 Klassifizierung von Websites . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
3.2.1 Nach dem Inhalt . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 50
3.2.2 Nach dem optischen Erscheinungsbild . . . . . . . . . . . . . . . . . . . . 51
3.2.3 Nach der Zielgruppe . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51

3.3 Gestaltungsmuster . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
3.3.1 Suchdienste/ Potalseiten . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
3.3.2 Zeitschriften und Zeitungen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
3.3.3 Unternehmenspräsentationen . . . . . . . . . . . . . . . . . . . . . . . . . . . 54

KAPITEL 4 Schlußbetrachtung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 55
Anhang . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
Literaturverzeichnis . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 65
Erklärung . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 69 3
3 Page 4 5

durchdringt in immer stärker werdendem Maße nahezu alle Bereiche unseres
Lebens.
Fernsehstationen und deren Nachrichtenredaktionen, Zeitschriften und
Tageszeitungen bieten zusätzliche, aktuellere Information neben den her-kömmlichen
Produkten an.
Banken, Versicherungen, Buchversand, Autovermietungen oder nur der
Getränkelieferservice fordern auf, über das WWW einzukaufen oder Produkt-informationen
abzurufen.
Lernen und Lehren über das Internet, Austausch von wissenschaftlichen Ver-öffentlichungen,
Nutzung von E-Mail -Universitäten waren immer Vorreiter in
der Verwendung dieses Kommunikationsmediums.
Auf keiner Visitenkarte fehlt die E-Mail-Adresse und ein Hinweis auf die Web-seite
der arbeitgebenden Unternehmung.
Sinkende Kosten für die Nutzung des Internets erlauben es auch privaten
Haushalten, die Auswirkungen des Informationszeitalters kennenzulernen.
Dem Internet wird ein Verbreitungs-und Verwendungsgrad gleich dem Tele-fon,
dem Buch oder dem Zeitungsmarkt und damit eine revolutionäre kultu-relle
Entwicklung vorhergesagt. Das Internet kann ein Medium zur
Verbreitung von Ideen auf Massenbasis werden, Menschen, die vorher nie als

Autor tätig waren, ist es jetzt möglich, sich anderen mitzuteilen. 1
Während herkömmliche Informationsmedien allerdings seit vielen Jahren exi-stieren
-der Buchdruck wurde beispielsweise 1456 erfunden -und damit
einer langen Zeit der Verbesserung unterlagen, kann das WWW auf lediglich
10 vergangene Jahre seit seiner Entstehung zurückblicken.

1. vgl. Wilson, S.: World-Wide-Web-Design-Guide, 1996, S. 21 7
7 Page 8 9
Motivation
8
1.2 Ziel
Es existieren zahlreiche Veröffentlichungen (Bücher, Websites) zum Thema

Erstellung von Internetpräsentationen. Diese legen aber meist den Schwer-punkt
auf die Hypertext Markup Language, auf die Programmierung.
Für Autoren des Bereiches Design/ Gestaltung steht der grafische bzw. künst-lerische
Anspruch im Vordergrund.
Es wurde bisher wenig versucht, die Gestaltung von Websites als Verbindung
des traditionellen Dokumentenmanagements, redaktioneller Arbeit einerseits
und Grafikdesign, Gestaltung von Benutzeroberflächen, technische Möglich-keiten
aber auch Einschränkungen für die Anzeige von Text und Grafik ande-rerseits
zu sehen. Es gibt keine allgemein gültigen und allumfassenden
Regeln für die Erstellung „guter" Webseiten. Schon die Beantwortung der
Frage nach der Einteilung in „gute" und „schlechte" Internetpräsentationen ist
nicht einfach. So gibt es neben Webseiten, die dem Informationsbedarf und
der Konsumnachfrage nachkommen, solche, die sich ausschließlich an
Künstler wenden, Experimentalseiten, welche die teilweise unglaublichen
Möglichkeiten des WWW offenlegen und gar solche, die es sich zur Aufgabe
gemacht haben, Falschmeldungen zu verbreiten. Jede Rubrik für sich erfor-dert
eine andere Betrachtungsweise und Einordnung. Nicht zuletzt der per-sönliche
Geschmack und eventuelle Behinderungen wirken ursächlich für
unterschiedliche Qualitätsanforderungen und Qualitätsempfindungen.
Ziel dieser Arbeit soll es sein, mögliche Gestaltungsrichtlinien für Internetprä-sentationen
zu entwickeln und Gestaltungsmuster für verschiedene Präsenta-tionszwecke
vorzuschlagen.

1.3 Aspekte
Publizieren, mit der Maßgabe, daß die Ausgabe nicht auf einem statischen

Medium wie Papier erfolgt, zwingt zur Aufstellung neuer Regeln. Veröffentli-chungen
im Internet bzw. im WWW lassen keine Aussage über die genauen
Parameter des Ausgabegerätes zu. Im Gegensatz zur Gestaltung von Web-seiten
ist beim „klassischen" Layout ein festes Format vorgegeben. Meist
erfolgt die Ausgabe auf einem oder mehreren „Blatt Papier", welche naturge-mäß
nach dem Druck keinen Änderungen an Schriftart, -größe, Seitenformat 8
8 Page 9 10
Motivation
9
und Farbeinstellungen unterliegen. 2 Dies stellt gerade die große Herausforde-rung
beim Erstellen von Onlineinformation dar: Die Parameter der Darstellung
sind variabel. Variabel sind beispielsweise die Auflösung des Monitors, die
eingestellte oder mögliche Farbtiefe, die voreingestellte Schriftart des Web-browsers,
unterschiedliche Browser und der auf verschiedenen Computern

unterschiedlicher Vorrat an installierten Schriftarten. 3 Ein Browser ist dabei ein
Programm, das die Navigation in großen Informationsbeständen, hier das

WWW, erlaubt und das Anzeigen der gefundenen Information unterstützt. 4
Weiterhin existieren textbasierte Browser (bspw. Lynx) oder es ist sogar mög-lich,
daß sehbehinderte Personen mit einem Braille-Ausgabegerät oder unter
Zuhilfenahme von Sprachein-und ausgabegeräten im Netz navigieren.
Während sich im Printbereich ein gewisser Standard bei der Gestaltung eta-bliert
hat, entwickelt jeder Autor von Hypertextsystemen eigene Vorstellungen

von der Darstellung der Funktionalität 5 .
Die Verwendung von Bildern und Farben muß sich an den minimalen Darstel-lungsmöglichkeiten
der verschiedenen Nutzer orientieren, das erfordert
Selbstbeschränkung für Grafiker.
Das Design im Web umfaßt sehr viele Bereiche. Als Designer dieses Mediums
muß man sich mit Datenkompression, Navigationstechniken, Farbpalette, Ani-mation
und Klang auskennen. Für eine einzelne Disziplin des „visual Design"
bestand vorher nicht die Notwendigkeit, sich mit allen diesen Dingen gleich-zeitig

auseinanderzusetzten. 6 Weiterhin sind Kenntnisse auf dem Gebiet des
Informationsdesigns und des Programmdesigns notwendig. Gute Seiten fal-len
dadurch auf, daß sie auf allen Ebenen bestechen. Durch das Web ist es
möglich, auf allen Gebieten zu arbeiten, sie noch dazu perfekt zu beherr-schen,

ist nahezu unmöglich. 7

2. Abgesehen von dem ebenfalls naturgemäßen Veränderungen durch den Alterungs-prozeß.
3. vgl. Weinman, L.: WebDesign, 1998, S. 25
4. vgl. Hansen, H. R. Arbeitsbuch Wirtschaftsinformatik, 1997, S. 52
5. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 23
6. vgl. Weinman, L.: WebDesign, 1998, S. 2
7. vgl. Weinman, L.: WebDesign, 1998, S. 2 9
9 Page 10 11
Motivation
10
1.4 Begriffe
Oft ungenau sind die verschiedenen Begriffe zu Webpage, Website, Webseite

oder Homepage abgegrenzt. Es soll, der Literatur 8 folgend, für die Arbeit wie
folgt festgelegt sein:
Eine Webseite ist ein einzelnes mit der Beschreibungssprache des World
Wide Web (HTML) erstelltes Dokument.
Eine Website ist eine strukturierte Sammlung von Webseiten. Wenn von einer
Website gesprochen wird, dann ist immer die gesamte Internetpräsentation,
bestehend aus mehreren Unterseiten, gemeint.
Unter Homepage ist die Startseite bzw. Eingangsseite einer Website zu ver-stehen.
9

1.5 Vorgehensweise und Abgrenzung
Die Arbeit ist neben den einleitenden Worten in zwei Teile gegliedert. Der

erste Teil (Kapitel 2) widmet sich den Einflußfaktoren bzw. Einflußgrößen und
den sich daraus ableitenden Gestaltungsprinzipien für Internetpräsentatio-nen.

Der zweite Teil (Kapitel 3) befaßt sich mit der Klassifizierung von Websites und
der Entwicklung von Gestaltungsmustern für Internetpräsentationen.

Nicht eingegangen wird auf zwei Bereiche.
Einerseits wurde aus Platzgründen der sicherlich wichtige Bereich „Bilder und
Grafiken" nicht bearbeitet. Es ist von großer Bedeutung, welche Vorlagen in
welche Grafikformate umgewandelt werden müssen und wie sich die Datei-größen
minimieren lassen. Dieses Thema läßt sich allerdings in zahlreichen
Büchern nachlesen.
Aus dem selben Grund wird auf die Gestaltung durch Programmelemente wie
Java oder Javascript nicht eingegangen. Hinzu kommt, daß hier die gleichen
noch zu entwickelnden Gestaltungsrichtlinien an Farbwahl, Typographie und
Plazierung angewendet werden sollten.

8. vgl. Born, G.: HTML 4-Kompendium, 1998, S. 269; vgl. Lemay, L.: HTML in 14 Tagen,
1998 S. 64; vgl. Hentrich, J.: Hypermedia Design, 1998, S. 218.
9. vgl. Lemay, L.: HTML in 14 Tagen, 1998 S. 65 10
10 Page 11 12
Einlußfaktoren und Gestaltungsrichtlinien
11
KAPITEL 2 Einlußfaktoren und Gestal-tungsrichtlinien
2.1 Standards für Benutzeroberflächen
2.1.1 Entstehung
Im Zuge der immer stärker werdenden Verbreitung von Computern seit den
60er Jahren nahm die Anzahl unterschiedlich gestalteter Benutzeroberflächen
zu. Daher mußten verschiedene Wissenschaftsdisziplinen an einer Vereinheit-lichung
arbeiten. Ergebnisse dieser Forschungen sind in Normen und Richtli-nien
eingeflossen. Eine internationale Vorreiterrolle nahm dabei das Deutsche
Institut für Normung (DIN) ein. Vorgaben wurden u. a. 1988 in der Norm „Bild-schirmarbeitsplätze,
Grundsätze ergonomischer Dialoggestaltung" (DIN

66234 Teil 8) festgeschrieben. 10
Andere Standards wurden bspw. durch den VDI (Verein Deutscher Inge-nieure)
in der Richtlinie 5005 „Software-Ergonomie in der Bürokommunika-tion"
oder durch die ISO (International Standardization Organization) in der
Norm ISO 9241 „Ergonomic requirements for office work with visual display
Terminals" gesetzt.

2.1.2 Ein Standard: DIN 66 234
2.1.2.1 Einleitung
In der Norm DIN 66234 sind die Basiskriterien für die Gestaltung von Benut-zerschnittstellen

definiert. Obwohl es strittig ist, alles zu reglementieren, man-gelt
es vielen Präsentationen im Internet an dem, was als Grundvoraus-setzungen
für ergonomische Dialogsysteme angesehen wird. Teil 8 dieser

DIN-Norm definiert 5 Punkte für Benutzerfreundlichkeit: 11

10. vgl. Ziegler, J.; Ilg, R. „Benutzergerechte Softwaregestaltung" S. 9
11. vgl. Wirth, T.: Kommunikationsdesign, http:// www. kommdesign. de, 10/ 1999 11
11 Page 12 13
Einlußfaktoren und Gestaltungsrichtlinien
12
2.1.2.2 Aufgabenangemessenheit
Die Benutzer werden in der Erledigung ihrer Arbeitsaufgabe effizient unter-stützt.

Sie erreichen ihre Ziele schnell, ohne durch die Eigenschaften des Dia-logssystems
unnötig belastet zu werden.

2.1.2.3 Selbstbeschreibungsfähigkeit
Jeder Dialogschritt ist unmittelbar verständlich. Die Benutzer können sich

eine für das Verständnis und für die Erledigung der Arbeitsaufgabe zweckmä-ßige
Vorstellung der Systemzusammenhänge machen.

2.1.2.4 Erwartungskonformität
Der Dialog entspricht den Erwartungen, die der Benutzer aus Erfahrungen mit

bisherigen Arbeitsabläufen oder aus der Benutzerschulung mitbringt.

2.1.2.5 Konsistenz
Das Dialogverhalten ist einheitlich. Uneinheitliches Dialogverhalten zwingt

den Benutzer zu starken Anpassungen an wechselhafte Durchführungsbedin-gungen
seiner Arbeit, erschwert das Lernen und bringt unnötige Belastungen
mit sich.

2.1.2.6 Fehlerrobustheit
Trotz fehlerhafter Eingaben kann das Arbeitsergebnis ohne oder mit minima-lem

Korrekturaufwand erreicht werden. Eingaben der Benutzer dürfen nicht
zu undefinierten Systemzuständen oder Systemzusammenbrüchen führen.

2.1.3 Style-Guides für graphische Benutzeroberflächen
2.1.3.1 Notwendigkeit
Ein Nachteil der zunehmenden Verbreitung von graphischen Benutzeroberflä-chen

ist die Vielfalt und Unterschiedlichkeit der verfügbaren Systeme. Oft
haben Hersteller absichtlich andere Erscheinungsbilder gewählt, um sich von

vorhandenen Produkten abzugrenzen. 12
Graphische Benutzeroberflächen ermöglichen einen leichteren Einstieg in die
Computernutzung und schaffen durch das sogenannte „Look and Feel" den
einfacheren Übergang in neue Anwendungen unter der gleichen Oberfläche.

12. vgl. Ziegler, H.; Ilg, R.: Benutzergerechte Softwaregestaltung, 1993, S. 25 12
12 Page 13 14
Einlußfaktoren und Gestaltungsrichtlinien
13
2.1.3.2 Beispiele 13
Dieser exemplarische Überblick dient der Vollständigkeit. Nähere Untersu-chungen

sind nicht Gegenstand der Arbeit.

° Motif TM ein Produkt der Open Software Foundation.
°OPEN L OOK TM von SUN Microsystems und AT& T.
° CUA -Common User Access, die Komponente der SAA (System
Application Architecture)-Plattform von IBM für die Gestaltungsver-einbarungen
zum Zweck der konsistenten Produktgestaltung.

° Siemens-Nixdorf-Style-Guide.

2.1.4 Web-Style-Guides
Für das World Wide Web gibt es noch keinen allgemein durchgesetzten Style-Guide.
Bisher haben unterschiedliche Websites verschiedene Erscheinungs-bilder.
Es kann zwar festgestellt werden, daß sich bspw. bei der Plazierung

von Navigationselementen 14 oder der Bereitstellung einer lokalen Suche
Standards hinsichtlich der angebotenen Dienste etabliert haben, allerdings
kann dabei von einem einheitlichen Auftritt verschiedener, unabhängiger
Anbieter von Information nicht gesprochen werden.
Bekannt geworden sind allerdings der „Yale Style-Guide" und der Style-Guide

des W3-Konsortiums. 15 Diese schreiben allgemeine Gestaltungsrichtlinien
vor, gehen jedoch nicht so weit, einzelne Gestaltungselemente vorzuschrei-ben.

2.2 Hypertext und Hypermedia
2.2.1 Einleitung und Begriffe
Unter Hypertext ist eine nicht-lineare Folge von Dokumenten zu verstehen.
Während in Büchern und Zeitschriften i. d. R. linear gelesen wird, bietet Hyper-text
die Möglichkeit eines flexiblen Vorgehens beim Betrachten derartiger
Dokumente.

13. vgl. Ziegler, H.; Ilg, R.: Benutzergerechte Softwaregestaltung, 1993, S. 26
14. vgl. Matz, A.: Das Leitmotiv, http:// www. zdnet. de/ internet/ artikel/ wdm/ 9802/
leitm. wc. htm, 03/ 1999
15. Eine Sammlung der wichtigsten Webadressen befindet sich im Anhang. 13
13 Page 14 15
Einlußfaktoren und Gestaltungsrichtlinien
14
In einem Hypertext ist die Information in überschaubare Informationseinheiten
aufgeteilt, die als Knoten bezeichnet werden. Erschlossen werden die Einhei-ten
durch Links, die als Verweise zwischen den Knoten angebracht sind und
den strukturellen Teil der Information darstellen. Ein Link verbindet einen
Quellknoten und einen Zielknoten. Somit ist ihm eine Richtung gegeben, die
ebenfalls Teil der Information ist. Der Endpunkt eines Links muß nicht der
gesamte Knoten sein, es kann dies auch eine Teilmenge des Knotens, z. B. ein
Stichpunkt sein. Man spricht dann von einem Anker als Endpunkt des Links.
Durch Links bzw. Querverweise kann zwischen verschiedenen, durch die Ver-weise
referenzierten, Textteilen „gesprungen" oder navigiert werden. Diese
Links sind besonders hervorgehoben und verweisen sinnvollerweise auf
nähere Information zu dem entsprechenden Begriff, der Grafik etc. oder bie-ten
verwandte Information. Der Benutzer legt dabei selbst fest, auf welchem
Weg er den Referenzen folgt, er bewegt sich frei durch die verfügbaren

Inhalte. 16

2.2.2 Historie
Die ersten Überlegungen, die ein Hypertextsystem darstellen, stammen aus
dem Jahr 1945. Zu diesem Zeitpunkt entwickelte Vannevar Bush ein System
namens „Memex", welches allerdings niemals realisiert wurde. Es sollte das
menschliche Suchverhalten nach Information nachempfinden und Wissen-schaftlern
die Möglichkeit geben, aus großen Datenmengen die relevanten

Fakten ausreichend schnell zu präsentieren. 17
Erst in den 60er Jahren gelang es Douglas E. Engelbart ein auch nach heuti-gen
Maßstäben modernes System zu entwickeln. Es erlaubte die Navigation
durch das Eingabegerät „Maus" und war in der Lage, von mehreren Personen
gleichzeitig bzw. verteilt gepflegt zu werden. Es erreichte allerdings keinen
größeren Anwenderkreis. Lediglich in abgewandelter, mechanischer Form,
fand es Verwendung im Bereich der Wissensvermittlung. Sogenannte „pro-grammierte
Bücher" wurden publiziert, die je nach Antwort auf eine Frage an

eine andere Stelle im Buch verwiesen. 18

16. vgl. Ziegler, H.; Ilg, R.: Benutzergerechte Softwaregestaltung, 1993, S. 105
17. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 6
18. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 6 14
14 Page 15 16
Einlußfaktoren und Gestaltungsrichtlinien
15
Als Begründer des Begriffes Hypertext kann Theodor H. Nelson angesehen
werden. Er entwickelte Mitte der 60er Jahre das System „Xanadu" für die
elektronische Publikation. Hypertext stand dabei als Begriff für Dokumente

mit nicht-linearer Struktur. 19 Eine weitergehende, auch heute noch nicht
erreichte Vorstellung, präsentierte Ted Nelson in seinem Buch „Computer
Dreams" von 1978. Er stellte die Information in den Mittelpunkt und verband
damit den Wunsch, daß mittels Computer ein Zugriff auf „alle Information der

Welt" möglich sein sollte. 20 Nelson prägte im weiteren die Aussage, daß es
sich bei Hypertext nicht um eine Technologie sondern um Literatur handelt. 21
Seit 1980 entstanden viele Anwendungen von Hypertextsystemen und die

Integration von Hypertextfunktionalität in bestehende Applikationen. 22
Bekannte Anwendungen von Hypertextsystemen sind beispielsweise Hyper-card
(später Hypermedia) auf dem Apple Macintosh oder das Hilfesystem der
grafischen Benutzeroberfläche MS Windows.
Einen weiteren erfolgreichen Schritt erlebt Hypertext durch Mulimedia-Anwen-dungen.
Der interaktive Charakter bietet dabei ein einfaches Konzept zur Prä-sentation
und Organisation multimedialer Anwendungen.

2.2.3 Hypermedia
Oft werden die Begriffe Hypertext und Hypermedia nicht konsequent vonein-ander
getrennt und Hypertext in einem übergreifenden Sinne (Obermenge
von Hypermedia) gebraucht, obwohl es eigentlich genau umgekehrt sein
sollte (Text als Medium ist durchaus einleuchtend). Die ungenaue Trennung
rührt sicherlich daher, daß vor der Entstehung des Begriffes Hypermedia der
Begriff Hypertext allgemein gebräuchlich verwendet wurde.
Hypermedia ist die Anwendung des Hypertext-Konzepts auf Multimedia-Dokumente.
23 Konkret sind das Dokumente, die neben Text multimediale Ele-mente

wie Grafiken, Geräusche (Sounds) oder Bewegtbilder (Animationen)
enthalten.

19. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 7
20. vgl. December, H.; Randall, N.: World Wide Web fuer Insider, 1995S. 3
21. vgl Behme, H.; Mintert, S.: XML in der Praxis, 1998, S. 29
22. bspw. Springen zu Querverweisen in Textverarbeitungen wie MS Word
23. vgl. Brown, M. R.: Special Edition Internet, 1998, S. 15
15 Page 16 17
Einlußfaktoren und Gestaltungsrichtlinien
16
2.2.4 Anforderungen an Hypertextsysteme
Ein wesentlicher Teil der Arbeit der Erstellung eines Hypertextsystems bildet
die Unterteilung in sinnvolle Informationseinheiten bzw. Knoten. In der Spra-che
des WWW bedeutet dies: „Wie groß ist eine einzelne Seite?" Dies wird

auch mit dem Begriff der Granularität 24 umrissen. Hypertextsysteme haben
im allgemeinen nur begrenzt Platz für die Darstellung von Information. Dieser
hängt von Faktoren wie Monitorgröße, Auflösung, Schriftart, Schriftgröße ab.
Der Benutzer muß zu jedem Zeitpunkt darüber informiert sein, an welcher
Stelle im System er sich befindet und wie er von da aus an eine für ihn wich-tige

bzw. interessante Stelle gelangen kann. 25 Diese Anforderung resultiert
daraus, daß durch die Nichtlinearität von Hypertextsystemen eine Orientie-rung
an Seitenzahlen keinen Erfolg verspricht, weil der Nutzer an diese Stelle
gelangt ist, ohne notwendigerweise alle vorgelagerten Informationseinheiten
(Knoten) gelesen zu haben und weil immer nur ein kleiner Ausschnitt des
Hypertextsystems sichtbar ist. Dies führt oft zu dem von Conklin genannten
„Lost in Hyperspace".
Durch den verlorenen Überblick resultiert das Problem, den nächsten aus
einer Reihe vorhandener Verweise so zu wählen, daß die dadurch erreichte
Stelle dem Wunsch des Nutzers am nächsten kommt. Oft sind die vohande-nen
Hyperlinks nur mit dürftiger Semantik versehen. D. h. sie geben nur
schwach darüber Auskunft, zu welchem Knoten mit welcher Information sie
verweisen. Die Richtigkeit einer Auswahl kann der Nutzer nur durch das
Testen eines Links zweifelsfrei ermitteln. Dabei stellt sich wieder die Frage, bis
zu welcher Tiefe dies zu prüfen ist und bei eventuell negativem Entscheid die
Rückkehr zur Ausgangsposition erfolgen muß.
Oft ist dem Benutzer unbekannt, inwieweit er den Inhalt bereits erfahren hat
bzw. was ihm an zu Wissen noch fehlt. Selbst wenn alle Knoten eines
begrenzten Gebietes besucht worden sind, bleibt dies dem Nutzer möglicher-weise

verborgen. 26
Problematisch ist weiterhin das Zurücknavigieren aus den „Tiefen" eines
Hypertextes zu einem gewünschten Anfang. Im schlechtesten Fall hilft dabei
24. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 22
25. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 29
26. vgl. Feldkamp, J.: Kontextermittlung, 1996, S. 30 16
16 Page 17 18
Einlußfaktoren und Gestaltungsrichtlinien
17
nur ein Erinnern an den zurückgelegten Weg und dessen Verfolgung „rück-wärts".
Ein anderes Problem besteht darin, eine bereits erfahrene Information noch-mals
zu finden. Dabei kann es ebenfalls möglich sein, daß diese nur durch
Erinnern an den „damals" beschrittenen Weg erfolgen kann.
Ein Ausweg aus den beiden letztgenannten Problemen wäre die immerwäh-rende
Darstellung der jeweiligen Hierarchiestufen und die Navigation zu einer
der Stufen zurück. Weiterhin bieten viele Hypertextsysteme die Möglichkeit,
den über die vielen unterschiedlichen Verweise zurückgelegten Weg, in der
umgekehrten Schrittfolge rückwärts einzuschlagen.

2.2.5 Navigation
2.2.5.1 Einleitung
„Navigation [hier: die Festlegung der Navigationsmöglichkeiten] ist die Kunst,

für komplexe Strukturen einfache Lösungen zu schaffen". 27 In Hypertext-systemen
bezeichnet dies die Tätigkeit, die ein Benutzer durchführen muß,

um die gewünschte Information zu finden. 28 Es ist im Vergleich zu konventio-nellen
sequentiellen Texten teilweise schwieriger, Information zu finden, da es
-dem Prinzip von Hypertextsystemen folgend -meist viele Links zu anderen
Informationseinheiten gibt.
Bei einem Buch ist es selbstverständlich, daß es Seiten mit Information und
entsprechende Vorgänger und Nachfolger gibt. In Hypertextsystemen exi-stiert
das Prinzip der einzelnen Dokumente, die für sich alleine stehen können
müssen. Es ist daher ein wichtiger Aspekt bei der Gestaltung von Hypertext-systemen
im allgemeinen und Webseiten im besonderen, wie die Dokumente
strukturiert und welche Navigationsmöglichkeiten dem Nutzer zur Verfügung
gestellt werden.
Durch die meist weltweite Erreichbarkeit von Internetangeboten, können Per-sonen
mit unterschiedlichen Gewohnheiten, Fähigkeiten und Zielen auf das
System treffen. Es kann daher sinnvoll sein, verschiedene Navigationsmög-lichkeiten
anzubieten.

27. vgl. Hofer, K. C.; Zimmermann, H.: good webrations, 1998, S. 52
28. vgl. Weinreich, H.: Software-Ergonomie und das World Wide Web, http:// vsys-www.
informatik. uni-hamburg. de/ ergonomie/ index. html, 10/ 1999 17
17 Page 18 19
Einlußfaktoren und Gestaltungsrichtlinien
18
2.2.5.2 Navigationselemente
2.2.5.2.1 Browserfunktionalitäten
In die verschiedenen Browser für das Internet sind einige Funktionen zum
Navigieren implementiert. Am einleuchtendsten sind die Buttons zum Vor-und
Zurückbewegen. Diese orientieren sich nicht an der logischen Struktur
einer Website, sondern am Navigationspfad des Nutzers. Dabei ist es, meist
durch längeres Drücken der entsprechenden Buttons, eine Auswahl der
besuchten Seiten erscheint, möglich, über mehr als eine Seite vor-oder
zurückzunavigieren.
Ein anderes Element des Browsers ist das Eingabefeld zum direkten Einge-ben
einer bestimmten Adresse.
Um bereits gelesene Informationsabschnitte eines Hypertextsystems wieder-zufinden,
bieten Browser für das WWW die Möglichkeit, Bookmarks anzule-gen.
Durch Auswahl eines Bookmarks wird zu der entsprechenden Stelle im
System gesprungen. Die Bookmarks enthalten als Bezeichnung den Titel
(Text innerhalb des <TITLE>-Blocks im HTML-Code) der Webseite. Es ist
allerdings möglich, diese Bezeichnungen zu editieren und durch sinnvollere,
für den Nutzer leichter zu identifizierende Namen zu ersetzen.

2.2.5.2.2 Links
Das typische Merkmal eines Hypertext-Systems sind die assoziativen Links,
durch die die Dokumente miteinander verknüpft sind. Im WWW wird nur
zwischen zwei Arten von Links unterschieden. Einerseits gibt es sogenannte
Replacement Links, die einen Querverweis zu einem anderen Dokument dar-stellen
und Reference Links, welche eine Verbindung zu einer bestimmten
Stelle innerhalb eines Dokuments kennzeichnen. Die Unterschiede sind im

Webbrowser vom Nutzer nicht zu erkennen. 29 Zu unterscheiden sind meist
nur Links zu bereits besuchten Webseiten.

2.2.5.2.3 Inhaltsverzeichnis
Das aus Büchern hinlänglich bekannte Inhaltsverzeichnis ist für umfangreiche
Webauftritte sehr wichtig. Es sollte zumindest die ersten beiden Hierarchie-ebenen

der Verzweigungen enthalten. 30 29. vgl. Weinreich, H.: Software-Ergonomie und das World Wide Web, http:// vsys-www.
informatik. uni-hamburg. de/ ergonomie/ index. html, 10/ 1999 18
18 Page 19 20
Einlußfaktoren und Gestaltungsrichtlinien
19
2.2.5.2.4 Index
Ein Index ist bei umfangreichen Informationsangeboten eine gute Möglichkeit
der schnellen Navigation. Ohne durch verschiedene Hierarchieebenen
„durchzunavigieren", kann im Index auf wichtige Themen direkt zugegriffen
werden. Die Wahl der im Index aufgeführten Begriffe bzw. Verzweigungen
erfolgt durch den Anbieter. Es ist sinnvoll, einen Index alphabetisch zu organi-sieren.

2.2.5.2.5 Gesamtübersicht -Site-Map
Site-Maps enthalten eine Übersicht aller Knoten eines Hypermedia-Systems
bzw. einer Website und der Verbindungen zwischen diesen . Aufgeführt in
einem Dokument, können alle anderen vorhandenen Dokumente direkt
erreicht werden. Site-Maps werden dabei oft von Benutzern verwendet, die
mit der Struktur vertraut sind und schneller an die gesuchte Information
gelangen wollen.
Im Gegensatz dazu enthält ein Index Verzweigungen zu Dokumenten mit
bestimmten, vorher festgelegten Stichworten.

2.2.5.2.6 Guided Tour
Bei einer Guided Tour sind die Navigationsmöglichkeiten sehr eingeschränkt
bzw. stehen die möglichen Pfade zum Bewegen durch ein Hypermediesy-stem

fest. 31 Es sind meist nur die Möglichkeiten der Vor-oder Zurücknaviga-tion
vorhanden. Guided Tours werden oft zu Einführungszwecken von
komplexen Systemen verwendet. Diese Wege werden einmal festgelegt oder
in Abhängigkeit vom Nutzerverhalten dynamisch erzeugt.

2.2.5.2.7 Suchfunktionen
Eine andere Möglichkeit, um zur gewünschten Information in einem Hyper-textsytem
zu gelangen, ist die Eingabe von Abfragen. Diese werden vom
System abgearbeitet und liefern Knoten mit dem entsprechenden Inhalt. Im
WWW kann bei Suchmaschinen eine komplexe Abfrage oder ein ganzer Satz
eingegeben werden. Als selbstarbeitende Programme durchsuchen diese
systematisch das Internet nach Websites und katalogisieren deren Inhalt.
30. vgl. Neumeier, F.: Die perfekt Website, http:// www. zdnet. de/ internet/ artikel/ wdm/
199905/ homepagedesign02_ 00-wc. html, 03/ 1999
31. vgl. Steinmetz, R.: Multimedia-Technologie, 1999, S. 823 19
19 Page 20 21

Einlußfaktoren und Gestaltungsrichtlinien
20
Durch den Erfolg der Suchmaschinen im Internet wird deutlich, daß eine
Suchmöglichkeit zu den wichtigsten Navigationselementen zählt. Untersu-chungen
haben gezeigt, daß auch bei lokalen Angeboten nach erfolglosem
Navigieren über andere Navigationselemente schnell auf einen Suchindex

zurückgegriffen wird. 32

2.2.5.2.8 Softwareagenten
Durch die schnelle Zunahme der Zahl von Webseiten wird es ein Problem, die
gesuchte Information im Internet zu finden. Es kostet immer mehr Zeit und
auch Kapazität, die Datenmengen zu analysieren und Information zu erken-nen.
Eine Lösung für dieses Problem sind sogenannte Software-Agenten.
SATTLER definiert Softwareagenten wie folgt:
„Intelligenter Software-Agent := Software-Programm, das für einen Benutzer
bestimmte Aufgaben erledigen kann und dabei einen Grad an Intelligenz
besitzt, der es befähigt, seine Aufgaben in Teilen autonom durchzuführen und

mit seiner Umwelt auf sinnvolle Art und Weise zu interagieren." 33
Sie stellen ein Interface zur Mensch-Maschine-Kommunikation dar 34 , welche
in Abhängigkeit von Nutzerpräferenzen Vorschläge zu „lohnenden" Websites
erstellen. Beispielanwendungen finden sich im Internet unter

° http:// www. etour. com,
° http:// www. firefly. com.

2.2.6 Struktur der Website
2.2.6.1 Sequenz
Dies stellt die einfachste Methode zum Strukturieren von Information dar. Sie

entspricht einer linearen Darstellung. 35 Zur Unterstützung unerfahrener Nut-zer
bei der Navigation oder zur Einführung mittels einer Guided Tour eignet

sich diese Art der Dokumentenverknüpfung (vgl Abbildung 1). 36

32. vgl. Weinreich, H.: Software-Ergonomie und das World Wide Web, http:// vsys-www.
informatik. uni-hamburg. de/ ergonomie/ index. html, 10/ 1999
33. vgl. Sattler, K.: Software-Agenten zur Informationssuche und -filterung, 1998 S. 14
34. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 61
35. vgl. Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999
36. vgl. Hentrich, J.: Hypermedia Design, 1998, S: 57 20
20 Page 21 22

Einlußfaktoren und Gestaltungsrichtlinien
21
ABBILDUNG 1 Struktur einer Website als Sequenz
Quelle: In Anlehnung an Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/
index. html, 10/ 1999

2.2.6.2 Hierarchie
In Printerzeugnissen erscheinen Hierarchien oft in technischen oder wissen-schaftlichen

Veröffentlichungen. Der Vorteil dieser Strukturierung liegt im

leichten Verständnis für den Nutzer 37 und dem Zwang zur inhaltlichen Diszi-plinierung
seitens des Autors 38 . Websites sind von der Grundstruktur hierar-chisch
aufgebaut, weil die einzelnen Webseiten als „Abkömmlinge" einer
Homepage organisiert sind (vgl. Abbildung 2).

ABBILDUNG 2 Struktur einer Website als Hierarchie
Quelle: In Anlehnung an Hentrich, J.: Hypermedia Design, 1998, S. 45

2.2.6.3 Gitternetz
Gitternetzstrukturen sind für unerfahrene Benutzer des dargestellten Inhalts

oftmals nicht leicht zu verstehen. Sie sind geeignet für „hochgradig" einheitli-che
Strukturen von Themen und Unterthemen. Anwendungsbeispiel ist die
Darstellung eines linearen historischen Ablaufs von links nach rechts und eine
Unterteilung in Kategorien wie „Ereignisse", „Technologie" und „Kultur" von
oben nach unten für jeden skizzierten Zeitabschnitt.
37. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 57
38. vgl. Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999 21
21 Page 22 23

Einlußfaktoren und Gestaltungsrichtlinien
22
ABBILDUNG 3 Struktur einer Website als Gitternetz
Quelle: In Anlehnung an Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/
index. html, 10/ 1999

2.2.6.4 Spinnennetz
Nahezu ohne Einschränkung in den Verzweigungsmöglichkeiten stellt sich

diese Struktur von Websites dar. Zu finden sind solche auf Seiten mit sehr vie-len
verschiedenen Verzweigungen zu Dokumenten innerhalb und außerhalb
des sichtbaren Themengebietes. Erforderlich sind erfahrene Benutzer, die
zusätzliche Information zu einem an sich bekannten Schwerpunkt suchen

und keine grundlegenden Kenntnisse erlangen müssen (vgl Abbildung 4). 39

39. vgl. Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999 22
22 Page 23 24

Einlußfaktoren und Gestaltungsrichtlinien
23
ABBILDUNG 4 Struktur einer Website: Spinnennetz
Quelle: In Anlehnung an Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/
index. html, 10/ 1999

2.3 Das Übertragungsprotokoll
2.3.1 HTTP -Hypertext Transfer Protocol
HTTP ist das Standardprotokoll im Web. Jede Interaktion (Anfrage, Übertra-gung
etc.) besteht aus einer Anfrage, die im ASCII-Format übertragen wird.

Als Transportverbindung ist TCP üblich, aber nicht erforderlich. 40 Im Schich-tenmodell
ist HTTP auf der Verarbeitungsschicht angelagert, ebenso wie bei-spielsweise
die Protokolle (nicht zu verwechseln mit den Programmen)
TELNET (Terminal), FTP (Dateitransfer) oder SMTP (E-Mail). Eine Übersicht
über die Schichten und die zugehörigen Protokolle gibt Abbildung 5. Das
ebenso abgebildete OSI-Referenzmodell der Netzwerkschichten dient der
Vervollständigung. Erläuterungen dazu würden den Rahmen der Arbeit spren-gen
und inhaltlich zu weit führen (vgl. dazu Tanenbaum, A. S.: Computernetz-werke,
1998).

40. vgl. Tanenbaum, A. S.: Computernetzwerke, 1998 S. 726 23
23 Page 24 25
Einlußfaktoren und Gestaltungsrichtlinien
24
ABBILDUNG 5 OSI, TCP/ IP und dessen Protokolle
In Anlehnung an Tanenbaum, A. S.: Computernetzwerke, 1998 S. 54, 55

Unter Server wird allgemein ein Computer mit administrativer Software ver-standen,
der den Zugriff auf ein Netzwerk und dessen Ressoucen steuert und
diese für die angeschlossene Arbeitsplatzstationen zur Verfügung stellt. Im
Internet ist ein Server ein Computer, der auf die Anfrage eines Client antwortet

und bspw. eine Kopie einer Datei an den Client sendet. 41
Ein Client in einem lokalen Netzwerk oder im Internet ist ein Computer, der auf

die vom Server zur Verfügung gestellten Netzwerkressourcen zugreift. 42

Eine weitere Komponente von HTTP ist, daß Abfrage und Anzeige der Daten
voneinander getrennt sind. 43 Das heißt, daß der Server von der Arbeit der
Anzeige nicht belastet wird. Diese übernimmt der Client.

41. Computer Fachlexikon Facwörterbuch, S. 577
42. Computer Fachlexikon Facwörterbuch, S. 132
43. vgl. Powers, S.: Dynamic Web Publishing, München, 1998, S. 33 24
24 Page 25 26
Einlußfaktoren und Gestaltungsrichtlinien
25
2.3.2 URL -Uniform Ressource Locator
2.3.2.1 Einleitung
Der URL definiert alle Übertragunsmodalitäten einer Datei. Zur Anzeige eines

HTML-Dokuments und seiner Inhalte sind drei Elemente bedeutsam.

1. Wie kann auf die Datei zugegriffen werden (Protokoll)?
2. Wo befindet sich die Datei (Host)?
3. Welche Datei ist gemeint (Dateiname mit Pfad)?
Am Beispiel der URL http:// www. uni-leipzig. de/~ akw soll dies erläu-tert
werden.
http:// gibt an, daß als Übertragungsprotokoll dieser Datei HTTP gewählt wird.
Es sind andere möglich (ftp://, gopher://, news://).
Mit www. uni-leipzig. de wird der Computer angegeben, auf welchem sich die
gesuchte Datei befindet.
~akw spezifiziert die Datei mit Pfad. Hier läßt sich erkennen, daß das URL-Konzept
mehr ist als ein einfacher Verweis auf ein Dokument. Durch das vor-angestellt
Zeichen '~ ' wird festgelegt, daß im Verzeichnis des Users eine fest
eingestellte Datei (meist index. html oder index. htm, jede beliebige möglich)
geöffnet werden soll. akw kennzeichnet den Benutzernamen auf dem Compu-ter.

2.3.2.2 Gestaltungsprinzipien des URL
Ziel ist es, einen leicht zu merkenden und einfach zu verstehenden URL zu fin-den.

Dies erreicht man durch Verzicht von ungewöhnlichen Abkürzungen und

dem sparsamen Umgang mit Sonderzeichen. 44 Ein anderes Kriterium ist die
Beachtung der Groß-und Kleinschreibung. Auf Unixsystemen signifikant,
sollte grundsätzlich die leichter zu lesende Kleinschreibung verwendet wer-den.
45

44. Viele Nutzer wissen nicht, wie das oft anzutreffende Zeichen '~ ' überhaupt eingege-ben
werden kann.
45. vgl. Weinreich, H.: Software-Ergonomie und das World Wide Web, http:// vsys-www.
informatik. uni-hamburg. de/ ergonomie/ index. html, 10/ 1999 25
25 Page 26 27
Einlußfaktoren und Gestaltungsrichtlinien
26
2.3.3 Ablauf der Abfrage einer Seite
Die Abfrage einer Datei verläuft in nachfolgend skizzierten Schritten.

1. Browser ermittelt den URL.
2. Browser fragt den Domain-Name-Service-Server (DNS) nach der IP-Adresse
abgeleitet aus dem URL.

3. DNS-Server gibt die Adresse zurück.
4. Browser sendet Befehl zum Erhalten der gewünschten Datei an den
entsprechenden Server.

5. Server sendet die Datei.
6. Browser zeigt den Inhalt der Datei an.
HTTP ist ein verbindungsloses Protokoll.
Enthält eine angeforderte Datei zusätzliche Elemente wie Grafiken, Sound-Information
oder Animationen, muß für jedes eine eigene TCP/ IP-Verbindung
aufgebaut werden. Das wiederholte Aufbauen, Übertragen und Lösen von
Verbindungen ist nicht effizient (vereinfacht aber die Implementierung des

Protokolls). 46
Es dauert länger, viele kleinere Grafiken im Vergleich zu einer in der Summe
hinsichtlich der Dateigröße ebensogroßen Grafik zu laden. Werden für Navi-gationselemente
Grafiken verwendet, ist hinsichtlich der Entwicklung von
Gestaltungsrichtlinien im Einzelfall zu testen, ob der Einsatz von Image-Maps
performanter ist.

2.4 HTML
2.4.1 Einleitung
HTML ist eine Anwendung oder eine sogenannte Document Type Definition

(DTD) von SGML. HTML wird durch diese DTD definiert. 47 Es erscheint daher
wichtig, näher auf SGML einzugehen.
Aus Platzgründen soll auf Ausführungen zu der Arbeitsweise von HTML, der
Struktur von HTML-Dokumenten und der Verwendung von Anweisungen
(Tags) verzichtet.

46. vgl. Tanenbaum, A. S.: Computernetzwerke, 1998 S. 723
47. vgl. Assfalg, R.; Goebels, U.; Welter, H.: Internet-Datenbanken, 1998, S. 26 26
26 Page 27 28
Einlußfaktoren und Gestaltungsrichtlinien
27
2.4.2 SGML
2.4.2.1 Einleitung
Grundgedanke bei der Entwicklung der Standard Generalized Markup Lan-guage

(SGML) war, den Inhalt eines Dokuments von seinem Erscheinungs-bild

zu trennen. 48 Entwickelt wurde SGML von Charles Goldlieb im Jahre
1988 und ist standardisiert in der ISO-Norm 8879. 49
Der Ausgangspunkt für die Entwicklung waren Defizite herkömmlicher Text-verarbeitungen
und Publishing-Tools: Sie setzen durch Steuercodes Marken
zur Auszeichung bestimmter Textstellen. So wird eine Überschrift bspw. defi-niert
durch Schriftart, -größe und Attribute wie fett, kursiv, unterstrichen etc.
Auf diese Art werden alle Absätze formatiert. Der Ursprung dieser Art der
Gestaltung liegt im nichtelektronischen Publizieren. Zu dieser Zeit überarbei-teten
der Korrektor und der Layouter Abhandlungen und setzten „mit dem
Rotstift" Bemerkungen zum späteren Aussehen des Dokuments. In der Druk-kerei
übernahm der Setzer diese Markierungen und das Dokument konnte
erstellt werden. Auch in modernen Textverarbeitungsprogrammen funktioniert
dies noch genauso, die Formatierung kann allerdings der Autor selbst vor-nehmen.
Der Nachteil dieser Vorgehensweise war, daß somit das Erschei-nungsbild
des Dokuments für immer feststand. Um einer Überschrift ein
neues Aussehen zu verleihen, muß die Applikation, mit der das Dokument
erstellt wurde, erneut gestartet und die Formatierung entsprechend gändert
werden.
SGML legt nicht die Art der Formatierung fest, es beschreibt die Struktur und
die Art der Elemente, die zum Einsatz kommen. Anders formuliert, beschreibt

SGML die logische Struktur von Texten maschinenunabhängig. 50 Unter
SGML wird bei einer Überschrift also lediglich festgelegt, daß es sich um eine
solche handelt und welche Hierarchiestufe sie innehat. Ebenso geschieht
dies mit allen unterschiedlichen Textelementen. Eine Applikation, die SGML-Dokumente

lesen kann („ Parser" 51 ), ist dann in der Lage, selbst das Erschei-48.
vgl Behme, H.; Mintert, S.: XML in der Praxis, 1998, S. 32
49. vgl. Breunig, F.: Ende der Statik in Sicht, http:// www. zdnet. de/ internet/ artikel/ html/
9804/ xml_ 00-wc. html, 08/ 1999
50. vgl. Breunig, F.: Ende der Statik in Sicht, http:// www. zdnet. de/ internet/ artikel/ html/
9804/ xml_ 01-wc. html, 08/ 1999
51. vgl. Breunig, F.: Ende der Statik in Sicht, http:// www. zdnet. de/ internet/ artikel/ html/
9804/ xml_ 02-wc. html, 08/ 1999? 27
27 Page 28 29
Einlußfaktoren und Gestaltungsrichtlinien
28
nungsbild der einzelnen Überschriften, Fußnoten etc. festzulegen. Diese
Anwendung ist dann maschinenabhängig. Basis ist dabei die sogenannte
DTD-Datei.

2.4.2.2 DTD
DTD steht für Document Type Definition und beschreibt die Struktur eines

Dokuments. 52 Das grundlegende Gerüst, also die enthaltenen Elementety-pen,
werden darin definiert. Das zugehörige Inhaltsdokument wird mit soge-nannten
Tags oder Markierungen versehen, die die entsprechenden
Textstellen als Element eines bestimmten Typs ausweist. HTML ist ein solcher
DTD und beinhaltet eine Sammlung von Textauszeichnungen, die nach SGML
festgelegt sind.

2.4.3 Entstehung von HTML
Entstanden ist HTML aus der Arbeit am CERN (Centre Européen pour la
Recherche Nucléaire), dem europäischen Kernforschungszentrum in der
Nähe von Genf, Schweiz. Die dortige Forschungsarbeit involvierte viele Mitar-beiter,
die sich zeitweise an geografisch unterschiedlichen Arbeitsstellen auf-hielten.
Es bestand die Notwendigkeit, an gemeinsamen Projekten zu
arbeiten und verschiedenste Dokumente (Berichte, Zeichnungen, Fotos) aus-zutauschen.

Tim Berners-Lee, damals Physiker am CERN, schlug im März 1989 ein aus
verknüpften Dokumenten bestehendes Netz vor. Daraufhin entstand ein Pro-totyp
und eine erste öffentliche Präsentation erfolgte auf der Hypertext'91 in
San Antonio, Texas.
Die erste grafische Benutzeroberfläche für dieses Netz war das Programm
'XMosaic', welches Marc Andreesen 1993 am NCSA (National Center for
Supercomputing Applications) entwickelte. Aus diesem Produkt wurde nach
der Ausgründung der Firma „Netscape" der bekannte Browser „Netscape
Navigator".
1994 wurde durch das MIT (Massachusetts Institut of Technology) und das
CERN das World Wide Web Consortium (W3C) gegründet, welches sich mit

der Weiterentwicklung und Standardisierung des WWW beschäftigt. 53 52. vgl. Powers, S.: Dynamic Web Publishing, München, 1998, S. 58
53. vgl. Tanenbaum, A. S.: Computernetzwerke, 1998 S. 719 ff 28
28 Page 29 30
Einlußfaktoren und Gestaltungsrichtlinien
29
2.4.4 Zukünftige Entwicklungen
2.4.4.1 Document Object Model
Dem Wunsch vieler Entwickler und Anwender nach mehr Interaktivität und

nachträglicher Veränderung (Dynamik) des Layouts einer Webseite wurde mit
den Document Object Model (DOM) nachgegangen. Von Microsoft entwickelt
und in den Internet-Explorer 4. x integriert, ist DOM seit dem 01.10.1998 eine

offizielle Empfehlung des W3-Konsortiums. 54
Die Philosophie des DOM besteht darin, alle HTML-Tags als eigenständige
Objekte ansprechen zu können und Attribute nachträglich zu verändern.
Dazu muß mit einer Scriptsprache wie JavaScript gezielt auf bestimmte
HTML-Elemente zugegriffen werden können. Beispielsweise ist es möglich,
die Größenangabe eines Font-Tags und damit die dargestellte Schriftgröße
nachträglich zu verändern oder bestimmte Teilbereiche einer Seite zu

löschen. 55
Momentan ist das DOM nur von Microsoft für dessen Browser Internet Explo-rer
weitgehend umgesetzt. Netscape wird erst ab der Generation 5. x seines
Browsers eine ähnlich weitreichende Implementierung anbieten.

2.4.4.2 Cascading Style Sheets
Für viele Webdesigner waren die durch den HTML-Standard definierten

Gestaltungmöglichkeiten nicht ausreichend. Während Textverarbeitungssy-steme
und Publishingtools die volle Kontrolle über nahezu alle Texteigen-schaften
bieten, konnte mit HTML nur sehr begrenzt Text gestaltet werden.
Die Schriftgröße orientierte sich an den Browsereinstellungen und war in drei
Stufen zu vergrößern bzw. zu verkleinern. Mit CSS hat der Designer die volle
Kontrolle über den Text.

2.4.5 XML
2.4.5.1 Einführung
Im Gegensatz zu HTML, welches eine Anwendung oder eine DTD von SGML

darstellt, ist XML (eXtensible Markup Language) eine Untermenge und Verein-fachung
von SGML, entstanden unter der Koordinierung des W3-Konsorti-54. Eike, U.: Document Object Model, http:// www. zdnet. de/ internet/ artikel/ scene/ 199812/
dom01_ 00-wc. html, 05/ 1999
55. Eike, U.: Document Object Model, http:// www. zdnet. de/ internet/ artikel/ scene/ 199812/
dom01_ 00-wc. html, 05/ 1999 29
29 Page 30 31

Einlußfaktoren und Gestaltungsrichtlinien
30
ums. Ziel war die Mächtigkeit von SGML zur Strukturbeschreibung von
Dokumenten zu operationalisieren. 56 Eine Übersicht gibt Abbildung 6.

ABBILDUNG 6 SGML, XML und HTML
(Quelle: vgl Behme, H.; Mintert, S.: XML in der Praxis, 1998, S. 17)

Für viele HTML-Programmierer 57 waren die Möglichkeiten von HTML nicht
groß genug. Für die Wiedergabe von Texten ist HTML ausreichend. Bei der
Entwicklung aufwendiger Layouts und interaktiver Elemente sind die Grenzen

von HTML allerdings schnell erreicht. 58 Entsprechend dem Wunsch vieler
Entwickler, wurden von den Browserherstellern immer wieder neue HTML-Tags
in die verschiedenen Browserversionen implementiert und meist nach-träglich
von W3-Konsortium standardisiert. SGML stellt aber sehr hohe Anfor-derungen
an die Einarbeitungszeit und erweist sich für das WWW als zu
mächtig. Eine Vereingung der jeweiligen Vorzüge lag daher nahe. Das W3C
nahm sich dieser Problematik an, und es entstand XML.
Dabei ist XML ebenso wie SGML eine Metasprache zur Festlegung der Syntax
eines Dokumententypes. Im Gegensatz zu HTML, welches sich primär mit der
Anzeige auf verschiedenen Ausgabegeräten befaßt, liefert XML Information,
wie die im Dokument enthaltenen Daten weiter verarbeitet werden können.

56. vgl. Lobin, H.: Text im digitalen Medium, 1999 S. 111
57. Es bleibt weiterhin zu klären, ob es sich bei der Codieren von HTML um Programmie-ren
handelt. Wenn man dieses Vorgehen mit beispielsweise der Textverarbeitung
WordStar 4 vergleicht, wird man beim Festlegen von Textstilen Ähnlichkeiten entdek-ken.
Wahrscheinlich legen vor allem Softwareentwickler Wert darauf, dabei Unter-scheidungen
vorzunehmen.
58. vgl. Breunig, F.: Ende der Statik in Sicht, http:// www. zdnet. de/ internet/ artikel/ html/
9804/ xml_ 00-wc. html, 08/ 1999 30
30 Page 31 32
Einlußfaktoren und Gestaltungsrichtlinien
31
Der letztlich entscheidende Vorteil von XML gegenüber HTML ist dessen Fle-xibilität.
Es wird möglich sein, eigene Anweisungen (Tags) zu entwickeln.

2.4.5.2 Links in XML
Die Definition von Links in XML beschreibt die XML Linking Language (XLink).

Links können Attribute aller Elemente sein. Dabei steht es dem Benutzer frei,
ein eingenes Set von Linktypen für unterschiedliche Ausgabemedien zu defi-nieren.
59

2.4.5.3 Layout mit XML
Die mit XML definierte logische Struktur mittels Formatierungsanweisungen

wird durch die eXtensible Style Language (XSL) ergänzt. 60 XSL ist eine Erwei-terung
der unter HTML verwendbaren Cascading Style Sheets (CSS), die für
jedes mit XML definierte Element Formatierungsangaben (Farbe, Schriftart,

Rand etc.) ermöglicht. 61

2.4.5.4 Beispiel
Ein XML-Beispiel, welches die zahlreichen Möglichkeiten demonstriert, ist im

Anhang zu finden.

2.4.6 Frames
Frames stellen eine einfache Methode zur Unterteilung der Webseite in zwei
oder mehr getrennte Bereiche dar. „Getrennt" bedeutet, daß die verschiede-nen
Frames sich wie eigenständige Webseiten verhalten können. Am häufig-sten
wird diese Technik genutzt, um den Navigations-bereich vom
eigentlichen Inhalt zu trennen. Es wird nur eine Seite mit den Verweisen in
den dafür vorgesehenen Frame geladen und muß, so lange man sich auf die-ser
Website aufhält, nicht erneut geladen werden.
Frames bieten eine hohe Flexibilität bzgl. der Erweiterbarkeit des Navigations-bereiches.
Kommt ein Dokument hinzu, muß lediglich die Webseite, die die
Verweise enthält, erweitert werden.

59. vgl. Lobin, H.: Text im digitalen Medium, 1999 S. 111
60. vgl. Lobin, H.: Text im digitalen Medium, 1999 S. 112
61. vgl. Lobin, H.: Text im digitalen Medium, 1999 S. 112 31
31 Page 32 33
Einlußfaktoren und Gestaltungsrichtlinien
32
Die Performanz kann sich durch den Einsatz von Frames ebenfalls verbes-sern.
Der Navigationsbereich wird nur einmal geladen. Bei framelosen Seiten
bspw. in einer Tabelle, muß dieser jeweils neu aufgebaut werden.

Frames haben auch Nachteile.
Bookmarks auf Unterseiten sind nur noch schwer zu setzen. Ohne Benutzer-eingriffe,
wie das Öffnen der Unterseite in einem neuen Fenster ohne den
Navigationsframe, würde immer die Webseite, die die Framesetdefinition
beinhaltet, als Bookmark aufgenommen werden.
Suchsysteme können nur einzelne Seiten indizieren bzw. in ihren Bestand
aufnehmen. Wählt man gefundene Resultate eines Suchdienstes an, dann

wird die Webseite ohne das zugehörige Frameset geladen. 62 Das kann funk-tionale
und optische Einbußen bedeuten.
Das Ausdrucken von Frames ist für unerfahrene Nutzer nicht einfach. Es ist
nicht sofort klar, daß moderne Browser die Möglichkeit bieten, bestimmte
Unterseiten eines Framesets zum Ausdrucken anzuwählen oder daß sich die

Seite in einem neuen Fenster öffnen läßt. 63

2.4.7 Tabellen
Bei der Gestaltung im Internet haben Tabellen oft eine andere Funktion als die
übersichtliche Darstellung von Zahlenmaterial. Durch die Möglichkeit, die
Mindestgröße einer Tabelle oder einer einzelnen Zelle in Prozentangaben
oder Pixeln anzugeben, werden Tabellen auch zum direkten Gestalten ver-wendet.
Durch dieses Darstellungsmittel läßt sich ansatzweise das direkte
Positionieren, welches erst im HTML-Standard 4.0 vorgesehen ist, „emulie-ren".

Die Verwendung von Tabellen hat aber auch Nachteile. Zum einen führt die
Verwendung von Größenangaben, die immer Mindestgrößen darstellen,
dazu, daß bei zu kleiner Bildschirmauflösung gescrollt werden muß. Zum
anderen müssen Tabellen immer erst komplett geladen sein, damit sie im
Browser dargestellt werden können. Dies ergibt sich zwangsläufig, weil der
Browser „nicht wissen kann", welche Größen der Tabelle sich für eventuell 62. Dieser Nachteil kann durch den Einsatz von Javscript umgangen werden.

63. vgl. Nielsen, J.: Warum Frames schlecht sind, http:// www. useit. com/ alertbox/
9612. html, 10/ 1999 32
32 Page 33 34
Einlußfaktoren und Gestaltungsrichtlinien
33
noch nicht geladene Elemente ergeben. Ist eine komplette Seite in einer
Tabelle untergebracht, muß diese erst komplett geladen sein, bis sie der

Betrachter angezeigt bekommt. 64

2.4.8 Ein-Pixel-Gifs
Für diese Art der Beeinflussung des Aussehens von Webseiten gibt es sogar

einen namentlichen Erfinder: David Siegel. 65 Diese Art der Formatierung ist
sehr weit verbreitet und wird in zahlreichen Lehrbüchern empfohlen. 66 Es
werden transparente Gif-Dateien verwendet, deren Größe 1x1 Pixel beträgt.
Durch die Transparenz sind die Grafiken im Browserfenster nicht sichtbar und
durch die geringe Größe wird eine minimale Übertragungszeit garantiert.
Durch die Möglichkeit, die Höhe und Breite einer Grafik in HTML zu ändern,
wie bspw.

<IMG SRC=" Bilder/ 1x1. gif" WIDTH= 10 HEIGHT= 10>können so beliebige Leerräume zum Gestalten geschaffen werden. Häufige
Verwendung findet diese Technik, um den Zeilenabstand zu regulieren. Ohne
Cascading Style Sheets ist es in HTML nicht möglich, auf den Zeilenabstand
durch Textoptionen Einfluß zu nehmen. Um dies mit Ein-Pixel-Gifs zu errei-chen,
wird zwischen den einzelnen Zeilen eine Grafik mit der gewünsten
Höhe und ausreichender Breite eingefügt. Ein ähnlichen Effekt kann erreicht
werden, wenn die Angaben HSPACE und VSPACE des <IMG>-Tags verwen-det
werden. Diese regeln den Abstand andere Seitenelemente zu der Grafik,
anstatt das Gif auf die entsprechenden Größe auszudehnen.

2.5 Menschliche Informationsverarbeitung
2.5.1 Einleitung
Bei der Erstellung von Benutzeroberflächen sind die Möglichkeiten und vor
allem auch die Grenzen der menschlichen Informationsverarbeitung zu
berücksichtigen. Ziel ist immer der einfache Informationsaustausch mit dem

Präsentationsmedium. 67 Es können nicht alle Aspekte der menschlichen 64. Web Design -Praxis der Seitengestaltung im WWW, S. 67
65. Lie, H. W.; Boss, B.: Cascading Style Sheets, 1997, S. 283,
66. Lie, H. W.; Boss, B.: Cascading Style Sheets, 1997, S. 283; Web Graphics, S. 209;
Webdsign der Profis, S. 112 33
33 Page 34 35
Einlußfaktoren und Gestaltungsrichtlinien
34
Informationsverarbeitung angesprochen werden. Dies würde, vor allem um
medizinische Korrektheit bemüht, den Rahmen verlassen.

2.5.2 Informationsverarbeitung
2.5.2.1 Gehirn
Das menschliche Gehirn ist in 2 Hälften aufgeteilt. Die linke ist das Sprachzen-trum

und zuständig für das Lesen. Sie ist mit der rechten Hand „verbunden"
und alle Informationen aus dem rechten Blickfeld gelangen in diese Hälfte.
Die rechte ist mit dem räumlichen Vorstellungsvermögen betraut, verbunden
mit der linken Hand und dem linken Blickfeld. Die Auswirkungen lassen sich
wie folgt skizzieren. Plaziert der Gestalter eine Grafik auf der rechten Seite,
gelangt sie zunächst in die linke Gehirnhälfte. Dort kann sie nicht verarbeitet
werden und muß in die rechte Hälfte des Gehirns weitergeleitet werden. Dies
kostet zusätzliche Zeit. Genauso verhält es sich mit dem Anordnen von Fließ-text
auf der linken Seitenhälfte einer Webseite. Die Information gelangt in die
falsche, rechte Gehirnhälfte und muß zum Verstehen in die linke geschickt

werden. 68

2.5.2.2 Sehen
Das Sehen ist das Einwirken eines Reizes auf die Sinneszellen im abbilden-den

System (Auge), die Umwandlung des Reizes in eine physiologische Erre-gung,
deren Weiterleitung über die Nervenbahnen sowie die Entstehung
eines Wahrnehmungsbildes im Sehzentrum. Das Wahrnehmungsbild ist
dabei nicht nur die Umwandlung der eingehenden Information, sondern der
deren Zusammenbau mit im Gehirn gespeicherter Information. Die Verarbei-tung
der auf die Netzhaut eingehenden Strahlung geschieht über die dabei

gereizten Sinneszellen auf photochemischen Weg. 69
Wichtig ist bei der Gestaltung jeder Art von Präsentationen, daß die besonde-ren
Eigenschaften der menschlichen Wahrnehmung berücksichtigt werden.
Am Anfang ist das Erkennen von Information. Mit hoher Schärfe erlaubt das
menschliche Auge das Sehen in einem Bereich von etwa 2 Grad um den von
den Augen fixierten und auf die Netzhaut projizierten Punkt. Bei einem

67. vgl. Lehrbuch der Softwaretechnik, S. 544
68. vgl. Hofer, K. C.; Zimmermann, H.: good webrations, 1998, S. 32
69. vgl. Lenk, R.: Physik, 1989 S. 871 ff. 34
34 Page 35 36
Einlußfaktoren und Gestaltungsrichtlinien
35
Abstand von 60 cm zum betrachteten Medium ist dies ein Bereich von unge-fähr
2,1 cm um den Fixationspunkt, der scharf erkannt werden kann. 70 Im wei-teren
Radius um diesen Bereich nimmt das Schärfesehen und die
Farbwahrnehmung ab, es steigt die Empfindlichkeit für das Sehen von Bewe-gungen.

Um einen großen Bereich in seinen Einzelheiten zu betrachten, muß das Bild
in Teilbereiche zerlegt und danach zu einem Gesamteindruck zusammenge-fügt
werden. Der Weg der Fixationspunkte wird durch die Grobstruktur oder

durch die Erwartungshaltung bestimmt. 71 Sind keine Grobstrukturen zum Lei-ten
des Blickes vorhanden, kann die Erfassung nicht zielgerichtet erfolgen.
Diese Orientierungshilfen bzw. -information erreicht man durch die geeignete
visuelle Gestaltung. Dies bedeutet, daß Detailinformationen in klare Struktu-ren
eingebettet werden sollten. Exemplarisch kann hier die Fenstertechnik
von grafischen Benutzeroberflächen genannt werden. Durch einen markanten
Rahmen umgeben, begrenzt dieser ein Anwendungs-oder Dialogfenster.
Farbe entsteht durch die Reflexion sichtbarer elektromagnetischer Wellen an
Gegenstände der Umwelt. Die elektromagenetischen Wellen werden von
einer Lichtquelle ausgesandt. Physikalisch ist Farbe ein bestimmter Teil im

sogenannten „sichtbaren" Bereich des elektromagnetischen Spektrums. 72

2.5.3 Grundlayout
Sehr wichtig für den Betrachter einer Präsentation ist das Grundlayout. Es
beschreibt die Aufteilung der Seite und die enthaltenen Kontraste. Dabei
kommt zum Tragen, daß der Leser eine Seite zunächst als rein grafisches
Muster wahrnimmt und erst danach Detailinformationen sucht. Ein durch-dachtes
Layout kann die gebotene Information organisieren helfen und die
Navigation erleichtern. Nicht passende Schriften, zu viele Schriftarten, zu viele

Farben erschweren den Erkennungsprozeß. 73

70. vgl. Lehrbuch der Softwaretechnik, S. 545
71. vgl. Lehrbuch der Softwaretechnik, S. 545
72. vgl. Lenk, R.: Physik, 1989 S. 278
73. vgl. Breunig, F.: Ende der Statik in Sicht, http:// www. zdnet. de/ internet/ artikel/ html/
9804/ xml_ 00-wc. html, 08/ 1999 35
35 Page 36 37

Einlußfaktoren und Gestaltungsrichtlinien
36
2.5.4 Verwendung von Farben
2.5.4.1 Farbmodelle
Eine grundsätzliche Unterteilung erfolgt bei Farben hinsichtlich Schmuckfar-ben

und Mischfarben. Schmuckfarben sind fertige, von verschiedenen Her-stellern
angebotene Farbtöne, die in verschiedenen Helligkeitsstufen

gedruckt werden können. 74 Mischfarben erlauben die Bereitstellung jeder
beliebigen Farbnuance durch das Verbinden bestimmter Anteile einer Grund-farbe.
Die Einteilung von Mischfarben nach Farbmodellen begründet sich in
den unterschiedlichen Einsatzgebieten.

2.5.4.1.1 RGB
RGB ist die Zusammenfassung der Worte Red-Green-Blue. Hierbei handelt es
sich um ein sogenanntes „additives" Farbmodell. Die gewünschte Farbe ent-steht
durch das Übereinanderprojizieren verschiedener Anteile an Rot, Grün
und Blau. Eingesetzt wird dieses Farbmodell überall dort, wo lichtaussen-dende
Geräte verwendet werden. Dies ist bspw. bei Computermonitoren und

beim Scannen 75 der Fall.

2.5.4.1.2 CMYK
Im Gegensatz zu RGB ist das CMYK-Farbmodell ein subtraktives. Es werden
die Grundfarben Zyan (C), Magente (M), Gelb (Y) und Schwarz (K) verwendet.
Es ist deshalb subtraktiv, weil sich die Mischfarben aus dem „Nichtvorhan-densein"
von Farbanteilen ergeben. Zusammengenommen (Zyan, Mangenta,
Gelb mit jeweils vollem Anteil) ergibt sich Schwarz, kein Anteil entspricht weiß
(Papier). Verwendet wird dieses Modell dort, wo Farbe als stoffliches Material
und nicht als Licht eingesetzt ist. Eine weiße Fläche entsteht also durch Nicht-drucken
an ebendieser Stelle, es erscheint keine Farbe.
Eine grafische Darstellung der Unterschiede zwischen RGB und CMYK ist
Abbildung 7 zu entnehmen.

74. vgl. Dutt, C.; Schmithäuser, M.: Der neue Desktop-Knigge, 1996, S. 158
75. Beim Scannen wird das von einer Lichtquelle ausgesandte Licht vom zu scannenden
Dokument reflektiert und dadurch dessen optischer Inhalt durch Sensoren erfaßt. 36
36 Page 37 38
Einlußfaktoren und Gestaltungsrichtlinien
37
ABBILDUNG 7 RGB und CMYK im Vergleich
Quelle: Adobe Systems Incorporated: Photoshop Color Management, S. 3

Die linke Grafik stellt das RGB-Farbmodell (alle Farben zusammen ergeben
weiß) dar und die rechte CMYK (alle Farben zusammen ergeben schwarz).

2.5.4.1.3 Indizierte Farben -Farbpaletten
Dieses nur in der Computertechnik verwendete Farbmodell umfaßt lediglich
256 Farben. Ziel ist es, die Datenmenge von Bildern zu reduzieren. Es wird
von einer Farbpalette mit 256 Einträgen ausgegangen. Jeder dieser Einträge
entspricht einer Mischfarbe. Ändert man einen Farbwert, dann ändern sich
alle anderem Farben ebenfalls. Für die Druckausgabe ist dieses Farbmodell
nicht geeignet.

2.5.4.1.4 Weitere Farbmodelle
Andere Modelle, die nur am Rande erwähnt werden sollen, sind beispiels-weise
das HSB-Modell und Graustufen.
Das HSB-Modell erzeugt Farben aus den Werten Farbton (H= Hue), Sättigung
(S= Saturation) und Helligkeit (B= Brightness).
Graustufen dienen der Darstellung farbloser Bilder, es existieren dabei 256
verschiedene Graustufen von 0= Schwarz und 255= Weiß.

2.5.4.2 Regeln für den Einsatz von Farben
Grundsätzlich werden farbige Darstellungen gegenüber monochromatischen

Darstellungen als angenehmer, hilfreicher oder ästhetisch ansprechender
betrachtet. Oft geschieht dies, obwohl Farbigkeit die Performanz der Arbeit

nicht erhöht. 76 Die Empfehlungen für die Verwendung von Farben stammen

76. vgl. Wandmacher, J.: Software-Ergonomie, 1992 S. 311 37
37 Page 38 39

Einlußfaktoren und Gestaltungsrichtlinien
38
aus einem Buch des Gebietes der Informatik 77 , sie finden allerdings auch
Anwendung bei Veröffentlichungen auf Papier.

° Farbunterschiede sind sparsam einzusetzen, sie lenken die Aufmerk-samkeit
stark.

° Die Anzahl der Farben sollte nicht mehr als sieben betragen.
° Die grafische Gestaltung, die logische und relevante Beziehungen
ausdrückt, sollte ohne Zuhilfenahme von Farbelementen erfolgen.
Das heißt, daß die Festlegung des Layouts im Vorfeld monochroma-tisch
durchgeführt werden kann. Farbe ist ein hilfreiches, aber kein

ausreichendes Gestaltungsmittel. 78
° Es empfiehlt sich eine konsistente, an Konventionen orientierte Ver-wendung.
So kann Rot für „Halt", „Gefahr", Blau für „Kalt", Grün für
„Weiter" oder „sicher" und Gelb für „Vorsicht" o. ä. verwendet wer-den.
Die Konventionen sind abhängig vom Kulturkreis (siehe Tabelle
1 auf Seite 39).

° Ein gleichzeitiger Einsatz von hochgesättigten und spektral gegen-sätzlichen
Farben wie Rot und Blau sollte nicht stattfinden.

° Farbunterscheidungen sind durch Rot-Grün und Gelb-Blau besser zu
realisieren als Rot-Blau, Rot-Gelb oder Grün-Gelb, Grün-Blau

° Die am besten lesbaren Farbkombinationen sind schwarz auf weiß
oder schwarz auf gelb. Dabei gibt es keine eindeutigen Unterschiede
in der Lesbarkeit zwischen Schriften mit negativen Polarität (hell auf

dunklem Grund) und positiver Polarität (dunkel auf hellem Grund). 79
° Im zentralen Bereich ist Rot/ Grün besser geeignet als Gelb/ Blau, wel-ches
in äußeren Bereichen der Darstellung eingesetzt werden sollte.

° Ältere Benutzer benötigen größere Helligkeiten für die Farbunter-scheidung.

77. vgl. Lehrbuch der Softwaretechnik, S. 577
78. vgl. Ziegler, H.; Ilg, R.: Benutzergerechte Softwaregestaltung, 1993, S. 60
79. vgl. Wirth, T.: Kommunikationsdesign, http:// www. kommdesign. de, 10/ 1999 38
38 Page 39 40
Einlußfaktoren und Gestaltungsrichtlinien
39
2.5.5 Typographie
2.5.5.1 Einleitung
Typographie ist die Kunst, richtige Abstände und Proportionen für Texte zu fin-den.

Das Ziel ist dabei eine optimale Lesbarkeit. 80 Es ist nicht möglich, einen
vollständigen Überblick über die Gebiete der Schriftarten, Schriftmischungen,
Absatzgestaltung oder der richtigen Papierformate zu geben. Abhandlungen
darüber sind Gegenstand umfangreicher Bücher und Teil kompletter Studien-gänge.
Wissen über dieses Gebiet ist aber auch beim Publizieren in elektroni-schen
Medien äußerst wichtig.

2.5.5.2 Schriftarten
Einem Gestalter aus dem Bereich des Papierdruckes stehen eine unglaubli-che

Anzahl verschiedener Schriften zu Verfügung. Es stellt sich für den Laien
schnell das Problem, durch die Verwendung zu vieler oder dem Mischen von

Farbe Westeuropa Japan China arabische Welt
rot Gefahr Aggression

Gefahr
Freude,
festlich
gelb Vorsicht,

Feigheit
Würde,
Adel
Glück,
Wohlstand
grün sicher,

Neid
Zukunft,
Jugend,
Energie

Fruchtbarkeit,
Stärke

blau Männlichkeit,
Kälte,
Autorität

Tugend,
Vertrauen,
Wahrheit
weiß Reinheit,

Tugend
Tod,
Trauer
Tod,
Trauer
schwarz Tod,

Trauer
TABELLE 1 Kulturspezifische Farbbedeutungen vgl. Wirth, T.: Kommunikationsdesign, http:// www. kommdesign. de, 10/

1999

80. vgl. Cyrus D. K.: Crashkurs Typo und Layout, 1995, S. 62 39
39 Page 40 41
Einlußfaktoren und Gestaltungsrichtlinien
40
nicht zusammenpassenden 81 Schriften das Erscheinungsbild der Präsenta-tion
zu beeinträchtigen.

Es gibt verschiedene Ansätze, um Schriften einzuteilen 82 , die nur überblicks-artig
erfolgt.

° Schriften mit Serifen und solche ohne,
° Fließtextschriften und Hervorhebungsschriften,
° Klassifizierung nach DIN 16518.
Die DIN 16518 unterteilt Schriften in 11 Bereiche 83 , sie gibt einen Überblick
über die Vielfalt der Möglichkeiten, die dem Anwender offenstehen:

1. Venezianische Renaissance-Antiqua, z. B. Palatino
2. Französische Renaissance-Antiqua, z. B. Garamond
3. Barock-Antiqua, z. B. Times
4. Klassische Antiqua, z. B. Bodoni
5. Serifenbetonte Linearantiqua
6. Serifenlose Linearantiqua, z. B. Helvetica
7. Antiquavarianten
8. Schreibschriften
9. Handschriftliche Antiqua
10.Gebrochene Schriften
11.Fremde Schriften
Weiterhin ist es möglich, Schriften nach den beim Betrachter auslösenden
Urteil zu unterteilen. Danach wäre es möglich, nach spielerisch, ernst, traditio-nell,

experimentell, sachlich... 84 zu unterscheiden. Diese Unterscheidung
beruht fast ausschließlich auf subjektiver Wahrnehmung.

2.5.5.3 Regeln für den Einsatz von Schriften
Es ist schwer, allgemein gültige Vorschriften für die Verwendung von Schriften

bei Publikationen aufzustellen. Es spielen immer der persönliche Geschmack

81. Letztlich eine Frage des Geschmacks, aber es gibt auch dafür allgemeine Regeln
82. vgl. Dutt, C.; Schmithäuser, M.: Der neue Desktop-Knigge, 1996, S. 15
83. vgl. Cyrus D. K.: Crashkurs Typo und Layout, 1995, S. 31
84. vgl. Bonsiepe, G.: Interface: Design neu begreifen, 1996, S. 81 40
40 Page 41 42
Einlußfaktoren und Gestaltungsrichtlinien
41
sowie der Verwendungszweck eine große Rolle. Die skizzierten Regeln 85 stel-len
demnach nur einen möglichen Ansatz dar.

° Titel von Büchern, Berichten etc. werden mit der Grundschrift gesetzt
oder Verwendung einer starken Kontrastschrift,

° Titel in Fettschrift nur dann, wenn im Text Fettdruck eingesetzt wird,
° Kursivdruck immer aus der Kursiven der Grundschrift,
° keine Mischung von Schriften einer Klasse,
° möglichst nur zwei verschiedene Schriftarten einsetzen.
Neben diesen allgemeinen Regeln sollte bei der Variation mit unterschiedli-chen
Schriftgrößen darauf geachtet werden, daß oft gerade darauf verzichtet
werden kann. Eine Beschränkung auf das Wesentliche, Verwendung von Kur-siv-/
Fettschrift oder Kapitälchen und Nutzung von Abstand zwischen Hervor-hebung

und Fließtext bieten oft ausreichend Gestaltungsfreiheit. 86

2.5.5.4 Zeilenabstand
Die Lesbarkeit eines Dokumentes wird weiterhin sehr stark durch den Zeilen-abstand

beeinfluß. Mit HTML ist es nicht einfach, den Zeilenabstand zu korri-gieren.
Unter Einsatz von Cascading Stylesheets kann ab HTML 4.0 der
Zeilenabstand beliebig gewählt werden. Wenn der Wunsch besteht, ältere
Browser mit typographisch ausgefeilten Seiten zu bedienen, dann kann der
Zeilenabstand aufwendig durch schmale Grafiken oder Tabellen beeinflußt
werden.

2.5.5.5 Spaltenbreite
Die Einteilung einer Seite in mehrere Spalten kann sinnvoll sein, um den

Lesefluß zu erleichtern. Die Spaltenbreite orientiert sich am Zeilenabstand.
Für den Leser ist es einfacher, nach einer langen Zeile die folgende zu finden,
wenn ein ausreichender Abstand zwischen diesen vorhanden ist. Dies bedeu-tet,
daß bei kleinen Spalten der Abstand zwischen den Zeilen verringert wer-den

kann. 87 Für die Ermittlung der optimalen Spaltenanzahl, ist es wichtig,
daß der Abstand zwischen diesen etwa zwei Buchstabenbreiten betragen

85. vgl. Dutt, C.; Schmithäuser, M.: Der neue Desktop-Knigge, 1996, S. 23
86. vgl. Cyrus D. K.: Crashkurs Typo und Layout, 1995, S. 68
87. vgl. Cyrus D. K.: Crashkurs Typo und Layout, 1995, S. 97 41
41 Page 42 43
Einlußfaktoren und Gestaltungsrichtlinien
42
soll. Als Maß für die optimale Zeilenlänge gilt eine eine Buchstabenanzahl von
55 bis 65 Buchstaben als allgemein gut lesbar. 88

2.5.5.6 Seitenformat
Die bekanntesten Seitenformate entstammen der DIN-Reihe, von denen

sicherlich DIN A4 das bekannteste ist. Diese Formate wurden um 1920 defi-niert,

sie wurden als besonders harmonisch empfunden. 89 Im Printbereich
spielt es eine große Rolle, daß sich kleinere und vor allem schmalere Formate
leichter handhaben lassen als größere, die beim Lesen eventuell einer Unter-lage
zum Ausbreiten bedürfen. Für einen Werbezettel ist bspw. ein leicht zu
verstauendes Format wesentlich besser geeignet. Ist bei einer Gestaltungsar-beit
das Format durch den Auftraggeber nicht vorgegeben, kann es sinnvoll
sein, mit verschiedenen Formaten zu experimentieren.
Für das Seitenformat von Webseiten gelten die Gestaltungsprinzipien, die
sich aus den Einschränkungen auf der Nutzerseite ergeben.

2.5.6 Plazierung von Navigationselementen
Die Wahl der Position der Navigationselemente hängt von den Gewohnheiten
der Nutzergruppe ab. Im westlichen Kulturkreis wird von links oben nach

rechts unten gelesen (sogenanntes „Gutenberg-Diagramm) 90 . Ursächlich
dafür ist, daß die Raumorientierung in der rechten Gehirnhälfte verarbeitet
wird. Befindet sich der Navigationsbereich im linken Blickfeld, wird dessen
Information in die rechte, „richtige" Gehirnhälfte übertragen. Um die Naviga-tion
zu erleichtern, sollten die Elemente daher am linken Rand plaziert wer-den.
91

2.5.7 Grafische Seitengestaltung
Ein wichtiger Aspekt der grafischen Gestaltung ist die Schaffung einer visuel-len

Hierarchie. 92 Sie wird verwendet, um den Blick des Lesers über die Seite
zu führen. Dabei wird eine Seite zuerst als Ansammlung von Formen und Far-ben
gesehen und erst danach erfolgt ein Erfassen spezifischer Information.
88. vgl. Computer Publishing, S. 109
89. vgl. Cyrus D. K.: Crashkurs Typo und Layout, 1995, S. 266
90. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 70
91. vgl. Hofer, K. C.; Zimmermann, H.: good webrations, 1998, S. 35
92. vgl. Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999 42
42 Page 43 44

Einlußfaktoren und Gestaltungsrichtlinien
43
Dabei wiederum stehen Grafiken im Vordergrund und später erfolgt das
Lesen einzelner Worte.
Eine „grafische Ausgeglichenheit" und erkennbare Ordnung ist damit wichtig,
um Leser auf einer Webseite zu halten. Eine Seite, nur bestehend aus Fließ-text
wirkt dabei ebenso abschreckend wie eine mit allzu dominierenden Grafi-ken.

2.5.8 Größe der präsentierten Informationseinheiten
Untersuchungen haben gezeigt, daß nur etwa 10% der Nutzer bereit sind,

eine Webseite zu scrollen. 93 Ursächlich dafür ist die Streßsituation, die
gewünschte Information schnell finden zu müssen einerseits und dem
Kostenfaktor der Onlinegebühren für private Nutzer andererseits. Daher soll-ten
längere Texte auf mehrere Seiten verteilt werden, so daß sie sich ohne

Scrollen lesen und inhaltlich erfassen lassen. 94
Im Internet wird die Information nicht „im ganzen" sondern unterteilt in ver-schiedene
Informationseinheiten präsentiert. Die Informationseinheiten des

Internets sind Bildschirmseiten. 95 Problematisch ist, daß viele Nutzer durch
Suchmaschinen auf eine Unterseite einer Webseite gelangen und nicht unbe-dingt
auf die Startseite. Es ist daher erforderlich, daß jede Seite für sich eine
abgeschlossene Informationseinheit bildet, die auch alleine stehen kann.

2.6 Interface -Schnittstelle zum Nutzer
2.6.1 Allgemein
Ein Interface ist die Schnittstelle zwischen dem Nutzer, einem Werkzeug und

einer beabsichtigten Handlung des Nutzers. 96 BONSIEPE verknüpft Nutzer,
Werkzeug und Handlung in einem Diagramm, welches in Abbildung 8 darge-stellt

ist. 97

93. vgl. Hofer, K. C.; Zimmermann, H.: good webrations, 1998, S. 82
94. „Schreiben für die Welt", www. zdnet. de?????????????????????????????????????
95. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 75
96. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 2
97. vgl. Bonsiepe, G.: Interface: Design neu begreifen, 1996, S. 19 ff. 43
43 Page 44 45
Einlußfaktoren und Gestaltungsrichtlinien
44
ABBILDUNG 8 Ontologisches Diagramm des Designs
Quelle: in Anlehnung an Bonsiepe, G.: Interface: Design neu begreifen, 1996, S. 32

Zusammengesetzt ist dieses Diagramm aus 3 Domänen.
1. Nutzer oder „sozialer Agent", der eine Handlung realisieren möchte.
2. Eine Aufgabe, die der Nutzer erledigen will.
3. Ein Werkzeug, welches der Nutzer zum Ausführen der Handlung
benötigt.
Soll bspw. ein Buch bearbeitet werden, dann ist als Werkzeug eine Feder
oder ein Computer zum Schreiben und eine Schere zum Zerschneiden ver-wendbar.
Die Absicht ist es hier, ein Buch zu bearbeiten und nicht die Feder,
die Schere oder einen Computer zu verwenden.
Interface ist daher keine Sache, es ist die Dimension, in der die Interaktion
zwischen Nutzer, Werkzeug und Handlungsziel gegliedert wird. Dies gilt für
den Entwurf einer Bohrmaschine genauso wie für die Gestaltung einer grafi-schen

Benutzeroberfläche. 98

2.6.2 Interface von Hypermediasystemen
Bei Hypermediasystemen dienen Computer als Kommunikationsmedium. 99
Bei Computern ergeben sich andere Möglichkeiten der Kommunikation, Inter-aktion
und Präsentation als bei anderen Medien wie Buch oder Film. 98. vgl. Bonsiepe, G.: Interface: Design neu begreifen, 1996, S. 20
99. vgl. Hentrich, J.: Hypermedia Design, 1998, S. 1 44
44 Page 45 46
Einlußfaktoren und Gestaltungsrichtlinien
45
Das Interface ist hier die Kommunikationsschnittstelle zwischen Mensch und
Maschine (Computer). Der Begriff kann dabei sowohl die Hardware und Soft-ware
gemeinsam betrachten -als auch ausschließlich die Software. Eine

andere Definition 100 beschreibt das Benutzerinterface als das Look and Feel
eines Computersystems. Es schließt die Arten der Gegenstände ein, die der
Benutzer sieht und beschreibt die Konventionen dafür, wie der Benutzer mit
diesen Gegenständen umgeht.

Das Interface von Computern wird von Apple 101 folgendermaßen gesehen:
„Das Interface umfaßt die Gesamtheit aller Kommunikation zwischen Compu-ter

und Nutzer. Es bietet dem Nutzer Informationen 102 und seinerseits emp-fängt
es Informationen seitens des Nutzers."
Daraus folgt, daß das Interface von Computern wesentlich komplexer ist als
das von Büchern oder Filmen.
Für Gestalter von Hypermediasystemen ist der Bildschirm momentan noch
der primär zu berücksichtigende Gegenstand. In Zukunft wird aber verstärkt
Sprachein-und ausgabe und für Sehbehinderte ein Brailleausgabegerät hin-zukommen.

2.6.3 Interface-Design
Herkömmliche Büroanwendungen und grafische Oberflächen von Betriebssy-stemen
orientieren sich an einem Arbeitsplatz bzw. Schreibtisch als Metapher
für die Darstellung an Bildschirmen.
Internetpräsentationen verfolgen oft ganz andere Ziele. Es sind andere Meta-phern
nötig. So kann die Anordnung von Menüs in Form eines Kreises sinn-voll
sein, wenn auch die „natürliche" Anordnung kreisförmig ist (bspw.

Himmelsrichtungen und Farbkreise). 103 Typische Beispiele sind eine virtuelle
Stadt 104,105 oder ein virtuelles Kaufhaus 106 .

100.vgl. The Open Look UI Style-Guide, S. 1
101.Hentrich, J.: Hypermedia Design, 1998, S. 5
102.Die Quelle wahrend, wird der Plural belassen.
103.vgl. Wandmacher, J.: Software-Ergonomie, 1992 S. 49
104.vgl. bspw. http:// www. fortunecity. de
105.vgl. Matz, A.: Das Leitmotiv, http:// www. zdnet. de/ internet/ artikel/ wdm/ 9802/
leitm. wc. htm, 03/ 1999
106.vgl. bspw. http:// www. virtuelles-kaufhaus. de 45
45 Page 46 47
Einlußfaktoren und Gestaltungsrichtlinien
46
2.6.4 Startseite
Eine Webseite sollte eine funktionale und schnell ladende Startseite (Home-page)

besitzen, die die umrissenen Themengebiete beschreibt. 107 Dies steht
der Forderung gegenüber, wonach der Besucher durch eine ausgefallene
Gestaltung oder durch besondere Effekte auf die Seite gezogen werden

soll. 108 Letztlich hängt das Aussehen von den Besuchergewohnheiten ab.
Wird die Seite von einem festen „Kundenstamm" häufiger besucht, dann
kann sie aufwendigere Grafiken oder gar Animationen enthalten, da diese
sich im Zwischenspeicher des Computers halten.

2.6.5 Seitenfuß 109
Bücher und wissenschaftliche Publikationen enthalten im unteren Teil der Sei-ten
oft die aktuelle Seitenzahl, eventuell den Namen des Kapitels oder Fußno-ten.

Auf einer Webseite sollte mehr Information geboten werden. Durch eine hohe
Änderungshäufigkeit ist es wichtig, das Erstellungsdatum oder den Zeitpunkt
der letzten Änderung ablesen zu können. So kann man zum Einen erkennen,
wie aktuell die Information auf der Seite sind und ob kürzlich Änderungen vor-genommen
wurden.
Autoren von Webseiten sind nicht verpflichtet, sich als Verfasser zu erkennen
zu geben. Ein aufgeführter Autor zeichnet nicht nur für den Inhalt verantwort-lich,
es lassen sich auch die Urheberrechte zuordnen.
Durch einen Link zum Autor oder der Angabe seiner E-Mailadresse ist es
schnell möglich, sich mit diesem in Verbindung zu setzen. Es kann durchaus
sinnvoll sein, Feedback zu haben oder auf inhaltliche Fehler oder nicht funk-tionierende
Links hingewiesen zu werden.
Bei der Verwendung von Frames ist es sinnvoll, die URL des Dokuments
anzugeben, weil diese aus dem Eingabefeld des Browsers nicht erkenntlich
ist.

107. vgl. Steinmetz, R.: Multimedia-Technologie, 1999, S. 732
108.vgl. Yale Style-Guide, http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999
109.vgl. Weinreich, H.: Software-Ergonomie, http:// vsys-www. informatik. uni-hamburg. de/
ergonomie/ fuss. html, 10/ 1999 46
46 Page 47 48

Einlußfaktoren und Gestaltungsrichtlinien
47
2.7 Einschränkungen auf der Nutzerseite
2.7.1 Der Web-Browser
Durch Inkompatibilitäten der verschiedenen Web-Browser bezüglich der Dar-stellung,
der Unterstützung unterschiedlicher HTML-Standards und eigener
Erweiterung seitens der Hersteller ist es für Web-Autoren schwer, ein gleiches
Erscheinungsbild des Internetauftrittes zu garantieren. Aufgrund der Marktbe-herrschung
durch die Browser der Hersteller Netscape (Navigator bzw. Com-municator)
und Microsoft (Internet Explorer) können Webseiten, die diese
beiden Browser unterstützen, als ausreichend kompatibel bezeichnet werden
(siehe Abbildung 9).
Unterscheidungen müssen dabei lediglich zwischen den Versionen für PC-Systeme
110 und Apple Macintosh getroffen werden. Hersteller von Software

stehen vor ähnlichen Problemen, für welche Plattform( en) programmiert wer-den
soll.

ABBILDUNG 9 Anteile der verschiedenen Webbrowser
Quelle: BrowserWatch, http:// browserwatch. internet. com/ stats/ stats. html, 11/ 1999

110.Apple Macintosh-Computer sind sicherlich auch Personalcomputer (PC). Als PC soll
dem allgemeinen Gebrauch entsprechend ein System mit sogenannten Intel-kompati-blen
Prozessor betrachtet werden.

51, 20%
35, 20%

2,64% 1,76% 1,63% 1,02% 0, 93% 0, 69% 0,47%
0,00%

10, 00%
20, 00%
30, 00%
40, 00%
50, 00%
60, 00%

Internet
Explorer

Netscape
Navigator
Science

Traveller IBrowse Opera
AOL

Powermarks-

3.0 Lynx
Cyberdog 47
47 Page 48 49
Einlußfaktoren und Gestaltungsrichtlinien
48
2.7.2 Festlegung der optischen Seitengröße
Nicht einfach ist die Wahl der Größe in Pixeln einer Webseite. Oft stellt sich die
Frage, für welche Bildschirmauflösung eine Seite gestaltet werden soll. Wenn
heute auch viele Computerbesitzer mit einer Bildschirmauflösung von
1024x768 Pixeln arbeiten, können gerade in Unternehmen, die noch nicht auf
dem neuesten Stand der Technik sind, kleine Monitore und Auflösungen von
640x480 Pixeln angetroffen werden. Weiterhin sind noch viele Notebooks im
EInsatz, die lediglich eine Bildschirmauflösung von 640x480 Pixeln erlauben.
Eine optimale Internetpräsentation richtet sich nach diesen Minimalanforde-rungen.

Browser bieten durch Menüleisten, Statusleisten, eventuelle Scrollbalken usw.
nie die gesamte Monitorfläche. So ist der eigentliche Darstellungsbereich bei
640x480 Pixeln und dem Browser Netscape Navigator 4.5 lediglich 637x303

Pixel 111 .
Oft verspüren die Betrachter von Webseiten das Bedürfnis, den dargestellten
Inhalt auszudrucken. Dadurch entsteht ein weiteres Problem. Eine normale

DIN A4-Seite bietet bei 72 DPI 112 Raum für 595x842 Pixel. Zu bedenken ist
auch hier, daß nicht der gesamte Raum des Papiers zum Drucken verfügbar
ist. Als „sicher" kann eine Dimension von 535x670 Pixeln angesehen wer-den.
113 Auch wenn beim Drucken der Browser eine Anpassung an das

Papierformat vornimmt, gelingt es nicht immer, alle Inhalte zu drucken. Tabel-111.Die

Angaben beruhen auf vom Autor durchgeführten Messungen. Sie können je nach
Browser, zusätzlich eingeschalteten Buttonleisten und Programmelementen verschie-dener
Betriebssysteme anders ausfallen. Aufgezeigt wird lediglich die Problematik.
112.Dies entspricht der Monitorauflösung.
113.vgl. Hentrich, J.: Hypermedia Design, 1998, S. 33 48
48 Page 49 50

Einlußfaktoren und Gestaltungsrichtlinien
49
len mit Mindestgrößenangaben und Grafiken, welche eine bestimmte Größe
überschreiten, werden abgeschnitten.

ABBILDUNG 10 Größenvergleich Browserfenster mit DIN A4
(Quelle: eigene Darstellung)

Aus Abbildung 10 kann durch die grau dargestellte Fläche, der Raum ermit-teln
werden, den eine „sichere" Seite umfassen darf: 535x350 Pixel. Die
gestrichelte Linie beschreibt eine DIN A4-Seite, der schwarze Rahmen den
Bereich des Webbrowsers.
Ein besonderer Aspekt sollte immer sein, daß Webseiten nicht für Auflösun-gen
oder Farbtiefen, sondern für Leser gemacht werden. 49
49 Page 50 51
Gestaltungsmuster und Beispiele
50
KAPITEL 3 Gestaltungsmuster und Bei-spiele
3.1 Einleitung
Unterschiedliche Typen von Websites erfordern verschiedene Gestaltungs-muster.

Es wird daher zuerst ein Überblick über mögliche Klassen von Websi-tes
gegeben und deren Verwendungbarkeit zur Bildung von Gestaltungs-mustern
erläutert. Für geeignete Klassen werden Gestaltungsmuster entwick-kelt.

3.2 Klassifizierung von Websites
3.2.1 Nach dem Inhalt
HENTRICH 114 hat folgende Unterteilung getroffen:
° Kommerzielle Web Sites umfassen ein sehr großes Spektrum. Es läßt
sich nur schwer feststellen, welcher Inhalt bei diesen Seiten geboten
werden sollte. Feststellbar ist allerdings, daß oft der Inhalt aus vor-handenen
Printmedien übernommen wird. Für Besucher lohnt sich
ein Besuch und damit Aufwand an Zeit und Geld nur, wenn er einen
Zusatznutzen erfahren kann. Dies könnten umfangreichere und aktu-ellere
Profuktinformationen, ein Kontaktformular oder Bestellmöglich-keiten
sein.

° Intranet Sites, die auf dem unternehmensinternen Intranet basieren
und der Kommunikation zwischen verschiedenen Unternehmenstei-len
oder Abteilungen dienen.

° Themen Sites, die sich mit nahezu allen Bereichen des Lebens
beschäftigen.

° Personal Sites sind die persönlichen Websites im Internet. Die teil-weise
bizarren Inhalte, lassen sich nur schwer in ein Regelwerk pres-sen.

114.vgl. Hentrich, J.: Hypermedia Design, 1998, S. 168 50
50 Page 51 52
Gestaltungsmuster und Beispiele
51
° Teamwork Sites behandeln Projekte, an denen viele Mitarbeiter welt-weit
verteilt arbeiten. Beispiele dafür sind die Website des W3-Kon-sortiums
(http:// www. w3. org) oder der Linux-Entwickler-Gemeinde
(http:// www. slashdot. org). Diese Seiten dienen fast ausschließlich als
Kommunikationskanal der Projektbeteiligten.

3.2.2 Nach dem optischen Erscheinungsbild
WIRTH 115 unterteilt nach dem optischen Anspruch, betrachtet sehr kritisch
und versieht seine Klassifizierung mit eher „untypischen", jedoch treffenden
Bezeichnungen:

° „Modell Asket" versucht nur das nötigste darzustellen. Die Übertra-gungskapazität
steht im Vordergrund.

° „Provisorien" sind Sites, die vor allem dadurch auffallen, daß sie noch
nicht fertig sind.

° „Knossos"-Präsentationen fallen durch ein Gewirr von vielen ähnli-chen
Seiten auf, die alle von jeder Seite aus erreicht werden können.

° „Modell Las Vegas" spart an keiner Animation, Laufschrift und ver-wendet
alle verfügbaren Farben.

3.2.3 Nach der Zielgruppe
Die Vorangegangenen Gruppierungen lassen eine Ableitung von Gestal-tungsmustern
nicht einfach zu. Diese Klassifizierung versucht, ähnliche, im
WWW häufig anzutreffende Websites aufzuführen. Unterscheidet man Websi-tes
nach der Zielgruppe und wird ein ähnliches Erscheinungsbild voraussge-setzt,
kann eine Einteilung wie folgt sein:

° Suchmaschinen/ Portalseiten
° Zeitschriften, Zeitungen
° Unternehmen.
Es lassen sich sicher auch Gestaltungsmuster für Private Websites oder The-mensites
finden. Allerdings konnte in diesen Gruppen noch keine Entwick-lung
zur Einheitlichkeit feststellen und ist auch schwer vorstellbar. Dies

115.vgl. Wirth, T.: Kommunikationsdesign, http:// www. kommdesign. de, 10/ 1999 51
51 Page 52 53
Gestaltungsmuster und Beispiele
52
bedeutet, es wird keinen Trend zu strukturell gleichen privaten Websites
geben.

3.3 Gestaltungsmuster
3.3.1 Suchdienste/ Potalseiten
Suchdienste wie AltaVista, Yahoo oder Excite gehören zu den wichtigsten
Anlaufstellen und damit den meistbesuchten Sites im Internet. Für viele Nut-zer
sind sie Einstiegsseiten (Portalseiten) beim Surfen im WWW.
Bei allen großen Suchdiensten konnte festgestellt werden, daß neben der
eigentlichen Suche zahlreiche andere Information dargeboten wird. Die
Anbieter versuchen sich regelrecht mit neuen Ideen zu übertrumpfen und
Nutzer auf ihre Seite zu ziehen.
Werden die Homepages von AltaVista, Excite und Yahoo analysiert (Screens-hots
im Anhang), ergibt sich folgendes Gestaltungsmuster:

ABBILDUNG 11 Gestaltungsmuster für Suchdienste/ Portalseiten
Quelle: eigene Darstellung

Auf Frames wird in diesem Segment verzichtet.

3.3.2 Zeitschriften und Zeitungen
Es fällt auf, daß Suchdienste und Zeitschriften ein durchaus ähnliches
Erscheinungsbild pflegen. Dies begründet sich in der Tatsache, das Such-diense
beim Ausbau zu Protalseiten tagesaktuelle Information, Börsenkurse, 52
52 Page 53 54
Gestaltungsmuster und Beispiele
53
das Wetter usw. mit anbieten. Die Screenshots der Homepages von „Focus
Online", „Leipziger Volkszeitung Online" und „Der Spiegel Online" sind im
Anhang und führen zu folgendem Gestaltungsmuster:

ABBILDUNG 12 Gestaltungsmuster für Zeitschriften und Zeitungen
Quelle: eigene Darstellung

Im linken Bereich ist die Primärnavigation. Sie stellt die oberste Hierarchie der
Verzweigungen dar. Sekundärnavigation als Stufe nach der Primärnavigation
findet durch Verändern der Navigationsleiste beim Aktivieren einer Verknüp-fung
ebenfalls im linken Bereich statt.
Der Bereich Zusatznavigation beinhaltet meist bestimmte Serviceangebote.
So wird dort für andere Produkte des Verlags geworden und bspw. die aktuel-len
Börsen-und Wetterdaten angeboten.
Nicht ganz einheitlich ist die Plazierung der Werbung. Sie kann sowohl oben
als auch unten in einem Extrabereich/ Frame aufgenommen werden.
Auf Frames kann daher in diesem Segment nicht verzichtet werden. Werbe-banner
benötigen ihren eigenen Bereich. Der Inhalt und die Navigation ist
aber nicht durch Framevereinbarungen geteilt.
Eine lokale Suche zum Auffinden von Artikeln wird meist angeboten. 53
53 Page 54 55
Gestaltungsmuster und Beispiele
54
3.3.3 Unternehmenspräsentationen
Einen gänzlich anderen Zweck verfolgen Unternehmenspräsentationen. Hier
steht die Werbung für die eigenen Produkte und der Support im Vordergrund.
Es hat sich ein Gestaltungsmuster wie folgt etabliert:

ABBILDUNG 13 Gestaltungsmuster für Unternehmenspräsentationen
Quelle: eigene Darstellung

Die Sekundärnavigation des linken Bereiches paßt sich in Abhängigkeit des
Nutzerverhaltens über die Primärnavigation an. D. h. die linke Navigation
nimmt Unterpunkt der oberen horizontalen Navigation auf.
Auch auf Unternehmenspräsentationen sind lokale Suchdienste Standard.
Frames sind kaum anzutreffen.
Es kann allgemein davon gesprochen werden, daß die Zahl der framebehafte-ten
Seiten abnimmt. Die Nachteile von Frames scheinen damit zu überwie-gen. 54
54 Page 55 56
Schlußbetrachtung
55
KAPITEL 4 Schlußbetrachtung
Im ersten Teil (Kapitel 2) der Arbeit wurden Einflußfaktoren auf den Gestal-tungsprozeß
und die daraus abgeleiteten Gestaltungsprinzipien für Websites
aufgeführt. Es hat sich gezeigt, daß auf Erkenntnisse der traditionellen Gestal-tungsprozesse
zurückgegriffen werden kann, jedoch auch ganz andere
Aspekte dazukommen.

Aufbauend auf die erarbeiteten Erkenntnisse konnten im zweiten Teil (Kapitel
3) Websites klassifiziert werden. Die Einteilung kann dabei sehr unterscheid-lich
erfolgen und beruht auf subjektiver Wahrnehmung. Bei der Festlegung
von Gestaltungsmuster ist erkannt worden, daß zur Zuordnung der Seiten-struktur
von Websites zu Klassen, eine ähnliche Zielgruppe zu wählen ist.

Diese Arbeit leistet damit (so hofft der Autor) einen Beitrag zur Aufstellung und
Entwicklung von Standards und Richtlinien für die Gestaltung des, im Ver-gleich
zu anderen, neuen Mediums Internet und dem Bereich Präsentation im
Internet. 55
55 Page 56 57
Anhang
56
Anhang
Versionen von HTML
HTML 1.0
Bei dieser ersten Version von HTML handelt es sich nicht um eine mit den

danach entstandenen 116 vergleichbare Version. 117 Um die vorgesehene Idee
zu verwirklichen, nutzte man eine Anwendung von SGML und entwickelte
einige einfache Befehle zur Strukturierung von Dokumenten, zum Einbinden
von Grafiken und der Navigation über Hyperlinks.
HTML 2.0
Diese Version wurde noch mit dem Anspruch veröffentlicht, die einzig für
Browser zulässigen Tags zu definieren. Allerdings waren die Spezifizierungs-zeiträume
für das WWW zu langsam und Netscape entwickelte eigene Erwei-terungen
für HTML. So kamen zu diesem Zeitpunkt Anweisungen für Frames,
Tabellen, Javascript und animierte Gif-Grafiken heraus, die vom W3-Konsor-tium
nicht vorgesehen waren. Microsoft brachte ebenfalls Erweiterungen her-aus,
wie etwa Style Sheets und ActiveX-Erweiterungen. Zu diesem Zeitpunkt

stellte sich die Frage nach der Daseinsberechtigung des W3C. 118
HTML 3.2
Nachdem Version 3.0 gleich nach der Freigabe wegen des zu hohen Um-fangs

(Formeln, Klassenkonzept) 119 wieder zurückgezogen wurde, versuchte
Version 3.2 die von damals gebräuchlichen Browsern unterstützten Anwei-sungen
zu vereinen. Anweisungen wie <XMP>, <LISTING>, <PLAINTEXT>,die aus HTML 2.0 stammen, sind in dieser Version nicht mehr vorhanden. Sie

wurden durch das <PRE>-Tag ersetzt. 120
HTML 4.0

Diese Version existiert seit Dezember 1998. 121 Dabei wurde HTML 3.2 dahin-gehend
„erweitert", daß überflüssige Befehle entfernt wurden und Tabellen 116.HTML 2.0 ff.

117.vgl. Powers, S.: Dynamic Web Publishing, München, 1998, S. 69
118.vgl. Powers, S.: Dynamic Web Publishing, München, 1998, S. 2
119.vgl. Born, G.: HTML 4-Kompendium, 1998, S. 37
120.Lie, H. W.; Boss, B.: Cascading Style Sheets, 1997, S. 311
121.genauer seit dem 18. 12.1997 56
56 Page 57 58

Anhang
57
und Formulare ergänzt. Genau beschrieben sind ebenfalls Frames, Schnitt-stellen
zu Skiptsprachen (bspw. Javascript und Visual Basic-Script) und die

Möglichkeit der Anwendung von Style-Sheets. 122
Eine Reihe von Anweisungen werden weiter unterstützt, es existieren aber
Empfehlungen, diese durch neuere zu ersetzen. So wurde bspw. das
<OBJEKT>-Tag geschaffen, welches das <APPLET>-und das <IMG>-Tag

ersetzen. 123

XML-Beispiel
Das nachfolgende Beispiel 124 soll die zahlreichen Möglichkeiten von XML ver-deutlichen
und die Arbeitsweise erleutern.
Das Beispiel behandelt den einfachen Dokumententyp 'Email'. Im wesentli-chen
besteht eine Emails aus

°Empfänger
° Absender
° Thema (Betreff/ Subject)
° eigentlich Nachricht.
Die DTD (Siehe „DTD" auf Seite 28) dafür könnte wie folgt ausssehen:

Die DTD enthält die entsprechende Elemente in der ersichtlichen Reihenfolge.
Diese Elemente wiederum enthalten reinen Text (zu erkennen an #PCDATA,
Parsed Character Data).

122.vgl. Born, G.: HTML 4-Kompendium, 1998, S. 37
123.gl. Powers, S.: Dynamic Web Publishing, München, 1998, S. 37
124.vgl Behme, H.; Mintert, S.: XML in der Praxis, 1998, S. 51 ff.

 <! ELEMENT email (empfaenger, absender, thema, nachricht)> <! ELEMENT empfaenger (# PCDATA)> <! ELEMENT absender (# PCDATA)> <! ELEMENT thema (# PCDATA)> <! ELEMENT nachricht (# PCDATA)> 57
57 Page 58 59
Anhang
58
Die Instanz (der XML-Code) würde etwa so erscheinen:
Das Beispiel klammert dabei aus, wie Empfänger und Absender zu notieren
sind, in der Schreibweise wird ein Emailprogramm Schwierigkeiten haben,
die Email zu senden.
Webadressen

° Bush, Vannevar: „As we may think"
www. isg. sfu. ca/~ duchier/ misc/ vbush/

° Nelson, Theodor: „Xanadu"
www. sfc. keio. ac. jp/~ xanandu. and. osmic. html

° Style-Guide W3
www. w3. org/ hypertext/ WWW/ Provider/ Style/ Overview. html

° Guide to Information Architecture
argus-inc. com/ iaguide/

°Usable Web
usableweb. com

° HypertextNow
www. eastgate. com/ hypertextnow/

° Yale Style-Guide
info. med. yale. edu/ caim/ manual/ contents. html

° Die Seite zum Buch
www. secretsites. com

° Icons für Sun
ww. sun. com/ sun-on-net/ uidesign/ sunweb

<? xml version=" 1.0"?> <! DOCTYPE email SYSTEM „email. dtd"> <email> <empfaenger> Ulrich Steinbach</ empfaenger> <absender> Walter Steinbach</ absender> <thema> Bad</ thema> <nachricht> Hallo Ulrich, bitte reinige das Bad. Ich war letzte Woche dran. </ nachricht> </ email> 58
58 Page 59 60
Anhang
59
° Interface: Design neu begreifen
www. ds. fh-koeln. de/~ bonsiepe
Validierer für HTML

° W3 HTML Validator
http:// validator. w3. org

° WebSiteGarage
http:// www. websitegarage. com

° NetMechanic
http:// www. netmachanic. com

° Doctor HTML
http:// www2. imagiware. com/ RxHTML

Screenshots von Suchdiensten

ABBILDUNG 14 Startseite von http:// www. altavista. com 59
59 Page 60 61
Anhang
60
ABBILDUNG 15 Startseite von http:// www. excite. com
ABBILDUNG 16 Startseite von http:// www. yahoo. com 60
60 Page 61 62
Anhang
61
Screenshots von Unternehmenspräsentationen
ABBILDUNG 17 Startseite von Hewlett-Packard 61
61 Page 62 63
Anhang
62
ABBILDUNG 18 Startseite von IBM
ABBILDUNG 19 Startseite von Microsoft 62
62 Page 63 64
Anhang
63
Screenshots von Zeitungen/ Zeitschriften
ABBILDUNG 20 Startseite von http:// www. focus. de 63
63 Page 64 65
Anhang
64
ABBILDUNG 21 Startseite von http:// www. lvz-online. de
ABBILDUNG 22 Startseite von http:// www. spiegel. de 64
64 Page 65 66
Literaturverzeichnis
65
Literaturverzeichnis
Adobe Systems Incorporated Photoshop Color Management
Photoshop Color Management. pdf, 1999

Assfalg, Rolf; Goebels, Udo; Welter, Heinrich
Internet-Datenbanken
Addison-Wesley-Longman Bonn, 1998

Baumgardt, Michael
Creative Web Design: tips and tricks step by step
Springer Verlag Berlin, 1998

Behme, Henning; Mintert, Stefan
XML in der Praxis: Professionelles Web-Publishing mit der Extensible Markup Language
Addison-Wesley-Longman Bonn, 1998

Bonsiepe, Gui:
Interface : Design neu begreifen
Bollmann Verlag Mannheim, 1996

Born, Günter
HTML 4-Kompendium
Markt und Technik Haar bei München, 1998

Breunig, Florian
Ende der Statik in Sicht
http:// www. zdnet. de/ internet/ artikel/ html/ 9804/ xml_ 00-wc. html, 08/ 1999

Brown, Mark R. u. a.
Special Edition Internet
Que Imprint Markt und Technik Haar bei München, 1998

Browserswatch
http:// www. browserswatch. com, 11/ 1999

Cyrus Dominik Khazaeli
Crashkurs Typo und Layout -Vom Zeilenfall zum Screendesign
Rowohlt Taschenbuchverlag Reinbeck bei Hamburg 1995
Originalausgabe

December, Hohn; Randall, Neil
World Wide Web fuer Insider
Sams Imprint Markt und Technik Verlag Haar bei München, 1995

Dutt, Christoph; Schmithäuser, Michael
Der neue Desktop-Knigge: Gutes Layout leicht gemacht
Franzis Verlag Feldkirchen, 1996

Eike, Ulli
Document Object Model http:// www. zdnet. de/ internet/ artikel/ scene/ 199812/ dom01_ 00-wc. html, 05/ 1999 65
65 Page 66 67
Literaturverzeichnis
66
Feldkamp, Jürgen
Kontextermittlung und -berücksichtigung in Hypertextsystemen
Verlag Dr. Kova^ c 1996
Zugl.: Dissertation Fernuniversität Hagen, 1995

Gloor, Peter
Elements of hypermedia design : techniques for navigation and visualization in cyberspace
Birkhäuser Boston 1997

Hansen, Hans Robert
Arbeitsbuch Wirtschaftsinformatik
Lucius & Lucius Verlag Stuttgart, 1997
5. Auflage

Hofer, Klaus C.; Zimmermann, Hansjörg
good webrations -webdesign und wahrnehmung -ein web wirkungsanalyse
Hrsg. Die Argonauten, 1998

Hentrich, Johannes
Hypermedia Design -Gestaltung von Hypermedia-Systemen
Verlag der Haessler Information GmbH Schömberg, 1998

Kentie, Peter
Web-Graphics: Tools und Techniken für die Web-Gestaltung
Addison-Wesley-Longman Bonn, 1998
2., erweiterte Auflage

Koch, Stefan
JavaScipt: Einführung, Programmierung und Referenz
dpunkt-Verlag Heidelberg, 1999
2., aktualisierte und erweiterte Auflage

Lemay, Laura
HTML in 14 Tagen
SAMS Imprint Markt und Technik Haar bei München, 1998

Lenk, Richard (Hrsg.)
Physik
VEB F. A. Brockhaus Verlag Leipzig, 1989
2., verbesserte Auflage

Lie, Hĺkom Wium; Boss, Bert
Cascading Style Sheets: Layout für das Web-Publishing
Addison-Wesley-Longman Bonn, 1997

Lobin, Henning (Hrsg.)
Text im digitalen Medium
Westdeutscher Verlag Opladen/ Wiesbaden, 1999

Matz, Andreas
Das Leitmotiv
http:// www. zdnet. de/ internet/ artikel/ wdm/ 9802/ leitm-wc. htm, 03/ 1999

Niederst, Jennifer
Web-Design
O'Reilly Bonn, 1996
1. Auflage 66
66 Page 67 68
Literaturverzeichnis
67
Niederst, Jennifer
Web design in a nutshell
O'Reilly & Associates Peking..., 1999
1. Auflage

Nielsen, Jakob
Warum Frames schlecht sind
http:// www. useit. com/ alertbox/ 9612. html, 10/ 1999

Powers, Shelley
Dynamic Web Publishing : das komplette Wissen fuers Web Publishing
SAMS Imprint Markt und Technik Verlag Haar bei München, 1998

Rosenfeld, Louis; Morville, Peter
Information Architecture for the World Wide Web
O'Reilly & Associates Cambridge..., 1998
1. Auflage

Sattler, Kai-Uwe,
Software-Agenten zur Informationssuche und -filterung
Vorlesungsscript
Otto-von-Guericke-Universität Magdeburg, 1998

Schmitt, Ulrich
Computer publishing: Grundlagen und Anwendungen
Springer Verlag Berlin, 1997

Steinmetz, Ralf
Multimedia-Technologie: Grundlagen, Komponenten und Systeme
Springer Verlag Berlin, 1999
2. Auflage

Tanenbaum, Andrew S.
Computernetzwerke
Prentive Hall Verlag München..., 1998
3. Auflage

Wandmacher, Jens
Software-Ergonomie
Walter de Gruyter Berlin, 1992

Weinman, Lynda
WebDesign
Midas Verlag AG Zürich, 1998

Weinman, Lynda
Webdesign der Profis
Markt & Technik Haar bei München, 1998

Weinreich, Harald
Software-Ergonomie und das World Wide Web: 10 wichtige Leitlinien für die Gestaltung
eines ergonomischen WWW-Informationssystems
http:// vsys-www. informatik. uni-hamburg. de/ ergonomie/ index. html, 10/ 1999

Wilson, Stephan
World-Wide-Web-Design-Guide: profesionelle Web-Sites gestalten
Markt & Technik Haar bei München, 1996 67
67 Page 68 69
Literaturverzeichnis
68
Wirth, Thomas
Kommunikationsdesgin
http:// www. kommdesign. de, 10/ 1999

Yale Style-Guide
http:// info. med. yale. edu/ caim/ manual/ index. html, 10/ 1999

Ziegler, Hürgen; Ilg, Rolf
Benutzergerechte Softwaregestaltung: Standards, Methoden und Werkzeuge
Oldenburg München, Wien, 1993 68
68 Page 69
Erklärung
69
Erklärung
Ich erkläre hiermit ehrenwörtlich, daß ich die vorliegende Diplomarbeit ohne
unzulässige Hilfe Dritter und ohne Benutzung anderer als der angegebenen
Hilfsmittel angefertigt habe. Die aus fremden Quellen direkt oder indirekt .
übernommenen Gedanken sind als solche kenntlich gemacht.

Bei der Auswahl und Auswertung des Materials sowie bei der Herstellung des
Manusskripts habe ich Unterstützungsleistungen von folgenden Personen
erhalten:

1. Professor Dr. Gerd Goldammer

An der geistigen Herstellung der vorliegenden Diplomarbeit war außer mir
niemand beteiligt. Insbesondere habe ich nicht die Hilfe eines Diplomberaters
in Anspruch genommen. Dritte haben von mir weder unmittelbar noch mittel-bar
geldwerte Leistungen für Arbeiten erhalten, die im Zusammenhang mit
dem Inhalt der Diplomarbeit stehen.

Die Arbeit wurde bisher weder im Inland noch im Ausland in gleicher oder .
ähnlicher Form oder auszugsweise einer Prüfungsbehörde vorgelegt.

Leipzig, 02.11.1999 69

Page Navigation Panel

1 2 3 4 5 6 7 8 9
10 11 12 13 14 15 16 17 18 19
20 21 22 23 24 25 26 27 28 29
30 31 32 33 34 35 36 37 38 39
40 41 42 43 44 45 46 47 48 49
50 51 52 53 54 55 56 57 58 59
60 61 62 63 64 65 66 67 68 69