Tuesday 29 November 2022

Conducting My First Accessibility Awareness Workshop @ University of Reading

Last Tuesday, I ran the first accessibility awareness workshop at the University of Reading with the Student Support and Engagement team. My colleague, Mira, was also there to help me facilitate the workshop. I planned the workshop to be delivered in person with a lot of activities for the participants to take part in. With twelve people in the room, it felt like the pre-COVID time when we used to have many in-person activities and meetings. 

We first looked at the importance of accessibility. I like using the video Experiences of Students with Disabilities created by WebAIM in my workshops. Though it was created a while ago, this short video provides a good insight into students’ lived experiences. The video shows students using various assistive technologies and as the first workshop activity, the participants were given the chance to use Windows Narrator, the built-in screen-reading app for Windows, to get exposure to assistive technologies. 

Participants using screen reader software


Then we discussed the legal landscape, especially the difference between providing reasonable adjustments under the Equality Act and the more proactive nature of the Public Sector Bodies (Websites and Mobile Applications) Accessibility Regulations. We also looked at web content accessibility guidelines and how detailed they are. 

The next part of the workshop focused on what we can do to make content more accessible. We looked at the use of colour. Having sufficient colour contrast between foreground and background is important to make text easily readable. WebAIM colour contrast checker can be used to check colour contrasts and it helps to interpret the colour contrast according to the current accessibility guidelines. This is a short interactive, e-learning activity on Accessibility: Colour Contrast Checking. We also talked about colour vision deficiency and the importance of not using colour alone to differentiate information. I used a lot of video clips to show how screen readers would read accessible and inaccessible content. I used this to demonstrate document structure, tables, and alternative text. When you see how assistive technologies make use of the metadata it is easier to engage with the accessibility good practices because you know what you do makes a difference. 

As the final activity participants in groups looked at a Microsoft Word document ladened with accessibility issues and tried to resolve the problems and make it accessible. We had a lot of time to discuss various issues colleagues have seen over time as well as to refer to the daily experiences of people with hidden disabilities. 

At the workshop, we also had Cambridge simulation gloves and Optima Simulation Specs so that the participants could experience how some of the mobility/dexterity and visual disabilities can affect people in their daily lives. 
Participants using Cambridge simulation gloves



We got very good feedback and the pre and post-survey asking specific questions about accessibility awareness showed a marked increase in awareness. I am already looking forward to the next accessibility workshop! 
Post-it notes with scribbled feedback



The accessibility workshop was fantastic for my professional development. I gained a much greater understanding of the topic and how it relates to my individual work context. Rather than it feeling like a complicated added responsibility, I now see accessibility as a mindset that will benefit everyone from students to colleagues. It was very interactive and I have walked away with easy to execute practical examples and strategies. Mathew Haine, Student Outcomes Manager (Awarding Gap)

Friday 23 September 2022

Making equations accessible

 Today I watched the JISC Accessibility Clinic recording A collaborative approach to maths accessibility learning a lot about the challenges in making math or STEM content accessible. 

I have used MathJax and MathML with Moodle and have blogged about it earlier in my work at UCEM



Listening to and watching a demonstration of the LaTex and how PDF export loses the structure of equations made me think of the number of inaccessible learning materials we could be having. It is definitely something that we all will have to work on.

So I am looking at how MathJax can be included in a standard HTML page like this blog page.

If I try to include the Pythagoras theorem's equation for hypotenuse I will have to type something like 
hypotenuse  = (a^2+b^2)^0.5 because I am not familiar with MathML to make it work.

But now I can use MathJax. You add these two lines into the HTML code.

<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>

Then write your code 

<p> \ [hypotenues =  \ sqrt{a^2+b^2}\]</p>

There are no spaces between backslash and the character next to it but to show how to write the equation I am adding spaces

Then the MathJax will make it look like

\[hypotenues = \sqrt{a^2+b^2}\]

There are obviously some notations to learn.

MathJax documentation on Writing Mathematics for MathJax 

\[...\] for displayed mathematics

 \(...\) for in-line mathematics and lots more for various operations.

Tuesday 1 February 2022

Find Colour Contrast

Sufficient colour contrast is important to make it easier for people to recognise foreground from background. There are three WCAG 2.1 guidelines on accessible colour contrast and they are:

1.4.3: Contrast (Minimum) AA

  • Text contrast ratio of at least 4.5:1
  • Large text 3:1 
  • 18 point text or 14 point bold text is judged to be large enough

1.4.6: Contrast (Enhanced) AAA

  • Contrast ratio of at least 7:1
  • Large text 4.5:1 

1.4.11: Non-text Contrast  AA

  • UI component and graphical objects to have 3:1 contrast against adjacent colours

Web AIM contrast checker is the tool I use all the time to check colour contrast. Recently I noticed that they have made it better by allowing the option to pick colour using colour picker. So now there are three ways to provide colour you want to test:
  1. Hexadecimal value
  2. RGB value
  3. Using colour picker
I created a new video to demonstrate this new feature. If you are not familiar with hexadecimal or RGB representation of colour, view the short video Find Digital Representation of Colour (RGB and Hexadecimal) first.