Webdesign. (eller ting Trond Are ikke vet så mye om) 06 nov 2007

Transcription

1 1 Webdesign (eller ting Trond Are ikke vet så mye om) 06 nov 2007

2 Lecture overview What is information architecture Information can be arranged and accessed in many ways Design process for information architectures Information architecture for interactive systems Information architecture for ubiquitous systems

3 What is information architecture from 1. The structural design of shared information environments. 2. The art and science of organizing and labeling web sites, intranets, online communities and software to support usability and findability. 3. An emerging community of practice focused on bringing principles of design and architecture to the digital landscape.

4 Information is arranged in many ways Date Alphabetical Geography Topic Hierarchy Faceted Organic Combination Good IA allows access to information in many ways

5 By date

6 6 by date

7 Alphabetical

8 By geography

9 By geography

10 By audience

11 By task

12 By topic

13 By category

14 socially constructed organisation system

15 socially constructed organisation system

16 About hierarchies NTNU home Future students Current students Staff Entry into NTNU Announcements Campus news NTNU courses Innsiden/studweb Innsiden International stud. Academic divisions & schools Directories & maps Campus life Studying at NTNU Academic divisions & schools

17 17 About Hierarchies

18 18

19 Getting around - navigation

20 20 Jacob Nielsen For almost seven years, my studies have shown the same user behavior: users look straight at the content and ignore the navigation areas when they scan a new page. (Remember, users almost always scan - they rarely read carefully online.)

21 21 Users scan from heading to sub heading to text The hierarchy of text should complement each other, not copy Maximum 35 words from top to bottom Organisering av tekst er viktig! Innholdet i ingressen bør være! dekkende viser en undersøkelse. Poynter.org har vist at folk leser fra overskrift til innhold i en sammenhangende bevegelse når de scanner tekst. Hvis du ikke har fått fram det du vil si til nå. HAR DU TAPT

22 22 Jacob Nielsen users comment on the content first; if the content is not relevant, then they don't care about any other aspect of the design when they arrive on a page, users ignore navigation bars and other global design elements: instead they look only at the content area of the page users don't understand where they are in a website's information architecture users are extremely goal-driven and look only for the one thing they have in mind - they don't spend much time on promotions for anything else

23 23 Jacob Nielsen in pursuit of their goal, users often rely on search as their main hunting strategy users rarely look at logos, mission statements, slogans, or any other elements they consider fluff (in particular, they ignore advertising and anything that looks like an ad) if a page does not appear relevant to the user's current goals, then the user will ruthlessly click the Back button after two to three seconds if users don't understand a certain design element, they don't spend time learning it - instead, they ignore it and continue the hunt for their own goal

24 Navigation Every page of a site should let you know: Where am I What s here Where can I go now Where have I been People don t always work from the home page they get to a page from a link or from a search

25

26

27 Types of navigation Global navigation Persistent across a site Allows access to major parts of the site Local navigation Lets you move around the current section Contextual navigation Inline links, to anywhere Supplemental navigation Helpers site map, A-Z index See also type navigation Related links

28 28 Layout conventions Logo Home of page Global navigation or local navigation Global navigation on Homepage or limited hight Content and in-content navigation Suppleme ntal, help, sitemap etc See also related links

29 Navigation

30 Social navigation

31 Labeling Good labels Are understandable by the reader Are consistent within the site Clearly describe where you are going next Labeling is not easy it is as complex as structure and navigation Where to get labeling ideas: User research Search terms Referrer terms Call centre/people in contact with users

32 Search What to search Query structure - how to search it Relevance - which results are the most important How to display the results

33 Metadata Data about data Title Description Authored date Keywords Historically used to improve searching search can use the metadata fields Also can be used to relate information together

34 In an IA project Research Business needs User requirements Content Gives an understanding of the domain Understand technical opportunities or limitations Design site structure (site map) Design navigation and page layouts (wireframes) Design metadata, search and relationships Usability test throughout the process Creates a blueprint for the site technical work after blueprint created and tested

35 IA for interactive sites Sites that are primarily about doing things use IA differently Fewer pages than a large informational site, so site map may show workflow not structure Navigation and labeling still important More emphasis on scenarios Wireframes( rammeverk) show a lot more detail and show all screens Design process is very similar

36 From The Elements of user experience by Jesse James Garrett, elements_ch02.pdf

37 IA for ubiquitous computing Navigation getting around the interface Labeling always important Design process is probably similar As information becomes embedded into our environment, accessing that information will become important

38 IA Resources Books Information Architecture for the World Wide Web Louis Rosenfeld & Peter Morville Elements of user experience Jesse James Garrett Information Architecture Blueprints for the Web Christina Wodtke Don t Make Me Think Steve Krug Online Boxes and Arrows IAslash - IAwiki