„Navigieren im WWW“ – Sitemaps und andere Navigationshilfen

Transcription

Definitionsansätze: Was ist Hypertext?
Die "lineare" Tradition des Buches - Spurensuche
Text als Raum?
Metaphern und Darstellungsmodelle für Sitemaps (Beispiele)
Landkarten, Stadtpläne und Straßenkarten
Tunnel/Guided Tours
Netze und Nervensysteme
Baumstrukturen und Verzeichnisbäume
Sitemaps und Indizes
Nutzergewohnheiten und Grenzen der Wahrnehmungsfähigkeit
Das WWW als aktives Medium
Jeder geht seinen Weg
Wieviel Information darf's denn sein?
Regeln und Hilfestellungen für die Umsetzung
Der Bildschirm: kein "weißes Blatt"
Die Menüleiste: Von der Funktion zum Inhalt
Die Anzeige der Daten
Die Statusanzeige
Zusatzmenüs und interne Navigation: Oben, rechts oder links?
Grundsätzliches zu Farbe und Raum
"10 Regeln" für gutes WWW-Design
1
2
2
3
3
4
6
7
8
9
10
10
10
10
11
11
11
11
11
11
12
13
Definitionsansätze: Was ist Hypertext?
Stefan Münz, der bekannte Verfasser der "self-html"- Dokumentation, hat die Theorie und die Geschichte
des Hypertexts knapp und m.E. auch sinnvoll zusammengefasst. Danach kann man zum Thema
„Hypertext“ drei Positionen einnehmen:
1.
2.
3.
Hypertext als Weiterentwicklung von stark strukturierten Texten
(nach Kuhlen: „Wir kommen zu dem Ergebnis, daß Hypertext die auch schon in Texten verwendeten
nicht-linearen Gestaltungsmittel zum Prinzip erhebt [... “)
Hypertext als neue Form der Recherche in Informations- und Datenbeständen
(nach Schnupp: „Hypertext spannt über Textdokumente eine Hyperstruktur zur Unterstützung von
Recherchen auf.“)
Hypertext als kreativer Freiraum und neue Dimension für Autoren und Leser
(nach Joyce: „Hypertext narratives become virtual storytellers and narrative is no longer disseminated
irreversibly from singer to listener or writer to reader.“)
Diese drei Positionen sind es, die ich hier kurz erläutern möchte
Die "lineare" Tradition des Buches - Spurensuche
Frederic Vester stellt im Text „Neuland des Denkens“ folgendes fest:
„Das Medium ‚Buch‘ mit der linearen Anordnung eines [...] Buchstabenwurms ist, wie letztlich die
Sprache überhaupt, nur bedingt geeignet für das Thema, das ich mir hier vorgenommen habe. Der Versuch,
das Gesamtbild der vernetzten Wirklichkeit zu geben, die eigentlich nur simultan erfaßt werden kann, muss
daher zwangsläufig unvollkommen bleiben.“
Der Autor zweifelt also daran, sein Thema im Buch darstellen zu können, weil ein „Netz“ dafür benötigen
würde, und keinen Stab oder „Buchstabenwurm“, wie er es nennt. Ein Buch hat also keine dem Thema
adäquate Struktur.
Wir wissen, dass vor allem Hypertext die Chance bietet, linearen Text in kleinere Einheiten aufzubauen,
die dann modular miteinander verknüpft sind und dem Leser statt eines einzigen Weges je nach Anzahl der
Verknüpfungen exponentiell zahlreicher werdende Wege durch ein Dokument zu ermöglichen.
Allerdings gab es in der Schriftkultur schon immer Wege, diese lineare Struktur zu durchbrechen, denn das
Denken des Menschen ist ja nicht erst seit ein paar Jahren aus der Linearität des Buches herausgetreten:
Deshalb haben vor allem wissenschaftliche Texte schon immer mehrere Möglichkeiten der Lesbarkeit
gehabt und sprengen mit Fußnoten, Randbemerkungen, einer Gliederung und einem Index die Linearität
von Texten.
Stefan Münz bringt das folgendermaßen auf den Punkt, indem er folgende Unterscheidung macht – die uns
auch bei unserem Thema weiterhilft:
Es gibt in Hypertexten UND wissenschaftlichen Texten folgende Strukturen:
• monohierarchische (Kapitel, Unterkapitel)
• polyhierarchische (Querverweise)
• metahierarchische (Inhaltsverzeichnisse, Stichwortverzeichnisse)
In unserem Kurs geht es also um die metahierarchische Struktur der Site des IKP.
2
web by step lucie prinz + tamas lanyi gbr
muehlenweg 31
53619 rheinbreitbach
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Internet: www.web-by-step.de
Text als Raum?
In der Beschäftigung mit „Hypertext“ vollzieht eine Verlagerung der Perspektive, mit der auf Texte
geblickt wird: Nicht mehr der Text als Ganzes steht im Mittelpunkt des Interesses, sondern die Art und
Weise, wie Sinneinheiten miteinander verbunden sind. Hierbei entsteht dann leicht der Eindruck, dass
Texte, verstanden als Hypertext-Dokumente, eine räumliche Ausdehnung haben.
Man sollte nicht vergessen, dass das lineare Wesen der als „Sinneinheiten“ eingestuften Texte damit
zunächst nur überlagert, aber nicht aufgehoben wird. Hier ist auch eine Ursache für viele Verstehens- und
Umsetzungsprobleme im Zusammenhang mit Navigationsstrukturen zu suchen:
• Die meisten Texte auf Webseiten sind zu lang, um „Sinneinheiten“ eines Hypertextes zu sein
• Hypertext eröffnet dem Besucher die Möglichkeit, die Sinneinheiten scheinbar nach
Belieben zu kombinieren, also die Besuche der einzelnen Räume beliebig hintereinander zu
absolvieren – alle diese Kombinationsmöglichkeiten müssen von Autor daraufhin überprüft
werden, ob sie noch einen übergeordneten „Gesamtsinn“ ergeben – eine anspruchsvolle und
meist unterschätzte Aufgabe.
• Wir haben kaum Erfahrung damit, uns virtuell fortzubewegen. Der Wechsel zwischen freier
Wahl (was kommt jetzt, was als Nächstes wählen?) und die starre Führung innerhalb der
linearen Texte der Sinneinheiten läßt uns schnell ermüden und kann dazu verführen,
abzuschweifen (weitersurfen) und die Informationen der Sinneinheiten nur unvollständig zu
sammeln und damit verstehen zu können.
Zusammenfassend möchte ich festhalten, dass wir uns in diesem Seminar weniger mit der Ausgestaltung
der Sinneinheiten der Sorte „Text“ befassen, sondern ein vergleichsweise „leichteres“ Thema haben: Wir
sollen für die Homepage des IKP eine Navigationshilfe, sprich eine Sitemap erstellen. Die Problematik der
Bewertung von Texten als Sinneinheiten in Hypertext-Dokumenten berührt uns allerdings in einer
wesentlichen Hinsicht: Wir müssen das vorhandene Hypertext-Dokument so nehmen, wie es ist, sollten
aber prüfen, welche der möglichen „Wege“ durch das Dokument wir in der Benutzerführung favorisieren
und warum.
Metaphern und Darstellungsmodelle für Sitemaps (Beispiele)
In den beiden vorangehenden Teilen wurde schon deutlich, dass die Theorie des Hypertextes ohne die
Verwendung von Metaphern nicht auskommt. Metaphern haben deshalb auch nicht zufällig bei der
Konzeption von Websites eine herausragende Bedeutung.
Schaut man sich die Homepage das IKP genauer an, so wird auch hier eine Metapher bemüht, um die
Identität des Instituts, das eine Abbildung im Hypertext erfahren soll, zu transportieren:
Die Einstiegsseite zeigt das bekannte und schon lange existierende Institutsgebäude. In der Weiterführung
des Gebäudes als Strichzeichnung wird diese Bedeutung abstrahiert. Der Halbkreis mit den fünf
Hauptbereichen greift in diesen Abstraktionsgrad ein und führt direkt die Grundstruktur der Homepage vor.
Auch hier haben wir es mit dem Teil, den wir uns vorgenommen haben, mit einer grundsätzlich einfacheren
Aufgabe zu tun: Wir müssen für die Navigation durch Site eine geeignete Metapher finden, das heißt, wir
müssen prüfen, welcher der bekannten Ansätze der Hypertext-Theorie für unser Vorhaben der geeignetste
ist und dann diese Metapher prüfen und ausbauen.
Es gibt im Internet neben der klassischen Sitemap (die zunächst nichts anderes ist als ein vollständiger
Index der Site) diverse Modelle, wie eine Benutzerführung umgesetzt werden kann. Ich möchte hier einige
Modelle vorstellen. Sie alle müssen sich dem Anspruch stellen, die dem Hypertext eigene Struktur der
Verknüpfungen sinnfällig zu visualisieren. Aus diesem Grund bauen einige der Modelle auf mehr oder
weniger tragfähige Metaphern auf. Andere versuchen, aus den technischen Standards heraus das Problem
zu lösen. Der metaphorische Gehalt nimmt in meiner Liste kontinuierliche ab.
3
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Landkarten, Stadtpläne und Straßenkarten
Stadtpläne und Landkarten sind im WWW sehr beliebt. Sie erfüllen in diversen Formen diverse Aufgaben:
Sie dienen als Adressensammlung und als eindrucksvolle Standorts-Dokumentation für Unternehmen.
Die Beliebtheit beruht darin, daß den meisten Menschen der Umgang mit Karten vertraut ist: Die echte
Landschaft wird im Plan abstrahiert und vereinfacht.
Ein Beispiel – die Forschungslandkarte Deutschland: http://www.forschung.bmbf.de/index_d.htm, zeigt
diese Verwendung in einer sehr bündigen Form.
Das metaphorische Modell „Landkarte/Stadtplan“ kann aber noch weiter gehen und sich auch tatsächlich
von der reellen Welt lösen. Hierbei müssen bestimmte Funktionsmerkmale von Plänen bedacht und auf den
Zweck angepasst werden: Im Stadtplan sind zum Beispiel bestimmte Gebäude mit bestimmten Funktionen
als Symbole im Plan integriert. Genau diese Art der Verwendung wäre in unserem Projekt sinnvoll. Ein
Beispiel für eine solche Verwendung ist das Projekt
„DE DIGITALE STAD“
Hyperlink: http://www.dds.nl/
Das ist die Startseite
4
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Und das ist die zweite Seite
Sites, die Karten nicht metaphorisch, sondern als digitalisierte Erweiterungen von vorhandenen Plänen als
Dienstleistungen anbieten, können uns als Steinbrüche für nette Funktionen dienen.
So gibt es für die Stadt Hannover einen recht gut aufgemachten Stadtplan:
http://stadtplan.hannover.de/cgi-bin/kartensystem/hannover.cgi
5
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Tunnel/Guided Tours
Als Tunnel oder Guided Tours bezeichnet man geführte Einstiegsseiten, die ein Erstbesucher durchlaufen
muss oder kann. Hier bekommt der Besucher die gesamte Site und Ihren Funktionsumfang erklärt. Tunnel
sind in der Umsetzung recht aufwendig, wenn man das Prinzip ernst nimmt und den Tunnel auch als
Navigationshilfe und nicht als Werbegag (wie meistens) verwendet. Außerdem muss ausgeschlossen
werden, dass der Tunnel von allen Besuchern immer wieder durchlaufen werden muss.
Der Tunnel ist eine Variante einer bekannten Navigationshilfe, nämlich der Online-Hilfe:
Eine Hilfefunktion ist in der Regel so aufgebaut, dass über einen Stichwort-Index das gesuchte Thema
ausgewählt werden kann. Zwischen allen Themen gibt es Querverbindungen, so dass der Anwender
jederzeit weiterführende Informationen findet, also niemals ohne Hilfestellung bleibt.
Um den Überblick zu behalten, sind immer die Schaltflächen „Inhalt“, „Index“ und „Zurück“ erreichbar.
Beim Aufbau von Hilfen werden die nötigen Querbindungen aus dem Inhalt heraus entwickelt. Es werden
Indizes erstellt, die alle für die Hilfe relevanten Stichwörter enthalten. Die eigentlichen Hilfethemen sind
„klassisch“ als Kapitel angeordnet und auch so verfasst worden, wobei ein strenger Styleguide den
Sprachgebrauch der Autoren regelt, um brauchbare Indizes erzeugen zu können.
Die Erklärung einer Funktion bildet bei einer Hilfe eine einzelne Sinneinheit. Mehrere dieser Sinneinheiten
sind linear hintereinander geschaltet und zusätzlich über Stichwörter als Sprungmarken miteinander
verbunden. Sie ergeben zusammen die einzelnen Hilfe-Kapitel.
Mit diesem Aufbau können gleichzeitig zwei Anwender-Gruppen unterstützt werden:
• Diejenigen, die über das Stichwort suchen, wollen möglichst rasch die kleinste Sinneinheit
und damit die gesuchte Information erreichen. Es geht um eine Schnellhilfe
• Diejenigen, die einen Funktionskomplex kennen lernen möchten, können über die
Inhaltsangabe die Kapitel der Hilfe auf herkömmlichem Weg linear erfassen.
Wirklich überzeugende Beispiele für solche Guided Tours und Online-Hilfen habe ich keine gefunden,
aber der Ansatz lohnt der Überprüfung.
Hier ein Tunnel zum Abgewöhnen: http://www.prang.ch/
6
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Netze und Nervensysteme
Diese Metapher ist schwieriger umzusetzen. Als Beispiel habe ich lediglich folgende Site gefunden, die
zumindest den Gedanken des Netzes aufnimmt, allerdings nicht lange durchhält. Nacamar, ein InternetProvider, hat auf seiner Site das metaphorische Konzept angewendet.
http://www.nacamar.de
7
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Baumstrukturen und Verzeichnisbäume
Verzeichnisbäume sind mit klassischen Sitemaps eng verwandt. Sie sollen die Liste der Gliederungen für
den Betrachter leichter fassbar machen, indem die einzelnen Sinneinheiten entlang den Ästen eines Baumes
angeordnet werden. Allerdings scheitert dieser Versuch bei umfangreichen Sites, wenn man alle Äste
gleichzeitig darstellen möchte.
Bei Mannesmann-Mobilfunk wird das Darstellungsproblem recht deutlich:
http://www.d2privat.de/cfdocs/sitemap.cfm
Systeme, die dieses Problem umgehen möchten nähern sich unweigerlich der bekannten WindowsVerzeichnisstruktur.
Ansicht Nummer 1
Ansicht Nummer 2
Je tiefer man in den Index vordringt, umso feinere Detailansichten aus der gesamten Struktur erhält man.
Die Darstellung paßt sich dem „Weg“ des Besuchers entlang der Äste an. Hierdurch bleibt die Struktur am
Bildschirm übersichtlich und damit für den Nutzer leichter fassbar. Allerdings: ungeübte Nutzer müssen
sich zunächst daran gewöhnen, dass der zurückgelegte Weg nicht sichtbar ist.
Für unseren Zweck lohnt es sich also, das Bild des „Baums“ nochmals gründlich zu prüfen.
8
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Sitemaps und Indizes
Der Index ist die klassische Form der Sitemap. Er geht unmittelbar aus dem Storyboard einer Site hervor,
bildet also in der Regel bereits einen festen Bestandteil des Konzeptes. Der Charakter von Sitemaps ist
streng hierarchisch: Die Abhängigkeiten werden in Form von Gliederungen dargestellt. Auf die Darstellung
von Querverbindungen oder assoziativen Verknüpfungen wird verzichtet. Sitemaps und Indizes sind für die
meisten Nutzer leicht zu bedienen, weil sie bereits aus der Buchkultur bekannt sind.
Entsprechend habe ich diverse Beispiele gefunden, die zeigen, was Sitemaps leisten. Das Hauptproblem der
Sitemaps besteht in der strengen Hierarchie und der daraus resultierenden Darstellung in Form von
Hyperlink-Listen. Kommen mehrere Verschachtelungsebenen hinzu, kann so eine Sitemap sehr
unübersichtlich werden:
Condor-Versicherungen bietet seinen Kunden per Sitemap einen solchen Seiten-Index an:
http://www.condor-versicherungen.de/Wohin.html
Die Universität Witten/Herdecke bietet für den Fachbereich MikroTherapie ebenfalls einen hierarchisch
organisierten Index an.
http://www.microtherapy.de/sitemap.html
9
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Nutzergewohnheiten und Grenzen der Wahrnehmungsfähigkeit
Das WWW als aktives Medium
Bereits in der Zusammenfassung der Hypertext-Theorien wurde deutlich, dass das WWW einen
eigentümlichen Charakter hat: Keine Information erreicht den Besucher „von selbst“, dass heißt, alle unsere
Erfahrungen mit elektronischen Medien wie Radio und Fernsehen helfen nicht weiter, weil der Hypertext
wie kein anderes modernes Medium vor ihm unmittelbar an die Buchtradition anknüpft – und wer kann
schon jemanden zwingen, ein Buch zu lesen?
Auf unsere Aufgabenstellung gemünzt, müssen wir uns bei der Auswahl der Modelle und deren Umsetzung
fragen: Was sollen wir tun, damit die Besucher der Site unsere Navigationshilfe auch in Anspruch nehmen?
Wir wollen ja nicht für uns, sondern für das IKP und die Besucher entwickeln. Hierzu gibt es ein paar
praktische Fragen, auf die wir eine Antwort geben sollten:
• Welche Erfahrungen haben die Teilnehmer gemacht, als sie die Homepage zum ersten Mal
besucht haben?
• Gibt es Bereiche, die besonders häufig aufgesucht werden?
• Gibt es Bereiche, die notorisch schwer zu finden sind?
• Gibt es Bereiche, die sich ständig ändern?
Jeder geht seinen Weg
Die Individualität der Nutzer und deren Gewohnheit darf nicht unterschätzt werden. Um hier mehr zu
wissen, müssen wir im Kurs eine Aussage treffen, wen wir als Besucher unserer Site erwarten und welche
Erfahrungen diese Besucher in der Bedienung von Software haben.. Vielleicht können uns die Betreuer der
Homepage auch statistische Informationen zum Verhalten der Besucher überlassen. Wenn wir die Wege
der Besucher kennen, wissen wir wenigstens, wo wir Wegweiser aufstellen müssen und wo das unnötig ist.
In jedem Fall empfiehlt es sich, den Besuchern mehrere Hilfestellungen zu geben. Die Homepage des IKP
hat bereits eine Suchmaschine. Wenn nun zusätzlich eine Sitemap und ein Guide, der vielleicht beim
Aufruf der Startseite zuerst aufklappt und vom Besucher auch weggeschaltet werden kann, integriert sind,
kann kein Besucher mehr darüber klagen, dass die Inhalte nicht auffindbar sind.
Wieviel Information darf's denn sein?
Bei den Indizes wurde es schon deutlich: Eine lange Liste mit Kapiteln und Unterkapiteln kann vom
Besucher nicht wirklich erfasst werden. Bei jedem Besuch beginnt die Suche also erneut (Wo muss ich
draufklicken? Wie hieß denn der Titel der Seite?). Ist eine Navigation gut gelöst, lädt sie die Besucher ein,
die Site zu erkunden. Sie macht neugierig auf den Inhalt, weil sie den Besucher nicht erschlägt.
Untersuchungen haben ergeben, dass eine Übersicht mit sieben Punkten gleichzeitig gerade noch von
Besuchern erfasst werden kann.
Die eher mit Metaphern arbeitenden Modelle haben den Vorteil, dass der Besucher zwei Dinge erhält:
• weniger Informationen auf einen Schlag und deshalb eine höhere Chance, die einzelnen
Sinneinheiten besser zu überblicken
• mehr Anreize, das zu Erfassende mit anderen Eindrücken zu verbinden und damit die
Chance, den Inhalt besser im Bewusstsein zu verankern. Je konsequenter man eine Metapher
durchhält, umso leichter kann sich der Besucher einer Site den einmal gewählten Weg
merken.
10
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Regeln und Hilfestellungen für die Umsetzung
Der Bildschirm: kein "weißes Blatt"
Die bisherige Praxis bei der Gestaltung von Benutzerschnittstellen in der Software-Entwicklung hat für die
Aufteilung von Bildschirmen gewisse Standards entstehen lassen, die auch das Screen-Design für das
Internet durchaus beeinflussen sollten. Dies gilt insbesondere für Anwendungen, bei denen die Navigation
im Mittelpunkt steht. Die Vorgaben lassen sich ungefähr so zusammenfassen:
Der Bildschirm zerfällt horizontal in drei Teile:
Am oberen Rand befindet sich die Menüleiste mit diversen Funktionen.
Sogar die thematische Reihenfolge ist in vielen Programmen gleichartig umgesetzt. Am Beispiel Word
zeigt sich das am deutlichsten. Von links nach rechts finden wir folgende Anordnung:
1.
2.
3.
4.
5.
6.
Dateiverarbeitung
Dateibearbeitung
Datei-Darstellung
Formatierung (Autoinhalte, Einzelformatierung)
Optionen und Einstellungen
Hilfe und Information
Die Menüleiste: Von der Funktion zum Inhalt
Wenn wir diese Anordnung verallgemeinern, erreichen wir eine Hierarchie, die von der rein funktionalen
Betrachtung der Datei und den Operationen, die ich damit machen kann über die Bearbeitung, Darstellung
und Formatierung der konkreten Datei bis hin zu Zusatzfunktionen, die man als Programm-Verwaltung
verstehen kann, reicht.
Das Schema, das sich daraus für eine standardisierte Menüleiste ergibt, ist das Folgende:
FUNKTION
|
INHALT und FORM
|
META-INFORMATION
Die Anzeige der Daten
Im mittleren, größten Teil des Bildschirms, werden die Daten angezeigt.
Dieser Teil ist die eigentliche Arbeitsfläche. Betrachtet man den gesamten Bildschirm inklusive Browser,
könnte man annehmen, dass die Hypertext-Einheit nur der Inhalt sei und sich dann frei von den hier
beschriebenen Vorgaben fühlen. Das geschieht auch recht häufig, allerdings zeichnen sich gute Webseiten
dadurch aus, dass Sie die vorgegebene Anordnung durch das umgebende Client-Programm nicht
willkürlich konterkarieren.
Die Statusanzeige
Am unteren Bildschirmrand ist die Statusanzeige zu finden. Hier werden alle Operationen, die der
Anwender unternimmt, angezeigt.
Zusatzmenüs und interne Navigation: Oben, rechts oder links?
Hierfür gibt es keine übergreifenden Standards, weil sie von der Art der Anwendung abhängen.
Folgende Arten der Darstellung haben sich allerdings etabliert:
a) Ausklappbare Untermenüs für die Menüleiste
b) Kontext-Menüs, die frei auf dem Bildschirm angezeigt werden
c) Eine zusätzliche Navigation oder Anzeige links (meist bei Verzeichnisstrukturen)
d) Ein „Werkzeug-Fenster“ im rechten Bereich des Bildschirms (bei Grafik-Programmen)
11
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
Bei der Konzeption von Internet-Seiten gibt es für die Darstellung von Untermenüs ein paar
Erfahrungswerte, die ich hier zusammenstellen möchte:
• müssen in der Menüleiste oben Untermenüs von mehr als 7 Punkten integriert werden, sollte
man davon absehen und die Unternavigation auf den linken oder rechten Bildschirmrand
verlegen.
• Der Seitenaufbau einer Internet-Seite erfolgt immer aus der oberen linken Ecke. Man muss
bei der Wahl der Seite für die Unternavigation also entscheiden, was zuerst da sein soll: Der
Inhalt oder die Unternavigation
• Schaltflächen für Meta-Informationen wie die Suche, Indizes oder Online-Hilfen gehören in
den rechten oberen Bildschirmrand. Handelt es sich um ausgereifte eigene Anwendungen
(Online-Hilfe) ist die Technik der PopUp Fenster einer Überlegung wert: Damit verhält sich
diese Funktion wie eine Werkzeugleiste.
• Die Statusanzeige kann auf der Internet-Seite nur selten verwendet werden. Allerdings
gehören Informationen wie die eMail des Webmasters, das Datum der letzten Aktualisierung
und sonstige Zusatz-Infos an den Schluss der Seite.
• Der untere Bereich kann in Ausnahmefällen auch für Menüfunktionen verwendet werden,
wenn man Inhaltsnavigation und Funktionsnavigation aufgrund der Menge der zu
verwendenden Punkte teilen möchte und zusätzlich ein Frameset wählt, so dass die beiden
Ränder den Bildschirm einfassen: Auf diese Weise lassen sich Inhalte oben und die
Funktionsnavigation (Blättern, Suchen...) am unteren Bildschirmrand anordnen.
Grundsätzliches zu Farbe und Raum
Wenn man eine Internet-Seite gestalten möchte, muss man wissen, woher das Licht kommt. Bei den
meisten Bildschirmen ist das Licht in der linken oberen Ecke am hellsten und bildet also eine Art
„Lichtquelle“. Will man Gegenstände räumlich darstellen, sollte also der Schatten nach rechts unten zeigen.
Hell/Dunkel-Verläufe auf dem Bildschirm dienen der räumlichen Gestaltung. Hierbei ist zu beachten, dass
eine Anordnung der helleren Farbe im oberen Teil und der dunkleren im unteren Teil den Eindruck von
Tiefe vermittelt. Man kann diesen Effekt noch verstärken, indem man die Schnittstelle, an der zwei Farben
wechseln (das ist auf einer Horizontlinie) dunkler darstellt als die beiden Reinfarben oben und unten. Dann
wirkt die „Landschaft“ fast echt.
Die Bestimmung der Farben, die für eine Internet-Seite (Hintergrund, Schriftfarbe, Hyperlink-Farben)
verwendet werden, ist nicht unerheblich für die Navigierbarkeit der Anwendung: In vielen Fällen wird
nicht darauf geachtet, dass die Texte eventuell ausgedruckt werden müssen. Wählt man also eine dunkle
Farbe als Hintergrund, kann es passieren, dass der Client den Text nicht ausdrucken kann, weil die
Browsereinstellung auf diese Fälle nicht angepasst wurde.
Auch die Wahl und die Anzahl der unterschiedlichen Farben, die für die Schrift in Frage kommen,
entscheidet darüber, ob ein Text übersichtlich ist oder nicht: Einen Hyperlink sollte man zum Beispiel
immer schon an seiner besonderen Farbe erkennen können.
12
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99
"10 Regeln" für gutes WWW-Design
Hier zitiere ich einfach einige der manchen vielleicht schon bekannten Regeln. Ein Dank an Oliver Klee,
der mir eine gute Adresse für diese und andere Fragestellungen genannt hat:
Jakob Nielsen's Alertbox unter http://www.useit.com/alertbox/
1. Place your name and logo on every page and make the logo a link to the home page (except on the
home page itself, where the logo should not be a link: never have a link that points right back to the
current page).
2. Provide search if the site has more than 100 pages.
3. Write straightforward and simple headlines and page titles that clearly explain what the page is about
and that will make sense when read out-of-context in a search engine results listing.
4. Structure the page to facilitate scanning and help users ignore large chunks of the page in a single
glance: for example, use grouping and subheadings to break a long list into several smaller units.
5. Instead of cramming everything about a product or topic into a single, infinite page, use hypertext to
structure the content space into a starting page that provides an overview and several secondary
pages that each focus on a specific topic. The goal is to allow users to avoid wasting time on those
subtopics that don't concern them.
6. Use product photos, but avoid cluttered and bloated product family pages with lots of photos. Instead
have a small photo on each of the individual product pages and link the photo to one or more bigger
ones that show as much detail as users need. This varies depending on type of product. Some products
may even need zoomable or rotatable photos, but reserve all such advanced features for the secondary
pages. The primary product page must be fast and should be limited to a thumbnail shot.
7. Use relevance-enhanced image reduction when preparing small photos and images: instead of
simply resizing the original image to a tiny and unreadable thumbnail, zoom in on the most relevant
detail and use a combination of cropping and resizing.
8. Use link titles to provide users with a preview of where each link will take them, before they have
clicked on it.
9. Ensure that all important pages are accessible for users with disabilities, especially blind users.
10. Do the same as everybody else: if most big websites do something in a certain way, then follow along
since users will expect things to work the same on your site. Remember Jakob's Law of the Web
User Experience: users spend most of their time on other sites, so that's where they form their
expectations for how the Web works.
Verfasserin: Lucie Prinz.
Im Rahmen des Blockseminars EDV II am IKP Bonn im Wintersemester 1999/2000
13
muehlenweg 31
Tel.: 02224 - 77 97 66
Fax: 02224 - 77 97 99

„Navigieren im WWW“ – Sitemaps und andere Navigationshilfen

Transcription

Similar documents

Otto Heinrich Kühner – Meine Damen und Herren!

LWL · Jüdisches Leben in Europa jenseits der Metropolen · Hilfe

Dash 3000/4000 Patienten-Monitor

Ausgabe 20/2016 - Weingarten im Blick

anzahl aussteller leipziger buchmesse 2007

Eine Vereins-Website erstellen

Literatur, Links und Projekte