Web Accessibility

Peanut butter and jelly sandwiches might just be more classic than apple pie (insert googling to see if PB&Js are actually an American thing...inconclusive, but seems likely). My group in ENGL 521 decided to focus on something simple and familiar for our culminating project in web accessibility: How to make a peanut butter and jelly sandwich. Since the process of actually making a PB&J is common knowledge, we were able to put a fun spin on the project and really focus on the intent of the assignment: creating accessible documents for the web.

We created three items: a website, a PDF and a video. I created the PDF, which was a fun exercise in design and accessibility. The project was also a lesson in how planning a document for accessibility from the beginning makes the document better for everyone. Read my full project reflection below.

 
WebAccessibility.png
Accessibility Check

Accessibility Check

Accessible PDF How-to Document

Accessible PDF How-to Document

 

Web Accessibility Task Reflection

 

As a culminating project for ENGL 521 - Topics in On-Screen Document Production - Web Accessibility, I chose to work in a group with two fellow students to create an accessible website and materials that would teach users how to make or do something. After a bit of brainstorming, we settled on a familiar topic: how to make a peanut butter and jelly sandwich. In this reflection, I’ll share what we included in our project, what we did to make it accessible, what we might have done differently, and my role in the project.

Rhetorical Situation

Handicap parking spots, crosswalks that make sounds, and wheelchair ramps into buildings are common sights, but we’re just beginning on the path to making the virtual world fair and equitable to all. As the internet grows and changes, it’s important that the information at many of our fingertips is easily accessible for everyone, even those who have disabilities.

Many fully-able people, myself included, are shocked to discover the  blocks and difficulty that people with disabilities encounter when trying to simply use the internet. Videos need captions for those who can’t hear and audio descriptions for those who can’t see. Websites need clear, properly coded structure to ease navigation for those who can’t use a mouse or touchscreen, and websites must have good color contrast and alternate image text for those with poor vision. PDFs need to be easily perused with a screen reader through inclusion of proper heading and paragraph styles and alternate text for images. Even if some of us don’t “need” these features on the web, it’s important that we advocate for making the internet a fair and equitable place for ALL humans.

Some people argue that designing for accessibility can negatively impact aesthetics or limit “good” design. Yes, retrofitting old-school non-accessible things (whether we’re talking websites or buildings) can have less aesthetically pleasing results. But I would argue that this is not the result of making something accessible, it’s the result of laziness. Every design has parameters, and if we can shift our thinking from considering accessibility a limitation to considering it a parameter (just like the other parameters that we accept without question), accessibility becomes just another part of the design mix. Accessibility and “good” design are not mutually exclusive. And, it turns out, making improvements for accessibility creates a friendlier web for everyone.

My Contribution

My group worked together to decide on a project theme, and then developed a plan for project components, and how to ensure that all the components were accessible. We settled on creating a website, a video and a PDF, because all are commonly used on the internet today, and all have clear standards for accessibility. I selected creating the accessible PDF for my portion of this project. The other members of my group were excited about building the website and creating the video, and I have a lot of experience with design and making PDFs accessible through my past job, so the PDF portion of the project was a good fit for me. 

Strengths/Weaknesses

For the project overall, my group did an excellent job of planning for and testing our materials’ accessibility.

Here’s what we did to ensure everything was accessible:

On the website we:

  • Used proper heading and paragraph styles

  • Assigned alt text to all images

  • Checked tabbing capabilities on the site for people who can’t use a mouse

  • Used plain language for all text

  • Provided warning for those who have allergies

For the PDF we:

  • Used Adobe Acrobat to tag all elements

  • Ensured the PDF passed theAdobe  Acrobat Full Accessibility Check

  • Checked Accessibility using Funkify tool for contrast

  • Laid out the steps using plain language

  • Included allergy warning

For the video we:

  • Provided a script of the audio content

  • Created closed captions

  • Ensured that narration matched what was happening on-screen

  • Used high contrast text for on-screen words

  • Stated on-screen text for people with vision issues

For my PDF specifically, I felt that I did a good job creating illustrations, used simple straightforward structure for the document, and simple language for the text. I even had a bit of fun by creating the exploded diagram to show the “parts” of a peanut butter and jelly sandwich. 

As far as document weaknesses, a few grammatical tweaks could make the instructions more clear, as well as changing the on-page position of the warning message to make it more prominent. We also could have gone more in-depth on safety concerns (considering things like knife use, age recommendations, etc). Otherwise, I felt that our project was solid and demonstrated good balance in the amount of information we provided.

What I Would Change

One revision is considering whether the type of warning label I used on the PDF was appropriate. In my excitement to include a warning label, I hadn’t thought about the varying levels of warning labels. For a revision, I would research warning labels and use a more appropriate label if needed. Beyond that, I was pretty satisfied with how our project turned out. I feel that as a group we fulfilled the goal of teaching the user to make a basic PB&J and providing alternative recipes (which were included on the website) without going overboard.

What I Learned

As I mentioned above, when I first started learning about web accessibility, I was shocked at the difficulties people with disabilities face in using the internet. Making a website, PDF or video accessible isn’t easy, but it’s so, so important. And creating accessible content is not something that just anyone can do. However, anyone can LEARN to do it. Learning about and then actually using tools that check accessibility was invaluable for emulating disabled people’s experiences and to learn more about what makes online materials truly accessible. 

The experience also highlighted something else: Planning for accessibility from the beginning is much easier than tweaking content to be accessible after it’s created. If you consider accessibility rules in the earliest planning stages, your documents and websites will have better structure, and include features useful to people with and without disabilities. Web accessibility is worth the work.