Upload
clare-davis
View
22
Download
1
Embed Size (px)
DESCRIPTION
Usability - Kriterien für Web -Anwendungen. Oxana Paul. Motivation. Web-Usabillity ist ein Begriff, bei dem es sich um die ergonomische Gestaltung von Web-Anwendungen handelt. Ziel des Betreibers: dem Nutzer bestmögliche Funktionalität und Präsentation zu bieten. - PowerPoint PPT Presentation
Citation preview
1
Usability - Kriterien für Web -Anwendungen
Oxana Paul
2
Motivation
Web-Usabillity ist ein Begriff, bei dem es sich um die ergonomische Gestaltung von Web-Anwendungen handelt.
Ziel des Betreibers: dem Nutzer bestmögliche Funktionalität und Präsentation zu bieten.
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
3
Gebrauchstauglichkeit
Effektivität: Erreicht der Benutzer einer Web-Anwendung seine Ziele?
Effizienz: Wie hoch ist der Aufwand zur Erreichung des Ziels?
Zufriedenheit: Mag der Benutzer die Web-Anwendung?
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
4
Bestandteile einer Web-Anwendung
Content (Inhalt)
Inhalte, die eine Web-Anwendung zur Verfügung stellt.
Hypertext (Navigationsstrukturen)Wo bin ich? Woher komme ich? Wohin will ich gehen?
Präsentation (Benutzungsschnittstelle)
Benutzerfreundliche Darstellung der Web-Anwendung am Bildschirm
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
5
Hypertext (Navigation)
Wo bin ich? Zumindest ein gut platzierter Titel sollte dem Benutzer mitteilen
wo er sich gerade befindet Woher komme ich?
Hierbei hilft meistens der Browser mit der „Zurück“ Schaltfläche Wohin will ich gehen?
Kinderknoten vorführen Navigationsstrukturen:
Lineare Struktur Hierarchische Struktur Netzwerkstruktur Gitterstruktur
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
6
Lineare Struktur
Ähnelt einem Zug Beispiel: diverse Tutorials Nachteil: wer in den Mittelteil springen will, muss sich
erst durch vorgehenden Seiten kämpfen.
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
7
Hierarchische Struktur (Baumstruktur)
von einer Startseite gelangt der Surfer zu verschiedenen Unterseiten
Surfer muss wissen, auf welcher Ebene er sich befindet.
Möglichkeiten haben auf- bzw. abzusteigen.
Beispiel: Yahoo - und Uni-Seiten
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
8
Baumstruktur (Beispiel)
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
9
Netzwerkstruktur
Diese Strukturen sind ungeordnet
Problem: durch Unordnung kann Chaos entstehen
Beispiel: das WWW selbst.
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
10
Gitterstruktur
Bringt zwei Variablen in Zusammenhang
Beispiel: Universitäten:
Fakultäten/Forschung, Lehre, Skripte, Kurse
Voraussetzungen: Alle Variablen sind gleich wichtig Visualisierung der
Zusammenhänge
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
11
Komplexitätsgrad der Strukturen Von einfach bis komplex: Linear Gitter Hierarchie NetzwerkJe höher der Komplexitätsgrad der Struktur desto:
- komplexere Inhalte können vermittelt werden- komplexer wird die Anwendung- flexibler ist die Struktur
In Wirklichkeit wird eine größere Site sich mehrerer Strukturen gleichzeitig bedienen.
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
12
Präsentation (Übersicht)
Schriftarten Welche Schriftarten sind für das Lesen am Bildschirm
besser geeignet? Anti-Aliasing Farben
Welche Farben sind besser für Hintergrund als für die Schrift geeignet?
Struktur Verschiedene Gliederungsarten der Elemente für die
bessere Klarheit
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
13
Präsentation
Keine Blockbuchstaben: Mensch ließt Wörter als ganzes und orientiert sich dabei an der äußeren Form der Wörter
Schriftarten: Bildschirmschriften sind schlechter zu lesen
Generell: Serifen erhöhen die Lesbarkeit im Print, reduzieren sie aber am Bildschirm
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
14
Präsentation(2)
Aliasing: Buchstaben werden als einzelne Pixel dargestellt =>Treppcheneffekt
Anti-Aliasing schaltet dieses Effekt aus.
Farben: verschiedene Farben eignen sich besser oder schlechter für die Schrift
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
15
Bildschirmmaskengestaltung(4)
Strukturiertheit und Klarheit:
Optische Gliederungen ausdrücken durch Schriftgrößen
Bezüge durch Positionierung oder Verschachtelung
Optische Gliederung zur Erklärung der Seite
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung
16
Fazit
Navigation Angepasst an die Ziele und Erwartungen des Nutzers Dem Nutzer bei der Navigation alternative Wege bieten Intuitiv funktionierende Navigation Konsistenz
Präsentation Keine Blockbuchstaben Keine Serifen Elemente optisch gliedern Thematisch zusammengehörige Bereiche zusammenfassen
Ziele der Gestaltung einer Bestandteile: 1.Content 2.Hypertext 3.Präsentation FazitWeb-Anwendung