Home >Design >Handbuch der Webnavigation
Handbuch der Webnavigation
Date post:11-Nov-2014
Category:Design
View:7,256 times
Download:1 times
Share this document with a friend
Description:
Die coolste Website floppt, wenn die Navigation nicht durchdacht ist. Der Website-Besucher ist wie ein scheues Reh, das sofort flieht, wenn es sich unwohl fhlt. Gute Webnavigation ist nicht nur Programmierwissen, sondern die Kenntnis darum, wie Menschen nach Informationen suchen und sie hoffentlich dann auch finden. Das Handbuch der Webnavigation lehrt den Leser das geeignete Design eines Navigationssystems, abgestimmt auf die exakten Bedrfnisse der jeweiligen Website. Das Buch erlutert die Grundprinzipien von gutem Design, analysiert Webnavigation aus User-Sicht und gibt unzhlige praxisrelevante Profitipps. Mehr Informationen erhalten Sie unter: http://www.oreilly.de/catalog/handbuchwebger/index.html
Transcript:
<ul><li> 1. InhaltsverzeichnisVorwort. . . . . . . . . . . . . . . . . . . . . . . . . . . . VIII03 Navigationselemente . . . . . . . . . . . . . . . . 56Schrittweise Navigation57 Teil I Navigation mittels Nummerierung58 Grundlagen der Webnavigation Brotkrmel-Navigation62Navigationselemente mit Baumstruktur 65Sitemaps 6501Webverzeichnisse 68 Einfhrung in die Webnavigation . . . . . . . 2Tag-Clouds 69 Navigation verstehen3AZ-Indizes69 Die Notwendigkeit von Navigation5Menleisten und -Reiter71 Webnavigationsdesign19 Vertikale Mens74 Zusammenfassung 22 Dynamische Mens 75 bungsfragen22 Drop-down-Mens78 Weiterfhrende Literatur23 Navigation per Informationsvisualisierung79Browsereigene Navigationsmechanismen 82Zusammenfassung8402bungsfragen 84 Grundlagen der Navigation . . . . . . . . . . 24 Weiterfhrende Literatur 85 Informationssuche 26 Informationssuche online31 Benutzerverhalten beim Browsen im Web 33 04 Informations-Gestalt42Navigationstypen . . . . . . . . . . . . . . . . . . . 86 Informationen erleben 46 Navigationskategorien 88 Zusammenfassung 52 Seitentypen107 bungsfragen53 Zusammenfassung118 Weiterfhrende Literatur55 bungsfragen 119Weiterfhrende Literatur 120 </li></ul><p> 2. 0507 Navigation beschriften . . . . . . . . . . . . . 122Analyse . . . . . . . . . . . . . . . . . . . . . . . . . . . . 170Das Vokabularproblem123Unternehmensziele 171Was gute Beschriftungen ausmacht125Den Inhalt der Website verstehen176Das System der Beschriftungen 133Die Technologien der Website verstehen179Persuasive Linktexte139Die Benutzer der Website verstehen184Navigationsbeschriftungen bersetzen141Direkte Benutzeruntersuchungen187Quellen fr Navigationsbeschriftungen 142Auswertung der Untersuchungsergebnisse195Zusammenfassung 143Szenarios 200bungsfragen144Zusammenfassung 202Weiterfhrende Literatur145bungsfragen203 Weiterfhrende Literatur204 Teil II08 Ein Framework fr das Navigationsdesign Architektur . . . . . . . . . . . . . . . . . . . . . . . . 206 Persuasive Architektur20806 Navigationskonzept209 Evaluierung . . . . . . . . . . . . . . . . . . . . . . . . 148 Informationsstruktur215 Merkmale einer wirksamen Navigation 149 Organisationsschemen223 Evaluierungsmethoden157 Sitemaps227 Zusammenfassung 167 Zusammenfassung 235 bungsfragen168 bungsfragen236 Weiterfhrende Literatur169 Weiterfhrende Literatur237 II N h a lT s e r z e I c h N I s 3. 09 12 Layout . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 238 Navigation und Die Navigationspfade bestimmen 240 Social-Tagging-Systeme . . . . . . . . . . . . 320 Visuelle Logik 243 Tagging321 Templates253 Tags und Navigation325 Wireframes 259 Zusammenfassung345 Zusammenfassung262 bungsfragen 346 bungsfragen 263 Weiterfhrende Literatur 347 Weiterfhrende Literatur 2641310Navigation und Oberflchengestaltung . . . . . . . . . . . . . 266Rich Web Applications . . . . . . . . . . . . . . 348Informationsdesign 267Rich Web Applications 349Interaktionsdesign 276Navigation von Rich Web Applications353Grafikdesign 282Design von Rich Web Applications369Die Navigation beschreiben 288Zusammenfassung 379Zusammenfassung291bungsfragen380bungsfragen 292Weiterfhrende Literatur381Weiterfhrende Literatur 293Literaturnachweis . . . . . . . . . . . . . . . . . . 382Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 390 Teil III Navigation in speziellen Anwendungen11 Navigation und Stichwortsuche . . . . . 296Navigation vor der Stichwortsuche297Navigation nach der Stichwortsuche 300Facettennavigation 307Zusammenfassung316bungsfragen 317Weiterfhrende Literatur 318 I N h a lT s e r z e I c h N I s II 4. Dieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009 http://www.oreilly.de/catalog/handbuchwebger/ Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9 Navigationstypen Alles sollte so einfach wie mglich sein, aber nicht einfacher.wird albert einstein zugeschrieben 04i n diesem k api T el- strukturelle Navigation - assoziative Navigation - Utility-Navigation - seiteninterne links - Navigationsseiten - Inhaltsseiten - Funktionelle seiten 86 N a I g aT I o N s T y p e N 5. Nicht alle Navigationselemente einer website sind gleich. es ist Ihre auf- gabe, sie auszusuchen. sie mssen den zweck und die Bedeutung der Navi- gation innerhalb Ihrer website bestimmen, hnliche optionen gruppieren und als zusammenhngende einheit darstellen. zwar gibt es gepflogen-Dieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009http://www.oreilly.de/catalog/handbuchwebger/Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9 heiten, mit denen sie beginnen knnen Menleisten und Tabs werden gewhnlich fr die hauptnavigation verwendet und vertikale Mens auf der linken seite fr die lokale Navigation , aber es existieren keine festen anwen- dungsregeln und es gibt viele ariationen. Um die passenden auszuwhlen, mssen Sie wie ein Benutzer denken, nicht wie ein designer. nehmen Sie sich Zeit, um heraus- zufinden, wie die Benutzer die navigationselemente wahrnehmen. Benutzer knnen die ntzlichkeit von links in einem men leichter einschtzen und sich auf neuen Seiten schneller zurechtfinden, wenn sie den navigationstyp des mens verstehen.doch was macht eine hauptnavigation zur hauptnavigation? Was unterscheidet verwandte links von lokaler navigation?navigationstypen unterscheiden sich durch mehrere aspekte: die art des inhalts, auf den mit dem navigationselement zugegriffen wird das Verhalten der links in der navigation und die berleitung zur nchsten Seite die vom navigationselement untersttzten Suchfunktionen und -modi die visuelle aufbereitung der optionen in der navigation die position eines navigationselements auf der Seite darber hinaus hngt der Zweck eines navigationsmens stark von der art der Seite ab, auf der das men erscheint. die navi- gation auf Startseiten ist normalerweise anders als zum Beispiel auf produktseiten, und Benutzer erwarten ganz bestimmte navigationselemente auf Suchergebnisseiten. auch die rolle der Seite innerhalb der gesamten Website wirkt sich auf die zu verwendenden navigationstypen aus.alle diese aspekte spielen zusammen und ermglichen es den Benutzern, eine hauptnavigation auch wirklich als hauptnavi- gation zu erkennen und eine lokale navigation als lokale navigation. das ist die Voraussetzung fr die interaktion mit der navi- gation und mit der Website als ganzes.dieses Kapitel soll ihnen helfen, dafr zu sorgen, dass die navigationskonzepte auf ihren Websites den Benutzern sofort klar sind. es behandelt die verschiedenen navigationstypen und ihre Funktionen sowie die wichtigsten arten von Webseiten. Bercksichtigen Sie beim Weiterlesen bitte, dass es unter designern keine standardisierte Fachsprache gibt und die terminolo- gie bezglich navigation und navigationstypen groe abweichungen aufweisen kann. daher wurden in den Beschreibungen in diesem Kapitel wo immer mglich auch alternative Begriffe mit angegeben. dennoch kann es sein, dass in ihrem Unterneh- men oder ihrer institution noch andere (oder sogar entgegengesetzte) Begriffsverwendungen blich sind. das Ziel bleibt jedoch in jedem Fall dasselbe: die rolle und den Zweck einer navigation zu verstehen. N a I g aT I o N s K aT e g o r I e N 87 6. n av i g aT i o n s k aT e g o r i e ndie meisten navigationstypen lassen sich in drei primrkategorien1 zusammenfassen (siehe abbildung 4-1):StrukturellDieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009http://www.oreilly.de/catalog/handbuchwebger/Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9Verbindet zwei Seiten basierend auf der hierarchischen Struktur der Website. Betrifft alle Seiten, auf denen Benutzererwarten, dass sie sich zur bergeordneten Seite und zu den untergeordneten Seiten weiterbewegen knnen.AssoziativVerbindet Seiten mit hnlichen themen und inhalten unabhngig von ihrer position innerhalb der Website-Struktur. dienavigations-links berschreiten dabei oft strukturelle grenzen.UtilityVerbindet Seiten und Features, die bei der Benutzung der Website selbst helfen sollen. diese knnen auerhalb derhaupthierarchie der Website liegen, und ihre einzige gemeinsamkeit ist ihre Funktion. strukturell assoziativ Utility Abbildung 4-1 / die drei primrkategorien der navigation (nach Fiorito und dalton)S T R u K T u R E L L E N AV I G AT I O N Wie der Begriff schon nahelegt, folgt die strukturelle navigation der Struktur einer Website. Sie ermglicht den Benutzern, sich innerhalb der Website-hierarchie nach oben und unten zu bewegen. die strukturelle navigation kann weiter unterteilt werden in zwei typen: die hauptnavigation und die lokale navigation.h A u P T N AV I G AT I O N auch globale navigation oder primrnavigation genannt.die hauptnavigation reprsentiert im allgemeinen die Seiten auf der obersten ebene der Website-Struktur bzw. die Seiten1 siehe die prsentationen von David Fiorito und richard Dalton, anguard group, auf den Ia summits in 2004 und 2005: creating a consistent enterprise web Navigation solution (www.iasummit.org/00/finalpapers/73/73_Handout_or__final__ paper.ppt) und Thinking Navigation (www.iasummit.org/005/finalpapers/101_Presentation.ppt).88N a I g aT I o N s T y p e N 7. unmittelbar unterhalb der Startseite. Bei den links in der hauptnavigation geht man blicherweise davon aus, dass sie zu Seiten innerhalb der Website fhren und sich sehr konsistent verhalten. die Benutzer erwarten, dass sie nicht auf vllig untypischen Seiten landen, wenn sie den links in der hauptnavigation folgen. innerhalb der hauptnavigation gibt es auf den verschiedenen Seiten normalerweise nur geringe Unterschiede. Dieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009 http://www.oreilly.de/catalog/handbuchwebger/ Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9 insgesamt untersttzt die hauptnavigation eine Vielzahl von Benutzeraktionen und modi zur informationssuche, einschlie- lich der Suche mit klarem informationsziel, das Stbern und auch das Wiederfinden von informationen. aus der Sicht der Benutzer spielt die hauptnavigation bei der nutzung der Website eine entscheidende rolle: die hauptnavigation bietet einen berblick und beantwortet wichtige Fragen von Benutzern, wenn sie die Website zum ersten mal besuchen, wie zum Beispiel hat diese Website, wonach ich suche? die hauptnavigation hilft bei der orientierung. Vor allem auf groen, informationsreichen Sites ist ein ber die ganze Website hinweg bestndiges navigationselement fr die Benutzer angenehm. die hauptnavigation ermglicht den Benutzern, zwischen den themen zu wechseln. Besucher der Website knnen mit den optionen der hauptnavigation schnell zu anderen rubriken der Site gelangen oder ihren bisherigen navigations- pfad zurcksetzen und neu beginnen. die hauptnavigation hilft den Benutzern weiter, wenn sie in ihrer navigation unterbrochen worden sind, und erinnert sie, wo auf der Website sie sich gerade befinden. Und schlielich verleiht die hauptnavigation einer Website auch profil und definiert auf verschiedene Weise, wie die Website sich von anderen Sites abgrenzt.die hauptnavigation wird oft innerhalb eines globalen, die ganze Website bergreifenden navigationsbereichs dargestellt, der im allgemeinen auch das Website-logo und die Utility-navigation enthlt. Wie der name global schon impliziert, erscheint dieser Bereich in der regel an einer einheitlichen Stelle auf allen oder fast allen Seiten einer Website.Betrachten Sie zum Beispiel den globalen navigationsbereich der Website der Universitt Valencia (www.uv.es, abbildung 4-2). links unter dem logo befinden sich die sechs optionen der hauptnavigation und rechts einige links zu hilfsseiten wie der Sitemap und der Suchfunktion der Website. typisch ist auch ein designelement wie ein Bild oder eine grafik zur Untersttzung des Brandings der Website. Abbildung 4-2 / der globale navigationsbereich auf der homepage der Universitt Valencia N a I g aT I o N s K aT e g o r I e N89 8. Kritiker einer immer prsenten globalen navigation verweisen auf die Verschwendung wertvollen Bildschirmplatzes. diese Bedenken sind vollkommen berechtigt. der globale navigationsbereich in abbildung 4-2 nimmt einen recht erheblichen teil der Seite im Browserfenster ein, und die designer wrden gut daran tun, ihn zu reduzieren, vor allem auf den inhaltsseiten unterhalb der homepage. es geht aber nicht darum, ob eine globale navigation verwendet werden sollte oder nicht, sondernDieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009http://www.oreilly.de/catalog/handbuchwebger/Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9 wie prominent und bestndig sie sein sollte. dies hngt von mehreren Faktoren ab:Gre der Websitegroe Websites mit tausenden von Seiten profitieren eher von einem ber alle Seiten hinweg bestndigen navigations-element. Kleinere Seiten knnten auch alleine durch Breadcrumbs oder verwandte links navigierbar sein.Benutzerverhalten und -bedrfnisseerstellen Sie keine hervorstechende und immer gleichbleibende hauptnavigation nur um ihrer selbst willen. Sie mssenihre Benutzer und deren informationsbedrfnisse verstehen und ihr design entsprechend daran ausrichten.Bedrfnisse des UnternehmensUnternehmen haben Ziele. einige optionen werden von natur aus strker hervorgehoben werden mssen als andere. einegut sichtbare, persistente globale navigation kann den Bedrfnissen der entscheidungstrger entgegenkommen.Ablufe, die nicht unterbrochen werden solltenes gibt Situationen, in denen die globale navigation gar nicht oder nur in abgewandelter Form angezeigt werden sollte.Bei ablufen wie einer online-Banktransaktion oder dem abwickeln eines online-einkaufs kann eine prsente hauptnavi-gation leicht dazu fhren, dass Benutzer mittendrin zu einer anderen Seite springen und der prozess dadurch abgebro-chen wird. Vergleichen Sie zum Beispiel die homepage der reise-Website opodo (www.opodo.co.uk) in abbildung 4-3 mit der erstenSeite eines Buchungsprozesses in abbildung 4-4. Bei letzterem wurde die hauptnavigation weggelassen, um Fehler zuvermeiden und die aufmerksamkeit des Benutzers ganz auf den Buchungsvorgang zu lenken.Abbildung 4-3 / die opodo-homepage mit der (hervorgehobenen) hauptnavigation 90N a I g aT I o N s T y p e N 9. Dieser Auszug unterliegt dem Urheberrecht. OReilly Verlag 2009http://www.oreilly.de/catalog/handbuchwebger/Dies ist ein Auszug aus dem Buch "Handbuch der Webnavigation", ISBN 978-3-89721-865-9 Abbildung 4-4 / ein Buchungsvorgang auf opodo ohne die hauptnavigationL O K A L E N AV I G AT I O N auch Subnavigation und pagelevel-navigation genannt.die lokale navigation wird fr den Zugriff auf Seiten in den unteren ebenen der Website-Struktur, unterhalb der Seiten der hauptnavigation, eingesetzt. der Begriff lokal meint hier innerhalb einer gegebenen Kategorie. die lokale navigation auf einer Seite verlinkt blicherweise auf Seiten derselben hierarchieebene oder darunter.in der regel arbeitet die lok...</p>
Embed Size (px)
Recommended