Information Architecture for the Web

1
Information Architecture for the Web

• Dey Alexander
• Usability Specialist
• Web Resources and Development, ITSextn. 54740

2

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• IA methods

3
What is information architecture (IA)?

• The structural design of an information space to
  facilitate task completion and access to content
• The art and science of structuring, organising
  and labelling information so that people can find
  it
• The structure or organisation of a site, the
  relationship between the sections or pages within
  it, and the components that are provided to
  assist searching and browsing
• An emerging discipline and community of practice
  focused on bringing principles of design and
  architecture to the digital landscape

4
IA model
Content document/data types, content objects,
volume, existing structure
Content
Context business goals, funding, politics,
culture, technology, resources, constraints
Context
Users
Users audience, tasks, needs, information
seeking behaviour, experience
5
Why IA matters

• All information has an architecture
• Consider benefits of a well-designed IA
• Cost of finding information negative impact on
  productivity
• Cost of not finding information bad decisions by
  employees, misinformation for clients/public,
  loss of sales/business
• Cost of reconstruction/redesign
• Cost of training for staff/call centre to use
  system
• Value of brand beauty wont win brand loyalty if
  users cannot find what theyre looking for

6

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• Search systems
• IA methods

7
Information-seeking behaviour

• How do people find information on the web?
• Searching enter queries into search systems
• Browsing navigating from link to link
• Asking email someone, chat with someone online,
  contact someone subsequent to looking online
• Might use one or more of these methods in a
  single information-seeking session

8
Browsing aids

• Organisation systems how site content is
  categorised and structured
• Site-wide navigation systems primary navigation
  across a site
• Local navigation systems navigation within a
  sub-site or content area
• Sitemaps provide a condensed overview of major
  content areas
• Site indexes provide an alphabetised list of
  links
• Contextual links connect related content in
  other parts of the site

9
Searching aids

• Search interface all elements of UI including
  help
• Query language might include Boolean operators
  (AND, OR), proximity operators (ADJACENT, NEAR)
  or ways of specifying which field to search
  (AUTHORMorville)
• Retrieval algorithms how the search engine
  determines matches to users query
• Search zones subsets of content separately
  indexed
• Search results all elements of UI on results
  display page
• Controlled vocabs, thesauri, meta data etc.
  hidden elements that assist searching (and
  browsing)

10
Asking aids

• Contact pages
• Contextually linked email addresses page
  maintainer, content owner/authoriser, webmaster
  contacts (error pages)
• Chat UIs allow users to chat online with
  customer service staff

11

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• IA methods

12
Organisation systems

• Natural tendency for people to organise
  information
• Aids understanding, explanation, control
• Organisation systems composed of
• Organisation schemes or classifications
• Exact or ambiguous
• Organisation structures
• Hierarchical, linear, contextual

13
Exact organisation schemes

• Are well defined
• Are mutually exclusive
• Alphabeticaldictionaries, encyclopedia, phone
  directories
• Chronologicaldiaries, event calendars, magazine
  archives
• Geographicaltravel, news weather,
  politics/social issues

14
IA exact scheme
Alphabetical classification
Geographical classification
15
IA exact scheme (chronological)
16
IA exact scheme (geographical)
17
Ambiguous organisation schemes

• Categories that defy exact definition
• Prone to subjectivity
• Topicalyellow pages, newspapers, academic
  courses
• Task orientedfile menu, edit menu, format menu
• Audience specificstudents, staff, visitors
• Metaphor drivenneighbourhood, house or room
  layout and other metaphors

18
IA inexact scheme (topical)
19
IA inexact scheme (audience)
20
IA inexact scheme (task)
21
IA inexact scheme (metaphor)
22
IA inexact scheme (metaphor)
23
Hybrid organisation schemes

• Hybrid scheme
• Commonly used on the web
• Use with caution
• Can impede formation of correct mental model
• Slows users down so they have to skim over all
  navigation options

24
IA hybrid scheme (poor)
Audience-specific classifications are
interspersed among topical classifications
25
IA hybrid scheme (better)
26
IA hybrid scheme
Mixture of exact (alphabetical and geographical)
with inexact (topical). Clear divisions between
each scheme
27
Hierarchical information structure

• Top-down approach
• Familiar and simple concept
• Common way of structuring information

28
Rules of thumb for designing hierarchies

• Usually mutually exclusive
• Ambiguous classifications may warrant some
  cross-listing (too much of this will break down
  hierarchy)
• Balance breadth and depth
• Important to get an appropriate balance
• Users may struggle with choice in structure too
  broad
• Users may feel lost in an overly deep structure
• Card sorting exercises can help in designing
  taxonomies that users understand

29
Database model information structure

• Bottom-up approach
• Useful for content that is relatively homogeneous
• Content is arranged for ease and speed of search
  and retrieval
• Metadata, controlled vocabularies are important
  to this approach
• Allows tagging of documents and info objects to
  enable searching and browsing

30
Linear information structure

• A micro-structure suitable for only some types of
  content
• Not scalable
• Used more in transactional or process style tasks

31
Information structure - contextual

• Facilitated by hypertext
• Reflected in hyperlinking
• Underlying structure should still be organised to
  prevent user confusion

32

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• IA methods

33
Labelling systems

• Labelling is a form of representation
• A label represents a content chunk
• Contact us represents name, phone number, fax
  number, address, email address
• Labels should trigger the right association in
  the users mind
• Labels reveal the organisation system and
  navigation systems of a web site

34
Goals of labelling systems

• Communicate effectively
• Cause right association for the user
• Communicate efficiently
• Dont take up too much physical space
• Dont take up too many cognitive resources
• We label all the time, but unfortunately often
  dont do it well!

35
Types of labels

• Textual labels
• Navigation labels
• Page titles
• Page headings and sub-headings
• Contextual (in body text) links
• For tips on writing page titles, headings, text
  links seeWriting for the Web presentation

36
Types of labels

• Iconic labels
• Often used for navigation systems because of
  efficient use of space
• Much more limited conveyance of meaning than text
• Risky proposition to use in many instances

37
Iconic labels - example
38
Iconic labels - example
39
Tips for designing labelling systems

• Be consistent
• Use of style, syntax, scale of register
• Presentation
• Granularity
• Use your users language
• Avoid corporate/technical jargon
• Card sorting exercises can reveal users language
• Where conventions exist, use them
• Check out your competitors

40

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• IA methods

41
Goals of navigation systems

• Support information retrieval through browsing
  behaviours
• Provide context you are here
• Present site ID clearly users can jump into any
  page on a site
• Present the structure of the information
  hierarchy
• Indicate location within the site structure

42
Types of navigation systems

• Embedded systems
• Global navigation
• Local (or sub-site) navigation
• Breadcrumbs
• Contextual navigation
• Supplementary systems
• Site maps
• Site indexes

43
Global navigation

• Intended to appear on every page within a site
• Sometimes different on home page
• Allows direct access to key areas and/or
  functions
• Most link to home page
• Many contain search function or link to search
• Some reinforce site structure
• depends on size of site, may not be scaleable for
  a very large site
• Crucial to usability of a site

44
Global navigation examples
45
Local navigation

• Complements global navigation on larger sites
• Local navigation systems
• Often used for sub-site navigation within a very
  large site
• Sometimes used for navigation within and around
  major content areas within a site
• Come in all shapes and sizes
• Need to be carefully designed so users notice it

46
Local navigation examples
47
Breadcrumbs

• Indicates location within the site
• Provides limited backtracking up the site
  hierarchy

48
Contextual navigation

• The hallmark of the web
• Definition of links is often editorial rather
  than contextual
• Need to take care that
• Useful and relevant associations are made
• Link text is meaningful
• Not done to excess can cause visual clutter

49
Getting the balance right

• Use of embedded navigation can overwhelm content
• Content is king!

Global navigation
Breadcrumbs gt
Local Navigation
Contextual navigation Content Contextual
navigation
50
Supplementary navigation systems

• Sitemaps
• Encourages exploration
• Provides a broad overview of site contents (TOC)
• Best for sites with a hierarchical structure
• Site indexes
• Facilitates known-item finding
• Challenge is in determining level of granularity
• Large sites often need these in addition to a
  sitemap

51
Advanced navigation approaches

• Personalisation and customisation
• offering content/navigation options based on who
  the user is (past behaviour, stated
  interests/needs/preferences, work role)
• allowing users to have direct control over some
  aspects of the navigation/content/presentation
• Both can be used to refine or supplement existing
  navigation systems

52
Advanced navigation approaches

• Personalisation and customisation hyped by
  consultants/vendors as the solution to all
  navigation problems
• Play an important, but limited role
• Still requires a solid underlying architecture
• Are difficult to do well

53
Advanced navigation approaches

• Social navigation
• Offering navigation options based on behaviour of
  other users
• E.g. top downloads, collaborative filtering

54
Advanced navigation approaches

• Visualisation attempts to create tools to enable
  a more visual means of navigation
• Limited application

See http//antarctica.net/products/case_studies.h
tml
55
Advanced navigation approaches

• Topic or concept maps (this example is a
  search engine alternative)

56

• What is information architecture?
• Information-seeking behaviour
• Organisation systems
• Labelling systems
• Navigation systems
• IA methods

57
Simple IA methods we can all use

• Card sorting a top-down IA method
• Helps determine or verify classification schemes
• Can provide candidate labels for navigation
• Search log analysis a bottom-up IA method
• Helps with design of metadata, controlled vocabs,
  etc.

58
Top-down information architecture

• Top-down IA focuses on understanding users tasks
  the big questions
• Products include
• Organisation systems
• Classification schemes, structures
• Labelling systems
• Navigation systems

59
Bottom-up information architecture

• Bottom-up IA focuses on helping users extract
  answers from content making the answers bubble
  up
• Products include
• Search systems
• Metadata
• Controlled vocabularies (thesauri, etc.)
• Contextual links
• Labelling systems

60
Card sorting - overview

• A technique used to gain an understanding of the
  users concept of how information should be
  organised
• Best as an individual activity
• Main types are open and closed
• Many variations are possible

61
Example open card sorting procedure

• User is given a stack of randomly arranged cards
• Each card contains the name of one item (and
  sometimes a brief description)
• User is asked to sort cards into groups of
  related items
• Users can be asked to label resulting groups
• Closed card sort users given category labels
  and asked to assign cards to relevant category

62
Analysing card sort data

• Some cards sorts are relatively easy to analyse
• Enter data into a card pairing worksheet
• Diagram the relationships so that you can see
  them visually (affinity diagrams)
• Others require statistical analysis
• Easiest to use software to perform cluster
  analysis
• EzSort (IBM)http//www-3.ibm.com/ibm/easy/eou_ext
  .nsf/Publish/410
• WebCat (NIST)http//zing.ncsl.nist.gov/WebTools/W
  ebCAT/overview.html

63
Cluster analysis - EZSort
64
Benefits of card sorting - example

• Monash International redesigned navigation
• Testing with prospective international students
  showed that only 15 of users took optimal
  navigation route
• Open card sorting completed
• Candidate structure was refined
• Labels based on terminology used by end users
• Retesting shows much better results

65
Search logs

• Keep a record of search engine use
• Some variation in what is recorded
• Monash search logs accessible at
• http//www.monash.edu.au/servers/stats/infoseek/

66
Example search log entries - Monash

• 2002/07/21 191832 74644 m0 'time table'
• 2002/07/21 191853 198074 m0 'timetable and
  international and relations'
• 2002/07/21 191902 4380 m0 'religious holiday
  exempt -monash.accessintranet'
• 2002/07/21 191908 198067 m0 'timetable and
  polatics'
• 2002/07/21 191909 4979 m0 'allocate
  -monash.accessintranet'
• 2002/07/21 191910 66 m0 'bio1042'
• 2002/07/21 191944 26512 m0 'units
  -monash.accessintranet'
• 2002/07/21 191949 203 m0 'WES'
• 2002/07/21 191958 5542 m0 'allocate '
• 2002/07/21 192002 203 m0 'WES'

67
Examining search logs

• Note most frequent search terms/strings
• Note synonyms used
• Note common misspellings
• Note searches that produced zero results
• Look at search input behaviour
• Important to consider when design or purchasing a
  search engine

68
Analysing the data

• Enter the top 50-100 search strings into search
  engine
• For each query, consider where in the result list
  the first relevant/useful answer to the query
  appears
• If first on list or above the fold on first
  page of results no action required
• If further down, need to take action

69
Frequent search terms/strings

• Manipulate meta data to facilitate most useful
  results
• What synonyms did users use?
• Were these terms commonly misspelled?
• Write better page titles
• Will improve search results
• Will improve users ability to select right link
  from results list
• Consider ways of improving browse access to
  frequently sought-after content

70
Search terms/strings with zero results

• If due to misspelling, will need to be addressed
• Meta data could include misspellings
• Search engine solutions might be possible
• Search results page could include a did you
  mean
• Search results could compensate for typing errors
• Search engine could handle phonetic spelling
• If due to no matching content
• Consider providing it if this is a common query

71
Search engine solutions
72
Search engine solutions
73
Further reading

• Rosenfeld Morville, Information Architecture
  for the World Wide Web (2nd edition)
• Eric L Reiss, Practical Information Architecture
• IA Wikihttp//iawiki.net/IAwiki
• Boxes and Arrowshttp//www.boxesandarrows.com/