Internet Applications - PowerPoint PPT Presentation

About This Presentation
Title:

Internet Applications

Description:

Review output, usually card sorting is best when done a few times to see what trends develop ... Examine pages using multiple browsers/tools ... – PowerPoint PPT presentation

Number of Views:28
Avg rating:3.0/5.0
Slides: 26
Provided by: erikmi2
Category:

less

Transcript and Presenter's Notes

Title: Internet Applications


1
Internet Applications
  • Spring 2008

2
Review
  • Last week
  • Information Organization
  • Classification/categorization
  • Internal vs External
  • Systems approaches

3
This week
  • Organization wrap-up, card sorting
  • Accessibility / Interactivity
  • Guest Speaker

4
External site design
  • Document structure
  • How do you represent the resource to the user?
  • Cohesion
  • Understandability
  • Use/Reuse
  • Organization
  • Where does the document exist in the users
    information sphere?
  • Findability
  • Categorization
  • Labeling and navigation
  • How and when would the user interact with this
    resource?
  • Actions
  • Navigation
  • Context

5
Labeling system
  • Types
  • Contextual links, headings, navigation systems,
    indexing terms
  • Guidelines
  • Labeling systems should be user focused
    (personas!)
  • Stay consistent
  • Follow the metaphor, descriptive model, or action
    model
  • Labels should be a public representation of a
    well structured internal system
  • Elements of style, presentation, consistency,
    accessibility are as important as syntax,
    granularity, scope.

6
Sources of labeling systems
  • Controlled vocabularies
  • User-centered design
  • Card sorting organize existing terms
  • Free listing brainstorm terms
  • Content analysis
  • Site structures
  • Server logs (see what urls people are looking
    for)
  • Author centered design
  • How are your authors labeling things?
  • How would subject matter experts label?

7
Card sorting
  • Overview
  • In card sorting, identify general concepts, site
    structures, documents, activities, etc and put
    them on cards
  • A good guide
  • Types
  • Open
  • User write their own categories labels
    (discovery)
  • Closed
  • Users use pre-labeled cards and categories
    (validation)
  • Process
  • Give the cards to a user/group of users along
    with sticky notes and ask them to group the cards
    and label their groups using the sticky notes
  • Users can use the sticky notes to create new
    categories, identify connecting relationships,
    create new cards, etc.
  • Review output, usually card sorting is best when
    done a few times to see what trends develop

8
Card Sorting exercise
  • The scenario You are a user of the SILS website
    with a specific task in mind (applying for
    admission, registration for courses, etc).
  • Using the cards which have the general navigation
    topics from the SILS website, create an
    organization/navigation scheme that would fill
    your users need. Define
  • Your user take on a persona and action
  • Topic presence are there topics missing?
  • Topic granularity are topics specific enough?
  • Cross Listing What fits in hierarchies what
    does not?
  • Contents What resources would be listed?
  • Take 15 minutes to group cards make connections
  • Find a space on the white board sketch out your
    top level organization structure (no need to use
    every topic)

9
HCI Accessibility
  • Definitions
  • HCI
  • The interaction between a person and a computer
    with the person, for instance using a keyboard,
    keypad, mouse, voice, joystick, etc and the
    computer using characters, menus, graphics,
    images, sound, etc. 1
  • Usability
  • Quite simply, usability is making your site easy
    for your customers to find the exact information
    they need when they need it. 3
  • Accessibility
  • Accessibility functionality makes content
    resources usable by persons with disabilities
    chiefly through careful attention to the
    linearizing of content navigation as well as the
    separation of presentation style and actual
    symbolic content.2

10
Taxonomy of Influential factors
  • Physical
  • Interface, usability
  • Cognitive
  • Match between content, organization, language
  • Affective
  • Attitude towards usability, confidence / fear /
    trust
  • Economic
  • Digital divide, net neutrality, impact on access
    and availability
  • Social
  • Compounding effect, outsiders
  • Political
  • Impact of government on access, content.
    Relationship of knowledge and power
  • (McCreadie Rice, 1999)

11
HHS Guidelines
  • Pulled from articles/research/experts
  • 500 guidelines condensed to 209 and prioritized
  • Ranked by experts
  • Strong research support
  • Moderate research support
  • Weak research support
  • Strong expert opinion support
  • Weak expert opinion support

12
Design testing
  • 1.10 - Parallel design
  • Multiple independent designs
  • Group discussions of design issues
    (brainstorming) do not lead to the best
    solutions
  • http//www.usabilitynet.org/tools/parallel.htm
  • Range of ideas, developed simultaneously
  • Compile/combine good ideas
  • 18.1 - Iterative design
  • One recent study found that the improvements
    made between the original Web site and the
    redesigned Web site resulted in thirty percent
    more task completions, twenty-five percent less
    time to complete the tasks, and sixty-seven
    percent greater user satisfaction.
  • 18.7 Use appropriate prototyping technology
  • Paper-based prototyping appears to be as
    effective as computer-based prototyping when
    trying to identify most usability issues.
  • HTML, Powerpoint, Visio, Paper prototyping,
    Wireframes

13
Usability testing (2)
  • Identify concrete tasks
  • Select users to perform these tasks
  • Small numbers are ok for initial design
  • Larger studies later in the process add validity
  • Use scenarios with users to set a use goal (tell
    the user what to achieve, not context)
  • Watch user interact. Consider think-aloud
    method, paper prototyping, etc.
  • Interview for general opinions, ask about
    specific problems

14
Building applications
  • 1.1 Provide useful content
  • 1.4 Involve users in establishing requirements
  • users are most valuable in helping designers
    know what a system should do, but not in helping
    designers determine how best to have the system
    do it.
  • 1.5 Set goals
  • some intranet Web sites have set the goal that
    information will be found eighty percent of the
    time and in less than one minute
  • 1.11 Use Personas
  • (limited research evidence!)

15
Search engine optimization
  • 1.8 Be found in top 30
  • Text recommends extensive use of meta-tags
  • ltmeta namedescription contentThe Official
    Website of the Federal Bureau of Investigationgt
  • Google recommends
  • Be easily discoverable (no JavaScript/flash
    requirements)
  • Get links to your site
  • Use a discoverable hierarchy
  • Use a site map
  • Use Title and ALT tags properly
  • Webmasters who spend their energies upholding
    the spirit of the basic principles will provide a
    much better user experience and subsequently
    enjoy better ranking than those who spend their
    time looking for loopholes they can exploit
    (Google Webmaster Tools)

16
Tasks
  • 2.3 Standardize tasks
  • Think calendar function, links, forms, use a
    space on the page to pop-up forms
  • 2.5 Memory limitations
  • When users must remember information on one Web
    page for use on another page or another location
    on the same page, they can only remember about
    three or four items for a few seconds.

17
Accessibility
  • 8 of the user population has accessibility
    issues
  • Guidelines
  • Provide means to fill out forms
  • Use ltlabelgt tag with forms to identify fields
  • Keep form fields in sequence, use tabindex
  • Avoid tables
  • Avoid JavaScript dependent forms
  • Use flexible display methods, colors,
    text-equivalents, text-size
  • Use flexible input systems
  • Provide equivalent pages

18
Organization guidelines
  • 9.4 Use clear hierarchies
  • People prefer hierarchies, and tend to focus
    their attention on one level of the hierarchy at
    a time.
  • 9.7 Use appropriate HTML headings
  • 10.1 Use meaningful link labels
  • 12.2 Place important items at the top of lists
  • 12.4/5 Provide context (related items, headings)

19
Images
  • 14.3 Ensure that images do not impact page
    speed
  • 14.8 Ensure images convey site meaning
  • 14.10 include data with graphics
  • 14.13 Emulate real world objects

20
Content design organization
  • 15.1 Make actions clear
  • 15.2-5 Avoid Jargon/acronyms
  • 15.10 Use active voice
  • 16.2 Facilitate scanning
  • Studies report that about eighty percent of
    users scan any new page. Only sixteen percent
    read each word. Users spend about twelve percent
    of their time trying to locate desired
    information on a page
  • 16.8 Design for multiple audiences
  • When segmenting content for two or more distinct
    groups of users, allow users from each audience
    to easily access information intended for other
    audiences.
  • 17.5 Design searching around user terms

21
Usability Web 2.0
  • How does web 2.0 / Ajax applications impact these
    standards?
  • Related readings
  • http//www.useit.com/alertbox/web-2.html
  • http//doi.acm.org/10.1145/1243441.1243442
  • Issues?
  • Example solutions
  • Fangs A good test, a bad test
  • http//test.cita.uiuc.edu/aria/nav/nav1.php
  • Jaws

22
Amazons screen reading solution
  • ltdiv style"positionabsolute left0px
    top-500px width1px height1px
    overflowhidden"gt
  • lta href"http//www.amazon.com/access"gtA
    different version of this web site containing
    similar content optimized for screen readers and
    mobile devices may be found at the web address
    www.amazon.com/accesslt/agt
  • lt/divgt lta name"top"gtlt/agt

23
Accessibility Evaluation
  • Examine pages using multiple browsers/tools
  • Define scope of evaluation specific pages,
    accessibility issues, standards
  • Evaluate content with HTML/CSS validation tools,
    try screen readers/viewers
  • Involve users, experts
  • Create recommendations

http//www.w3.org/WAI/eval/
24
Additional Resources
  • W3C web accessibility
  • http//www.w3.org/WAI/
  • W3C accessibility evaluation
  • http//www.w3.org/WAI/eval/
  • W3C accessibility for RIAs
  • http//www.w3.org/TR/wai-aria-roadmap/
  • Fangs Open Source screen rendering agent
  • http//www.standards-schmandards.com/projects/fang
    s/

25
Next week
  • Technology Topics HTML/Webservers
Write a Comment
User Comments (0)
About PowerShow.com