Skip to content
Snippets Groups Projects
Commit 937ae0e4 authored by Jennifer Mankoff's avatar Jennifer Mankoff
Browse files

Merge branch 'vpotluri/hw3-updates' of...

Merge branch 'vpotluri/hw3-updates' of gitlab.cs.washington.edu:teaching-materials/undergrad-accessibility-website into week3-changes
parents c3eef8a6 8835e2bb
No related branches found
No related tags found
3 merge requests!12Accessibility website jen summer work,!9Q access 24 sp,!8Q access 24 sp
No preview for this file type
......@@ -9,7 +9,7 @@ code: hw3
assigned: October 11th, 2023
due: October 16th, 2023 (2 day grace period, October 18th, 2023)
revised: August 20, 2023
revised: October 10, 2023
---
* TOC
......@@ -20,7 +20,7 @@ The goal of this homework is to learn about basics of website accessibility and
## Competencies
This homework may contribute to your competency grade on
- Can apply web/app accessibility rules to understand and identify, including
- Can apply web/app accessibility rules to understand conformance and identify violations on:
1. whether content is perceivable
2. whether content is operable
3. whether content is understandable
......@@ -28,35 +28,37 @@ This homework may contribute to your competency grade on
<!-- - 5 the meaning of conformance -->
- Can use an accessibility checker to assess whether a web page or app is accessible
- Can use an accessibility technology to find web page or app accessibility problems that are not found with an automated accessibility checker
- Demonstrates familiarity with a range of accessibility technologies (at least 2)
- Demonstrate familiarity with a range of accessibility technologies (at least 2)
- Can articulate paths to addressing accessibility problems
- Accessible written document creation
- Image description
- Your participation grade, as a percentage of completeness (are all the required parts present)
- Your participation grade, as a percentage of:
- completeness (are all the required parts present)
- consistency: are you applying the skills you've learned so far consistently as relevant?
## Length & Difficulty
Students in the past have reported that taken together, part 1 and part 2 of this assignment require a median of 20 hours (mode=6). A challenge that multiple students faced is summarizing the WCAG guidelines in their own words. Please be sure to do so, *or* to quote and reference WCAG guidelines according to our [course policy on academic conduct]({{site.baseurl}}/academic-conduct.html). Some things that students have told us about this assignment:
Students in the past have reported that taken together, part 1 (assigned Oct 11) and part 2 of this assignment (assigned Oct 18) require a median of 20 hours (mode=6). A challenge that multiple students faced is summarizing the WCAG guidelines in their own words. Please be sure to do so, *or* to quote and reference WCAG guidelines according to our [course policy on academic conduct]({{site.baseurl}}/academic-conduct.html). Some things that students have told us about this assignment:
- It helps to use the [UAR template](webegs/UAR_Template.doc) when filling out the UARS.
- It was very motivating to do this for a real client
Here is a [sample set of UARs](webegs/DDUARS.docx) that a prior student who completed this assignment has kindly shared with us for you to look at.
# Details
Your goal is to generate a range of UARs documenting accessibility concerns (and perhaps successes) with a website or app. You will use [W3C guidelines](https://www.w3.org/WAI/standards-guidelines/) for the site or app you are assessing.
Your goal is to generate a range of UARs (Usability Aspect Reports) documenting accessibility concerns (and perhaps successes) with a website or app. You will use [W3C guidelines](https://www.w3.org/WAI/standards-guidelines/) for the site or app you are assessing.
The most relevant are probably [WCAG
2.1](https://www.w3.org/WAI/standards-guidelines/wcag/glance/) and
[How WCAG 2.0 Applies to
Mobile](https://www.w3.org/TR/mobile-accessibility-mapping/) (even
websites may be used in mobile settings). If you are working on a
mobile app, you should also review this PDF (which is numbered page
mobile app, you should also review this PDF (specifically page
9): [Epidemiology as a Framework for Large-Scale Mobile Application
Accessibility
Assessment](https://xiaoyizhang.me/assets/Paper/ASSETS_2017_Epidemiology.pdf).
Optional reading: [Its complicated: Negotiating Accessibility and
(Mis)Representation in Image Descriptions of Race, Gender and
Disability](https://guoanhong.com/papers/CHI21-ImageDescriptions.pdf)
Optional readings:
- the Anatomy of the YouDescribe welcome page section of the [tutorial](https://youdescribe.org/support/tutorial)
## 0. Look over your assigned website and select 3 tasks
You will be assigned to one of eight websites that were submitted by external organizations for review. Please see Canvas for your specific assignment group. Note that this is *not* a group project, we are asking you to individually work on your assigned website this week. You will join forces *next* week to write a report.
......@@ -85,7 +87,7 @@ You will need to select what aspect of this site to test, you should have at lea
## 1. Collect Data on accessibility problems using an automated accessibility checker
For each of these steps, you will record data about what you find so that you can complete the write up at the end.
You should run the website and/or app through an accessibility checker. The WebAim accessibility checker, [WAVE](https://wave.webaim.org/), is a great choice for many sites. However, if the site requires that you log in, you may need an alternative. A great choice is the [Chrome plugin Axe](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US).
You should run the website and/or app through an accessibility checker. The WebAim accessibility checker, [WAVE](https://wave.webaim.org/), is a great choice for many sites. However, if the site requires that you log in, you may need an alternative. A great choice is the [Axe Chrome plugin](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US).
To install the Accessibility Scanner on android, search for it in the
Play Store and install it on your device or emulator. The installation
......@@ -98,10 +100,9 @@ page to get the scanner working on your device. Another option is to install the
For iOS, you should install the Accessibility Inspector, which is freely available through the App Store. More details on [testing for accessibility in iOS.](https://developer.apple.com/library/archive/documentation/Accessibility/Conceptual/AccessibilityMacOSX/OSXAXTestingApps.html)
## 2. Collect Data on accessibility problems using TWO DIFFERENT accessibility technologies
Use *multiple approaches*, including at a minimum **a screen reader** and **magnification** to assess the website
and/or app, and your ability to complete the assigned task using
accessibility tools. You may also use other accessibility tools if you
feel there are things that does not address, such as speech based input, or switch input.
Use *multiple approaches*, including at a minimum **a screen reader**, and an other AT to assess the accessibility of the website and/or app, and your ability to complete the assigned task using
accessibility tools. The second AT you choose should provide different information than what a screen reader would. For example, using switch control or voice input are good second choices. However, using the tab key to navigate the website as the second AT is **NOT** considered for competency.
You may also use other accessibility tools if
Here are some resources that may help you in gaining comfort with these accessibility technologies
- [Setting up a screen reader testing environment](https://www.sarasoueidan.com/blog/testing-environment-setup/)
......@@ -111,13 +112,13 @@ Here are some resources that may help you in gaining comfort with these accessib
- Advanced voice based input: [voice programming](https://www.youtube.com/watch?v=YKuRkGkf5HU)
## 3. Record the data in a *Usability Aspect Report*
Record each group of similar issues you find using this [Usability Aspect Report Template](webegs/UAR_Template.doc). Here is a [sample set of UARs](webegs/DDUARS.docx) that a prior student has kindly shared with us for you to look at. Make sure that your UARs are accessible. Be sure to include problems that you found with an automated tool *and* things that you could only find using manual testing with a screen reader or magnification or other accessibility technology.
Record each group of similar issues you find using this [Usability Aspect Report Template](webegs/UAR_Template.doc). Here is a [sample set of UARs](webegs/DDUARS.docx) that a prior student has kindly shared with us for you to look at. Make sure that your UARs are accessible. Be sure to include problems that you found with an automated tool *and* things that you could only find using manual testing with a screen reader or other accessibility technology.
Some key things to make note of:
- **Good or Bad Feature** *If your website as very accessible* you may include UARS for particularly good features
- **Source** including *your initials*; *the type of AT used*; and a unique ID such as JM-SR-3 (which means, approximately, Jennifer Mankoff Screen Reader UAR # 3)
- **Source** including *your initials*; *the type of AT used*; and a unique ID. For example, JM-SR-3 (which means, approximately, Jennifer Mankoff Screen Reader UAR # 3).
- **Name/Brief Description** Provide a very brief name/summary
- **Evidence** Specify the guideline violated and provide a screen shot with ALT text or other evidence.
- **Evidence** Specify the guideline violated and provide a screen shot with ALT text or other evidence of the violation.
- **Explanation** Explain why this is a problem (or good aspect).
- **Severity** Rank severity (with 4 being catastrophe)
- **Justification** Justify your ranking in terms of *frequency*, *impact* and *persistence*
......@@ -125,5 +126,7 @@ Some key things to make note of:
# Turnin
- Submit your UARS as an attachment to the appropriate discussion as specified in Canvas. Specify the tasks you were testing in your submission.
- Also write an answer to this question: What are some examples of problems you could only identify with manual testing using an accessibility technology (instead of an automated tester)
1. Submit your UARS (an accessible document that is not a PDF) as an attachment to the appropriate discussion as specified in Canvas. In addition to your UARs, this document should :
- Specify the tasks you were testing in your submission.
- An answer to this question: What are some examples of problems you could only identify with manual testing using an accessibility technology (instead of an automated tester)?
2. Also upload this document as a file upload on canvas.
......@@ -88,7 +88,7 @@ Therefore…
- Visual impairments
- Difficulty understanding content
- Difficulty hearing
- Difficulty manipulating mouse our keyboard
- Difficulty manipulating mouse or keyboard
all affect accessibility
......@@ -98,7 +98,7 @@ all affect accessibility
# What is the goal?
All users interact with the *same* website or app as anyone else
Users may use browser features or a specialist accessibility tool to customize their experience
Users may use browser features or a specialized accessibility tool to customize their experience
--
**This is Key**
......@@ -219,15 +219,15 @@ Open your phone's web browser and load [seattleschools.org](https://www.seattles
---
# In your groups
Visit [UW Libraries](https://www.lib.washington.edu/)
Visit [Seattle Public Schools](https://www.seattleschools.org/) or [UW Libraries](https://www.lib.washington.edu/)
The tasks you are evaluating is
1. Whether a student can easily learn about recent library news
1. Whether a student can easily learn about Seattle Public Schools or UW Libraries
2. Whether a student can "Report a Concern" about how accessible the website is
What are some problems you found? Try to separate out what is difficult for you as a beginner from what is a flaw in the website itself.
[Share your findings]({{site.discussion}}/454526)
[Share your findings](https://edstem.org/us/courses/41400/discussion/3598210)
---
# Wednesday's [Assessment Homework]({{site.baseurl}}/assignments/website.html)
......@@ -274,7 +274,7 @@ Content should be
- *Impact* – Is it hard or easy to overcome this?
- *Persistence* - Is there a way to avoid this problem?
What do you think? Discuss with your neighbor and post any questions [on Ed]({{site.discussion}}/454525)
What do you think? Discuss with your neighbor and post any questions [on Ed](https://edstem.org/us/courses/41400/discussion/3598210)
???
This is debatable, but frequency is low (it only occurs once on this site. If you are writing up all missing image alt text as a group, you might increase your estimate of frequency, but this site doesn't appear to have a lot of undescribed images); impact is low (it is possible to determine the purpose of this image by either clicking on it to see what it links to, or inferring some things from the external link and image file name (both unpleasant alternatives for a screen reader user); and persistence is high (it's not going to go away).
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment