{"type":"doc","content":[{"type":"panel","attrs":{"panelType":"warning"},"content":[{"type":"paragraph","content":[{"text":"This Page is Deprecated","type":"text","marks":[{"type":"strong"}]}]},{"type":"paragraph","content":[{"text":"The contents of this page have been distributed to other pages under specific topic headings. The content is now redundant, and the page can eventually be removed. All incoming links have been re-targeted, and all child pages have been relocated. – JPZ","type":"text"}]}]},{"type":"bodiedExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"section","parameters":{"macroParams":{"border":{"value":"false"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Section"}}},"content":[{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"legacy-content","text":"","parameters":{"reason":"A column macro in a rich body macro can't be created or edited in the new editor.","cxhtml":"70%

The Fluid team has selected three inspection methods to evaluate current and prospective products:

Heuristic Evaluation
Cognitive Walkthrough
Under-the-covers Code Review

\n\n\n

For each method, a set of general questions will help guide your thought process: .

\n\n

Each of the methods may be used to address usability, accessibility, or both. The only difference is the set of heuristic principles applied or questions asked during the review. Checklists for both usability and accessibility are offered here for each method.

\n\n

It is not necessary for you to use all three methods to contribute to the Fluid UX walkthrough endeavour. Nor must you address both accessibility and usability. If you do participate, please use the following checklists to guide your explorations, and use the appropriate to report your findings.heuristic

\n\n

I. Heuristic Evaluation

\n\n

An heuristic evaluation is an expert review of a web page with reference to explicit principles termed "heuristics". During the evaluation, reviewers see how well a page fulfills the basic requirements for usability or accessibility.

\n\n

To conduct an heuristic evaluation of a service offered through the web, travel through the pages of the site, reflecting on each of the listed principles, and recording compliance and violations. The heuristic principles should also be kept in mind during cognitive walkthroughs.

\n\n

Heuristic Principles for Usability

\n\n

This section lists the original Nielsen and Molich heuristics, as refined by Nielsen.

\n\n

Visibility of system status
\nThe system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

\n\n

Match between system and the real world
\nThe system should speak the user's language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

\n\n

User control and freedom
\nUsers often choose system functions by mistake and will need a clearly marked "emergency exit" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.

\n\n

Consistency and standards
\nUsers should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

\n\n

Error prevention
\nEven better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

\n\n

Recognition rather than recall
\nMinimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

\n\n

Flexibility and efficiency of use
\nAccelerators - unseen by the novice user - may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

\n\n

Aesthetic and minimalist design
\nDialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

\n\n

Help users recognize, diagnose, and recover from errors
\nError messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

\n\n

Help and documentation
\nEven though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.

\n\n

More detail on each of the principles can be found in be found in an expanded list from Deniese Pierotti of Xerox, which itemizes specific things to look for when evaluating a system with Nielsen's Heuristics. See Heuristic Evaluation - A System Checklist.

\n\n

Heuristic Principles for Accessibility

\n\n

The Fluid UX Accessibility Working Group has created a set of protocols for assessing accessibility:

: This is a set of simple heuristics for evaluating the general accessibility of a web application without need for complex assistive technologies. It provides a simple technique that anyone can learn while doing UX Walkthroughs.

\n\n\n

A paper from Claire Paddison and Paul Englefield provides a list of nine heuristic principles for accessibility evaluations:

Applying Heuristics to Perform a Rigorous Accessibility Inspection in a Commercial Context\n
\n (Click on the Full Text PDF link and view pages 129-130.)

\n\n\n

Paddison and Englefield include in their paper a general discussion of the heuristic approach. This is recommended reading for all reviewers.

\n\n

cognitive

\n\n

II. Cognitive Walkthrough

\n\n

A cognitive walkthrough is a step-by-step exploration of a page to see how well a particular type of user - represented by a persona - will be able to accomplish his or her objectives.

\n\n

The following must be set down explicitly before the the walkthrough process is begun:

a user goal - the specific result desired by the user and motivating the interaction
a persona which:\n\t
- is adequate to judge what knowledge the user may plausibly be expected to have
- specifies the particular needs, preferences, and limitations the user may have
\n\t

\n\n\n

Note that separate walkthroughs may be needed for each persona, although some issues will likely show up in more than one walkthrough, resulting in later walkthroughs going more quickly than earlier ones.

\n\n

Addressing Usability in a Cognitive Walkthrough

\n\n

Work out the sequence of steps the user should go through, to accomplish the goal.

\n\n

For each step, ask the following questions:

Will the user know what to do at this step? Is complex problem solving needed to figure out what to do?\n
\n
If the user does the right thing, will they know that they did the right thing, and are making progress towards their goal? Is complex problem solving needed to interpret the feedback?

\n\n\n

access

\n\n

Addressing Accessibility in a Cognitive Walkthrough

\n\n

An accessibility walkthrough follows procedure similar to the cognitive walkthrough described above, with the difference that the user has one of a number of disabilities such as low vision, blindness, impaired hearing, motor control limitations, or cognitive issues.

\n\n

In an accessibility walkthrough, the main consideration is how these limitations affect the use of websites or software. For example: blind persons and some persons with limited motor control need keyboard-only operation; some persons with cognitive issues need visuals that reinforce text; persons with low vision must enlarge page content; deaf people require video captioning and visual, rather than auditory, prompts. You also must consider the assistive technology the user will use. Examples include screen magnifiers such as ZoomText, screen readers such as JAWS, or combination screen readers/enlargers such as Kurzweil 3000.

\n\n

Before proceeding with the formal walkthrough, it is useful to perform the following steps:

Assess the overall layout and structure of each page.
Play around with the layout: enlarge the font size; change the size of the window (bigger and smaller); adjust the resolution.
Use the Tab key to traverse the entire page.

\n\n\n

To perform an accessibility walkthrough, adopt a persona, select a goal, and perform the steps necessary to accomplish the goal. At each step, ask the following questions:

\n\n

1. Will the user know what to do at this step?

Is complex problem solving needed to figure out what to do?
Are the cues provided accessible to the user?
Can the cues be understood by someone who doesn't process text well?
Can the cues be found by someone who can't scan the screen easily?

\n\n\n

2. Will the user be able to carry out the required action?

Can it be performed easily by a keyboard-only persona?
Can it be performed without visual monitoring?

\n\n\n

3. If the user does the right thing, will they know that they did the right thing, and are making progress towards their goal?

Is complex problem solving needed to interpret the feedback?
Is the feedback accessible to the user, and can they find it (as for cues)?

\n\n\n

To conduct an actual accessibility walkthrough and assessment, it is recommended that the reviewer select a persona to adopt and then follow one the detailed protocols listed in the section on heuristics (above):

\n\n\n

undercovers

\n\n

III. Code Review - Examining the HTML Under the Covers

\n\n

Websites have the opportunity to provide additional information to persons with disabilities to help them understand and navigate more easily. Some of this information is visible to all website users and can enhance their experience. Some of it is transparent to sighted users and provides context for persons with visual, auditory or motor limitations.

\n\n

The Fluid UX Accessibility Working Group has created a set of protocols for assessing accessibility. These involve the use of tools for a somewhat automated approach.

: This is a PC-based protocol for more in-depth accessibility testing. It contains three accessibility test protocols for Fluid: Internet Explorer 7 with the AIS Toolbar Extension, the JAWS Screen Reader and the Web Accessibility Checker tool. A form for entering results and a completed form for reference are contained in attachments.\n
\n
: This is a Macintosh version of the PC-based protocol.

\n\n\n

Code reviews can also be accomplished through direct examination of HTML. A useful guide for determining if a site addresses accessibility through properly crafted HTML is IBM's Web Accessibility Checklist:

IBM Human Ability and Accessibility Center: Web Accessibility Checklist

\n\n\n

Under-the-covers Questions

\n\n

Is content separated from presentation through CSS?\n\t
- Are buttons and other controls text-based?
- Are tables used for data and not layout?
- Does page content linearize?
\n\t
Do pages have frames?\n\t
- Are they necessary? If so, do they have meaningful titles?
\n\t
Are headings hierarchical?\n\t
- Is punctuation provided in headings to control screen readers?
\n\t
Are tables properly structured?\n\t
- Do they contain headers and summaries?
- Are table cells associated with headers?
- Are they used for data and not presentation?
- If tables are necessary for presentation, are they identified as such? E.g.: role=:"wairole:presentation"
\n\t
Are forms properly structured?
Are forms organized by subject area?
Are labels associated with input boxes?
Are XHTML navigation landmarks taken from XHTML2? See: The XHMTL Role Attribute (Don't use 'skip to main content' - these roles are much more comprehensive.)
Has a navigation section been identified on each page (role="navigation")?
Do all navigation landmarks have a title including customer ARIA regions?
Do Rich Internet Application widgets properly support ARIA and follow specified navigation rules?
Do Rich Internet Application widgets follow the tab to container and arrow convention?
Are keyboard mnemonic conventions consistent for context menus and a limited set of UI widgets?
Are application and document areas in web pages properly defined to assist assistive technology with keyboard navigation? (A screen reader should not be in browse mode in a web application)
Does UI Componentry provide rich hint, help, or tooltip text by establishing a relationship between the UI widget (could be a form control) and help information? (E.g. ARIA provides a describedBy and Tooltip relationship for these situations)
Do all forms support extended ARIA form information (such as: required and invalid)?
Are ARIA states and Properties synchonized with CSS style properties?
Do UI components supporting multiple selections or options repeat option text?\n

\n\n\n

additional-questions

\n\n

IV. Additional Questions for All Reviews

\n\n\n

","nestedContent":{"type":"doc","content":[{"type":"bodiedExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"column","parameters":{"macroParams":{"width":{"value":"70%"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Column"}}},"content":[{"type":"paragraph","content":[{"text":"The Fluid team has selected three inspection methods to evaluate current and prospective products: ","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Heuristic Evaluation","type":"text","marks":[{"type":"link","attrs":{"href":"#UXInspectionMethodsandTechniques-heuristic"}}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Cognitive Walkthrough","type":"text","marks":[{"type":"link","attrs":{"href":"#UXInspectionMethodsandTechniques-cognitive"}}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Under-the-covers ","type":"text"},{"text":"Code Review","type":"text","marks":[{"type":"link","attrs":{"href":"#UXInspectionMethodsandTechniques-undercovers"}}]}]}]}]},{"type":"paragraph","content":[{"text":"For each method, a set of general questions will help guide your thought process: ","type":"text"},{"text":"Tips to help evaluate usability","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/pages/createpage.action?spaceKey=fluid&title=Tips%20to%20help%20evaluate%20usability&linkCreation=true&fromPageId=11606635"}}]},{"text":".","type":"text"}]},{"type":"paragraph","content":[{"text":"Each of the methods may be used to address usability, accessibility, or both. The only difference is the set of heuristic principles applied or questions asked during the review. Checklists for both usability and accessibility are offered here for each method.","type":"text"}]},{"type":"paragraph","content":[{"text":"It is not necessary for you to use all three methods to contribute to the Fluid UX walkthrough endeavour. Nor must you address both accessibility and usability. If you do participate, please use the following checklists to guide your explorations, and use the appropriate ","type":"text"},{"text":"UX Walkthrough Report Template","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11528011"}}]},{"text":" to report your findings.","type":"text"},{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"heuristic"},"legacyAnchorId":{"value":"UXInspectionMethodsandTechniques-heuristic"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Anchor"}}}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"I. Heuristic Evaluation","type":"text"}]},{"type":"paragraph","content":[{"text":"An heuristic evaluation is an expert review of a web page with reference to explicit principles termed \"heuristics\". During the evaluation, reviewers see how well a page fulfills the basic requirements for usability or accessibility.","type":"text"}]},{"type":"paragraph","content":[{"text":"To conduct an heuristic evaluation of a service offered through the web, travel through the pages of the site, reflecting on each of the listed principles, and recording compliance and violations. The heuristic principles should also be kept in mind during cognitive walkthroughs.","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Heuristic Principles for Usability","type":"text"}]},{"type":"paragraph","content":[{"text":"This section lists the original ","type":"text"},{"text":"Nielsen and Molich heuristics","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.useit.com/papers/heuristic/heuristic_list.html"}}]},{"text":", as refined by Nielsen.","type":"text"}]},{"type":"paragraph","content":[{"text":"Visibility of system status","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nThe system should always keep users informed about what is going on, through appropriate feedback within reasonable time.","type":"text"}]},{"type":"paragraph","content":[{"text":"Match between system and the real world","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nThe system should speak the user's language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.","type":"text"}]},{"type":"paragraph","content":[{"text":"User control and freedom","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nUsers often choose system functions by mistake and will need a clearly marked \"emergency exit\" to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.","type":"text"}]},{"type":"paragraph","content":[{"text":"Consistency and standards","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nUsers should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.","type":"text"}]},{"type":"paragraph","content":[{"text":"Error prevention","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nEven better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.","type":"text"}]},{"type":"paragraph","content":[{"text":"Recognition rather than recall","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nMinimize the user's memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.","type":"text"}]},{"type":"paragraph","content":[{"text":"Flexibility and efficiency of use","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nAccelerators - unseen by the novice user - may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.","type":"text"}]},{"type":"paragraph","content":[{"text":"Aesthetic and minimalist design","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nDialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.","type":"text"}]},{"type":"paragraph","content":[{"text":"Help users recognize, diagnose, and recover from errors","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nError messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.","type":"text"}]},{"type":"paragraph","content":[{"text":"Help and documentation","type":"text","marks":[{"type":"strong"}]},{"type":"hardBreak"},{"text":"\nEven though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user's task, list concrete steps to be carried out, and not be too large.","type":"text"}]},{"type":"paragraph","content":[{"text":"More detail on each of the principles can be found in be found in an expanded list from Deniese Pierotti of Xerox, which itemizes specific things to look for when evaluating a system with Nielsen's Heuristics. See ","type":"text"},{"text":"Heuristic Evaluation - A System Checklist","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.stcsig.org/usability/topics/articles/he-checklist.html"}}]},{"text":".","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Heuristic Principles for Accessibility","type":"text"}]},{"type":"paragraph","content":[{"text":"The Fluid UX Accessibility Working Group has created a set of protocols for assessing accessibility:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Simple Accessibility Review Protocol","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11608485"}}]},{"text":": This is a set of simple heuristics for evaluating the general accessibility of a web application without need for complex assistive technologies. It provides a simple technique that anyone can learn while doing UX Walkthroughs.","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"A paper from Claire Paddison and Paul Englefield provides a list of nine heuristic principles for accessibility evaluations:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Applying Heuristics to Perform a Rigorous Accessibility Inspection in a Commercial Context","type":"text","marks":[{"type":"link","attrs":{"href":"http://portal.acm.org/citation.cfm?doid=957205.957228"}}]},{"text":"\n","type":"text"},{"type":"hardBreak"},{"text":"\n (Click on the Full Text PDF link and view pages 129-130.)","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"Paddison and Englefield include in their paper a general discussion of the heuristic approach. This is recommended reading for all reviewers.","type":"text"}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"cognitive"},"legacyAnchorId":{"value":"UXInspectionMethodsandTechniques-cognitive"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Anchor"}}}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"II. Cognitive Walkthrough","type":"text"}]},{"type":"paragraph","content":[{"text":"A cognitive walkthrough is a step-by-step exploration of a page to see how well a particular type of user - represented by a persona - will be able to accomplish his or her objectives.","type":"text"}]},{"type":"paragraph","content":[{"text":"The following must be set down explicitly before the the walkthrough process is begun:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"a user ","type":"text"},{"text":"goal","type":"text","marks":[{"type":"em"},{"type":"strong"}]},{"text":" - the specific result desired by the user and motivating the interaction","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"a ","type":"text"},{"text":"persona","type":"text","marks":[{"type":"em"},{"type":"strong"}]},{"text":" which:\n\t","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"is adequate to judge what knowledge the user may plausibly be expected to have","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"specifies the particular needs, preferences, and limitations the user may have","type":"text"}]}]}]}]}]},{"type":"paragraph","content":[{"text":"Note that separate walkthroughs may be needed for each persona, although some issues will likely show up in more than one walkthrough, resulting in later walkthroughs going more quickly than earlier ones.","type":"text"}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Addressing Usability in a Cognitive Walkthrough","type":"text"}]},{"type":"paragraph","content":[{"text":"Work out the sequence of steps the user should go through, to accomplish the goal.","type":"text"}]},{"type":"paragraph","content":[{"text":"For each step, ask the following questions:","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Will the user know what to do at this step? Is complex problem solving needed to figure out what to do?","type":"text","marks":[{"type":"strong"}]},{"text":"\n","type":"text"},{"type":"hardBreak"},{"text":"\n","type":"text"},{"type":"hardBreak"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"If the user does the right thing, will they know that they did the right thing, and are making progress towards their goal? Is complex problem solving needed to interpret the feedback?","type":"text","marks":[{"type":"strong"}]}]}]}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"access"},"legacyAnchorId":{"value":"UXInspectionMethodsandTechniques-access"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Anchor"}}}}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Addressing Accessibility in a Cognitive Walkthrough","type":"text"}]},{"type":"paragraph","content":[{"text":"An accessibility walkthrough follows procedure similar to the cognitive walkthrough described above, with the difference that the user has one of a number of disabilities such as low vision, blindness, impaired hearing, motor control limitations, or cognitive issues.","type":"text"}]},{"type":"paragraph","content":[{"text":"In an accessibility walkthrough, the main consideration is how these limitations affect the use of websites or software. For example: blind persons and some persons with limited motor control need keyboard-only operation; some persons with cognitive issues need visuals that reinforce text; persons with low vision must enlarge page content; deaf people require video captioning and visual, rather than auditory, prompts. You also must consider the assistive technology the user will use. Examples include screen magnifiers such as ZoomText, screen readers such as JAWS, or combination screen readers/enlargers such as Kurzweil 3000.","type":"text"}]},{"type":"paragraph","content":[{"text":"Before proceeding with the formal walkthrough, it is useful to perform the following steps:","type":"text"}]},{"type":"orderedList","attrs":{"order":1},"content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Assess the overall layout and structure of each page.","type":"text","marks":[{"type":"strong"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Play around with the layout: enlarge the font size; change the size of the window (bigger and smaller); adjust the resolution.","type":"text","marks":[{"type":"strong"}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Use the Tab key to traverse the entire page.","type":"text","marks":[{"type":"strong"}]}]}]}]},{"type":"paragraph","content":[{"text":"To perform an accessibility walkthrough, adopt a persona, select a goal, and perform the steps necessary to accomplish the goal. At each step, ask the following questions:","type":"text"}]},{"type":"paragraph","content":[{"text":"1. Will the user know what to do at this step?","type":"text","marks":[{"type":"strong"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Is complex problem solving needed to figure out what to do?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are the cues provided accessible to the user?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Can the cues be understood by someone who doesn't process text well?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Can the cues be found by someone who can't scan the screen easily?","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"2. Will the user be able to carry out the required action?","type":"text","marks":[{"type":"strong"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Can it be performed easily by a keyboard-only persona?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Can it be performed without visual monitoring?","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"3. If the user does the right thing, will they know that they did the right thing, and are making progress towards their goal?","type":"text","marks":[{"type":"strong"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Is complex problem solving needed to interpret the feedback?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Is the feedback accessible to the user, and can they find it (as for cues)?","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"To conduct an actual accessibility walkthrough and assessment, it is recommended that the reviewer select a persona to adopt and then follow one the detailed protocols listed in the section on heuristics (above):","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Simple Accessibility Review Protocol","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11608485"}}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Comprehensive Accessibility Review Protocol for PC","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11608406"}}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Comprehensive Accessibility Review Protocol for Macintosh","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11609724"}}]}]}]}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"undercovers"},"legacyAnchorId":{"value":"UXInspectionMethodsandTechniques-undercovers"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Anchor"}}}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"III. Code Review - Examining the HTML Under the Covers","type":"text"}]},{"type":"paragraph","content":[{"text":"Websites have the opportunity to provide additional information to persons with disabilities to help them understand and navigate more easily. Some of this information is visible to all website users and can enhance their experience. Some of it is transparent to sighted users and provides context for persons with visual, auditory or motor limitations.","type":"text"}]},{"type":"paragraph","content":[{"text":"The Fluid UX Accessibility Working Group has created a set of protocols for assessing accessibility. These involve the use of tools for a somewhat automated approach.","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Comprehensive Accessibility Review Protocol for PC","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11608406"}}]},{"text":": This is a PC-based protocol for more in-depth accessibility testing. It contains three accessibility test protocols for Fluid: Internet Explorer 7 with the AIS Toolbar Extension, the JAWS Screen Reader and the Web Accessibility Checker tool. A form for entering results and a completed form for reference are contained in attachments.\n","type":"text"},{"type":"hardBreak"},{"text":"\n","type":"text"},{"type":"hardBreak"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Comprehensive Accessibility Review Protocol for Macintosh","type":"text","marks":[{"type":"link","attrs":{"href":"https://fluidproject.atlassian.net/wiki/spaces/fluid/pages/11609724"}}]},{"text":": This is a Macintosh version of the PC-based protocol.","type":"text"}]}]}]},{"type":"paragraph","content":[{"text":"Code reviews can also be accomplished through direct examination of HTML. A useful guide for determining if a site addresses accessibility through properly crafted HTML is IBM's Web Accessibility Checklist:","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"IBM Human Ability and Accessibility Center: Web Accessibility Checklist","type":"text","marks":[{"type":"link","attrs":{"href":"http://www-03.ibm.com/able/guidelines/web/accessweb.html"}}]}]}]}]},{"type":"heading","attrs":{"level":3},"content":[{"text":"Under-the-covers Questions","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Is content separated from presentation through CSS?\n\t","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are buttons and other controls text-based?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are tables used for data and not layout?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Does page content linearize?","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do pages have frames?\n\t","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are they necessary? If so, do they have meaningful titles?","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are headings hierarchical?\n\t","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Is punctuation provided in headings to control screen readers?","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are tables properly structured?\n\t","type":"text"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do they contain headers and summaries?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are table cells associated with headers?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are they used for data and not presentation?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"If tables are necessary for presentation, are they identified as such? E.g.: role=:\"wairole:presentation\"","type":"text"}]}]}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are forms properly structured?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are forms organized by subject area?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are labels associated with input boxes?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are XHTML navigation landmarks taken from XHTML2? See: ","type":"text"},{"text":"The XHMTL Role Attribute","type":"text","marks":[{"type":"link","attrs":{"href":"http://www.w3.org/TR/2006/WD-xhtml-role-20061113/#s_role_module_attributes"}}]},{"text":" (Don't use 'skip to main content' - these roles are much more comprehensive.)","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Has a navigation section been identified on each page (role=\"navigation\")?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do all navigation landmarks have a title including customer ARIA regions?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do Rich Internet Application widgets properly support ARIA and follow specified navigation rules?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do Rich Internet Application widgets follow the ","type":"text"},{"text":"tab to container and arrow","type":"text","marks":[{"type":"em"}]},{"text":" convention?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are keyboard mnemonic conventions consistent for context menus and a limited set of UI widgets?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are application and document areas in web pages properly defined to assist assistive technology with keyboard navigation? (A screen reader should not be in browse mode in a web application)","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Does UI Componentry provide rich hint, help, or tooltip text by establishing a relationship between the UI widget (could be a form control) and help information? (E.g. ARIA provides a describedBy and Tooltip relationship for these situations)","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do all forms support extended ARIA form information (such as: ","type":"text"},{"text":"required","type":"text","marks":[{"type":"em"}]},{"text":" and ","type":"text"},{"text":"invalid","type":"text","marks":[{"type":"em"}]},{"text":")?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Are ARIA states and Properties synchonized with CSS style properties?","type":"text"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"text":"Do UI components supporting multiple selections or options repeat option text?\n","type":"text"},{"type":"hardBreak"}]}]}]},{"type":"paragraph","content":[{"type":"inlineExtension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"anchor","parameters":{"macroParams":{"":{"value":"additional-questions"},"legacyAnchorId":{"value":"UXInspectionMethodsandTechniques-additional-questions"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Anchor"}}}}]},{"type":"heading","attrs":{"level":2},"content":[{"text":"IV. Additional Questions for All Reviews","type":"text"}]},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.macro.core","extensionKey":"include","parameters":{"macroParams":{"":{"value":"Usability Evaluation Tips"}},"macroMetadata":{"schemaVersion":{"value":"1"},"title":"Include Page"}}}}]}],"version":1}}}},{"type":"extension","attrs":{"extensionType":"com.atlassian.confluence.migration","extensionKey":"legacy-content","text":"","parameters":{"reason":"A column macro in a rich body macro can't be created or edited in the new editor.","cxhtml":"30%

\n#fff#c1b7c3solidRelated Links#321137

: Information about how to use the checklist and reporting template to do a walkthrough.
: The template used to record your walkthrough results, referencing any needed instructions.
: Simple steps you can use to assess the accessibility of your website or web application.

UX Inspection Methods and Techniques

Comments