📝 Penn Week 9a – Web Accessibility

Note about Exercises and Plagiarism

Through grading, I noticed some of you borrowed code from other sources.

Looking at other people’s code snippets is super helpful and encouraged, however, lifting it verbatim is not. You need to credit where you’re finding your code snippets, and build on it.

Please use these exercises to experiment with your own designs and ideas. The primary goal of this class is to deepen your own image making techniques and design processes. Showing me you can copy someone else’s code doesn’t show me this, and it robs you of an opportunity to create something on your own.

If you use an existing code sketch as a starting point, it’s necessary to write where you got your code from in the source code, and to change it meaningfully.

 Midterm grades are updated on Canvas

  • Midterm grades are not your final grade
  • You can resubmit any project or exercise by the end of the semester, as long as you turned it in on time the first time. If you do this, resubmit it on Canvas and write a note in the comments.
  • Midterms do not account for class participation and project development

đź““ Accessibility

As we learned from the Exclusive Design reading, inclusive design is a process rather than a check list. Accessibility is also about thinking through the design process and considering how non-technical details, like language, can provide a clear and meaningful experience, and considering this early on feels less exclusionary than adding adjustments as an afterthought. Keeping this in mind, I want to share a few technical considerations that might help your process.

Navigating with Voice Controls

In iOS
  1. System preferences
  1. Accessibility
  1. VoiceOver → enable voice over

On Windows you can use Narrator

Navigating with Tab


Web Contrast Color Checker


  • This tool evaluates contrast and provides a score for contrast. The scores are evaluated by three different metrics:
  1. Single A is viewed as the minimum level of requirement which all websites, apps, and electronic content such as documents should adhere to.
  1. Double A is viewed as the acceptable level of accessibility for many online services, which should work with most assistive technology which is now widely available on both desktop and mobile devices, or which can be purchased as a third-party installation.
  1. Triple A compliance is viewed as the gold standard level of accessibility, which provides everything for a complete accessible offering, including all the bells and whistles which make the difference between a very good experience and an excellent one.

(Descriptions from Digital Accessibility Centre)


Web Content Accessibility Guidelines


Highlights all requirements and guidelines at the time of publication. 

Online Tests and Tools

Tools