Accessibility Related User Stories Forms Testing As a user, I need form controls, labels and...

10
Accessibility Related User Stories Forms Testing As a user, I need form controls, labels and instructions to be clearly conveyed back to me, so that I can efficiently use the form to interact with the site.

Transcript of Accessibility Related User Stories Forms Testing As a user, I need form controls, labels and...

Accessibility Related User StoriesForms Testing

As a user,I need form controls, labels and instructions to be clearly conveyed back to me,so that I can efficiently use the form to interact with the site.

Instructions① Gather in sub-groups② Pick an assignment③ Select a website④ Complete the task⑤ Share the experience

Meet MaryNeeds and Goals• To know she can trust people• Open her own music school

Behaviors• Very outgoing, always seeking

excitement• Gets things done quickly when focused

Particularities• Was born blind• Is a power screen reader user• Uses NVDA at a speech rate of 75

Demographics• 35 years old• Married• Two boys• Musician• Works from home

Meet JohnNeeds and Goals• Clear, simple instructions• Not get lost in details

Behaviors• Loves to make to-do lists for

everything• Frequently feels anxious and

overwhelmed

Particularities• Became blind after severe car accident• Is a casual screen reader user• Uses NVDA at a speech rate of 50

Demographics• 47 years old• Single• No kids• Accountant• Works in small

office

Meet JimNeeds and Goals• Spend as much time as possible with family• Goes to church every Sunday

Behaviors• Untrusting of computers, dislikes

technology • Finds interacting with computers

impersonal

Particularities• Has macular degeneration (low vision)• Recently been introduced to screen readers• Uses NVDA at a speech rate of 25

Demographics• 75 years old• Widower• 15 kids/grandkids• Retired

a11yTip #14Associate text labels with form controls using the LABEL elementhttp://bit.ly/Vr03GH

1.3.1 (A) - Forms Association

Labels are programmatically associated with form controls using the LABEL element with matching values on the for and ID attributes.

a11yTip #15Do not rely on asterisks alone to define required fieldshttp://bit.ly/P0kjMk

3.3.2 (A) – Required Fields

Asterisk symbols on text labels are used, in conjunction with aria-required attributes set to the form controls.

Getting StartedTest Case Template

Test Case Subject Test Description Step Name Step Description

Step Expected Results

Accessibility Test Cases Forms Association Test Case

1. Turn on NVDA screen reader2. Open the page in Firefox3. …4. …5. …6. …7. …

Expected Results…

Accessibility Test Cases Required Fields Test Case

1. Turn on NVDA screen reader2. Open the page in Firefox3. …4. …5. …6. …7. …

Expected Results…