ΕΠΛ 435: Αλληλεπίδραση Ανθρώπου Υπολογιστή

1. ΕΠΛ 435:Αλληλεπίδραση Ανθρώπου Υπολογιστή Navigation

2. Navigation appears to be one of the easiest and most obvious things about the Web. It’s all those links that take you to other pages. Navigation seems simple, but it’s the most subtle and complex part of the interface. The job of navigation is to clearly state where a user will travel in the information architecture. Introduction Τμήμα Πληροφορικής

3. Three Types of Navigation • There are three types of navigation, each defined by where it takes the user • Structural navigation helps users navigate the organizational structure of the Web site. • Associative navigation allows users to jump to related information • Utility navigation catches anything important the user needs access to that structural and associative miss. Τμήμα Πληροφορικής

4. Three Types of Navigation Τμήμα Πληροφορικής

5. Global Navigation Local Navigation Structural Navigation Τμήμα Πληροφορικής

6. Global Navigation On a lot of sites, it’s the navigation bar or set of links that you see at the top of a Web page. Τμήμα Πληροφορικής

7. When you categorized your content and chose organization systems, you probably had some items that were more valuable to the users and the business. If you created a hierarchical organization system, you also have some top-level categories. These are your global navigation. Global navigation gives users access to anywhere else on the site, no matter where they currently are. Global navigation has a second, less obvious but perhaps more important, function: it tells you what the site is all about and what you should use it for. Global navigation needs to appear on every page of a Web site Global Navigation Τμήμα Πληροφορικής

8. At the top: But this can be limiting Horizontal navigation has its drawbacks. Vertical space on a Web page can increase forever, but there’s a limited amount of horizontal space. Global navigation on the left: Designers use vertical global navigation less often because it limits the available space for both local navigation and page content Overall, it doesn’t matter exactly where your global navigation lives. The essential point is that it appears on every page of your site. Where to put global navigation? Τμήμα Πληροφορικής

9. Local Navigation Τμήμα Πληροφορικής

10. Local navigation often appears “below” the global navigation. This reinforces how your content is organized: conceptually, a category has sub-categories below it. This also places the most relevant links closest to where the user needs them. Where to put local navigation? Τμήμα Πληροφορικής

11. Levels of Global and Local Navigation • Navigation can also be identified by “level.” Your global navigation is navigation level one. • Level two is the first level of your local navigation. • Level three is one level of navigation down. Τμήμα Πληροφορικής

12. Your navigation will necessarily shape how users find content. Two basic patterns: Pogosticking:In pogosticking, users go to a subcategory, and then must go back to the parent category to choose a different subcategory. Crabwalking: In crabwalking, users can move in a sideways fashion through categories, like the locomotion of a crab. Users choose a category and can choose links to sibling categories provided on the page. Working with the global navigation—models for navigation access Τμήμα Πληροφορικής

13. Associative navigation associates additional content with an article on a page. Associative navigation addresses two important situations for every page on your site: What happens once the user has successfully interacted with the page? What’snext? What happens if this page isn’t what the user wants? What’s the safety net that catches him before he leaves your site? Associative Navigation: What’s Next and Safety Nets Τμήμα Πληροφορικής

14. Your user has navigated your site, found what he wanted to do, and done it. Now, he sits there, staring at the screen. Pretty soon he types Google in the address bar, and he is gone. Is that really what you want? No If you sell things, you want him to see more things to buy; if you sell advertising, you want more page views. But most of all, you want him so happy and engaged that his five-minute visit turns into 15, and the next day he comes back wondering what else you’ve got! Ask yourself, what do our visitors want to do with what they’ve found? What’s the next step? Associative Navigation: What’s Next Τμήμα Πληροφορικής

15. Examples: The Guardian YouTube Asos Associative Navigation: What’s Next Τμήμα Πληροφορικής

16. Next steps aren’t just for online stores and browsing articles. They’re critical for online applications. Examples: GoogleDocs Wikipedia Associative Navigation: What’s Next Τμήμα Πληροφορικής

17. Now imagine failure. Your user has navigated your site and found something he didn’t want. Now, he sits there staring at the screen. Do you really want to force him back to try again? Do you want to take the risk that he’ll decide it’s a waste of time and go somewhere else? If your visitors arrive at a page and decide it’s not what they wanted, give them another page to go to with something new to look at. Link to something on a related topic, or link to the same content in a different format. Associative Navigation: Safety Nets Τμήμα Πληροφορικής

18. BBC provides associated videos to news articles The New York Times is fabulous at creating safety nets to catch wandering users.If you’d rather not read, they offer video, photos, and even audio. And at the bottom you get links to past coverage and related searches. Safety nets are useful everywhere. At Ask.com, a set of related searches at the right of the page helps you refine your query. If your fi rst search doesn’t work, what’s to stop you from going over to Google or Yahoo! or MSN or anyone? Safety nets imagine what might go wrong and then create a mechanism for helping the user out of that problem Associative Navigation: What’s Next and Safety Nets Τμήμα Πληροφορικής

19. Associative Navigation: Safety Nets Τμήμα Πληροφορικής

20. Associative navigation is all about associating more content with whatever content the user is currently looking at. By time: Items that occur, were published, or were saved around the same time. By type: More articles, videos, or photos, based on what the user is looking at. By topic or subject: More items in the same category. By interest: Most popular items. By owner or group: More items by the same author or from the same group. By community: More items based on what people like you are checking out. Associative Navigation: Driving associative navigation with metadata Τμήμα Πληροφορικής

21. Utility navigation connects tools and features that assist visitors in using the site. A convention has emerged where the utility navigation lives at the top right of the page Usually, it lives there because the rest of the navigation system occupies the top and left of the page. So, the top right of the page is somewhere both out of the way, yet still accessible. Utility Navigation Τμήμα Πληροφορικής

22. Ask yourself—what common or important tasks are ignored by your global navigation? What links will your visitors want or need if browsing your taxonomy isn’t what they want to do? Common items that appear as utility navigation include sign-in and sign-out, access to a user’s account or profile, help, contact info, links to physical locations (branches for banks, stores, offices), and search. Often utility navigation is placed adjacent to the global navigation, because it also needs to be accessible everywhere on the site. Utility Navigation Τμήμα Πληροφορικής

23. How is your content organized? What do your users want to do? What do you want your users to do? The answers to these three questions will ensure your navigation includes the links it needs, while leaving out what it doesn’t. Designing Navigation Three Questions to Ask Yourself Τμήμα Πληροφορικής

24. Sometimes, users will already have an expectation of how your content and features will be organized. Employee directories are often organized alphabetically. Events are organized by date. Other times, metadata may offer an alternative way to organize your content. Letting users navigate content by the way it’s organized is a good way to make sure they can find what they’re looking for. Sometimes, though, you don’t want to rely on users to browse around. Sometimes, you want to make sure users can do what they came to do. How is your content organized? Τμήμα Πληροφορικής

25. This want question is pretty important. You may have a wonderful organization system, but users may prefer to navigate another way. Your organization system and your navigation system are not necessarily the same thing However, if there’s something users come to your site to do, your navigation needs to help them do it, even if that’s different from how your content is organized. If there’s a mismatch, you’ll have a lot of frustrated users. Even worse, they’ll have trouble finding what they need, buy less, register less, download less, and see fewer ads. What do your users want to do? Τμήμα Πληροφορικής

26. A successful Web site emerges from a balance between what the user wants and what the business needs. Navigation should help your users do what they want, but it also needs to help them do what you want them to do. Navigation facilitates your business model. Good navigation makes your business money. What do you want your users to do? Τμήμα Πληροφορικής

27. Pagination is a special form of navigation. It’s a simple tool that lets people flip through multiple pages. Breaking a large group of items into bite-sized pieces is a common wisdom. It allows a faster download and prevents information overload. It’s useful for categories that hold a large number of products, or for extremely long documents, such as e-books or in-depth articles. And, of course, it provides more pages for advertising spots. Pagination—Navigating Multiple Pages Τμήμα Πληροφορικής

28. When deciding to paginate a form or process, you should decide how important it is that users complete the form. If it’s ok for users to abandon the form and go somewhere else on your site, then leave the global and local navigation visible. If, however, it’s critical that they finish the form, then remove the global and local navigation. The user will have fewer distractions and be able to focus on completing the process. Paginating forms and processes Τμήμα Πληροφορικής

29. Καλή Συνέχεια Exercise Just Kidding Τμήμα Πληροφορικής