navigation and presentation design peter dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 intelligent...
TRANSCRIPT
![Page 1: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/1.jpg)
Navigation and Presentation Design
Peter Dologdolog [at] cs [dot] aau [dot] dk2.2.05Intelligent Web and Information SystemsOctober 7, 2010
![Page 2: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/2.jpg)
Outline
Navigation design principlesNavigation design techniquesPresentation design techniques
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 3: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/3.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 4: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/4.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 5: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/5.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 6: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/6.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 7: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/7.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 8: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/8.jpg)
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 9: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/9.jpg)
Navigation Design Principles
![Page 10: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/10.jpg)
Navigation
Navigation in the web application concerns mostly the hints the users are provided with in order to move from one page to another or in general from one goal to another.
In the most simplest view it concerns how to link the pages of your web application
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 11: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/11.jpg)
Step Navigation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 12: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/12.jpg)
Paging Navigation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 13: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/13.jpg)
Breadcrumb Trail or Navigation - Path
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 14: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/14.jpg)
Breadcrumb Trail or Navigation - Attribute
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 15: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/15.jpg)
Tree Navigation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 16: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/16.jpg)
Site Maps
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 17: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/17.jpg)
Directories
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 18: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/18.jpg)
Tag Clouds
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 19: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/19.jpg)
Navigating from tag ”software” on previous page
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 20: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/20.jpg)
A-Z index
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 21: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/21.jpg)
Navigation Bars and Menus
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 22: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/22.jpg)
Vertical Menu
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 23: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/23.jpg)
Dynamic Menu
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 24: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/24.jpg)
Drop Down Menu
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 25: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/25.jpg)
Properties to think of
To pursue to followVisual clarityAppropriateness for type of siteAligning with user needsBreath vs. DepthEase of learningConsistency vs. InconsistencyFeedback to userEfficiencyClear Labels
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
![Page 26: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/26.jpg)
Design
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 27: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/27.jpg)
Navigation Design Techniques
![Page 28: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/28.jpg)
Navigation Views
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 29: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/29.jpg)
Navigation Schema
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 30: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/30.jpg)
In context class
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 31: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/31.jpg)
WebML Hypertext Schema
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 32: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/32.jpg)
UML Guide
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 33: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/33.jpg)
Concurrent presentation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 34: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/34.jpg)
Collections and Interfaces
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 35: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/35.jpg)
Interaction between objects and collections
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 36: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/36.jpg)
Navigation Context Pattern
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 37: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/37.jpg)
Presentation design techniques
![Page 38: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/38.jpg)
Presentation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 39: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/39.jpg)
Abstract Widgets Design
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 40: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/40.jpg)
Interaction Spaces
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 41: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/41.jpg)
ADV Views
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 42: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/42.jpg)
Presentation
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 43: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/43.jpg)
Concrete Presentation Object
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 44: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/44.jpg)
Pages and Models
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 45: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/45.jpg)
Pages and Components
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 46: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/46.jpg)
Architecture
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 47: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/47.jpg)
Web Components Architecture
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 48: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/48.jpg)
Integration Model
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 49: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/49.jpg)
WebML 4 RIA
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009
![Page 50: Navigation and Presentation Design Peter Dolog dolog [at] cs [dot] aau [dot] dk 2.2.05 Intelligent Web and Information Systems October 7, 2010](https://reader035.vdocument.in/reader035/viewer/2022062803/56649f435503460f94c6433d/html5/thumbnails/50.jpg)
UML Guide and RIA
Peter Dolog, Web Engineering 2010, Navigation and Presentation Design
© Springer, Web Applications Engineering 2009