“Don’t settle for the world from just your angle, remember that we’re all part of one giant dream tangle” – Brad Montague

In learning more about the Web Accessibility Guidelines (WAG) this week, I expanded my understanding of accessibility, as it relates to the internet and broadened my perspective on Universal Design for Learning (UDL).  In my opinion, this is an important concept for pre-service teachers to consider if we hope to effectively support and engage each of our students.

One of the few social media platforms that I engage with is Instagram.  In a previous version of this life I was a stay-at-home-homeschooling mama, with jewellery making as a side hustle. Instagram was a way for me to connect with the local art community, as well as promote the markets and the shops that were kind enough to host my work.

Over the past couple of years there has been noticeable movement towards making this platform more inclusive.  Instagram shares that they have created an “automatic alternative text”, as well as “custom alternative text” with each providing an expanded capability and a variety of new text fonts that allow users to include descriptions of the images they post, which enables those using screen readers to engage with the individual post, and to a greater degree with the platform. If you are curious to learn more about screen readers, the website NOMENSA has a great overview.

In trying to gain a better understanding about what the WAG means in terms of students and teaching, I found this video on “Website Accessibility” to be extremely helpful


In the video Ran Segall discusses;

  • Color, Contrast & Text size
  • Apps that can assist with implementing WAG guidelines for example the MDS Contrast -which supports designers in ensuring their website’s color + contrast is accessible
  • Design Focus States – for people who use a keyboards + tab to engage with the web
  • Form Labels – asks that you include the labels above for the form field vs. within the form field
  • Alt tabs for images – ensuring that designers place a description explaining what an image is that can be read by a screen reader

This article, ‘Font Legibility for Students who are Blind or Visually impaired‘  by Carmen Willings, is aimed primarily at the accessibility of paper resources, but discusses many of the same requirements that Ran Segall unpacks in the above video and goes into greater detail around what, for example, text accessibility involves.

In the article Willings shares that the most legible fonts are;  Arial, Verdana, Tahoma and Sans Serif,  that contrast is more effective at setting text apart than color and that size is better at creating differentiations in text when compared with the use of italics, all caps, no caps or the other more flourishy fonts, which can all be challenging for the visually impaired to navigate.

Some of the above were quick fixes, like experimenting with color contrast for my links but others, such as differentiating fonts, sizes and underlining text, were trickier and required that I wade into the world of HTML coding.

After a little research, and as a basic place to start, I have compiled some simple HTML codes from W3Schools  that I found helpful  in customizing  text font,  size and color.

Font::  <p style=”font-family:font name here “> your paragraph.</p>

Text Size::   <p style=”font-size:size#px“> your paragraph.</p>

Text Color::    <p style=”Color: color “>your paragraph.</p>

Note: Although it uses “your paragraph” to highlight the text you want to adjust, from what I understand they can be used to highlight a full document, certain paragraphs or single words,

This is obviously not an extensive list, but for me it offers a solid and practical place to start.  I experimented with coding, in an effort to customize the text of this entry, but ended up with my text jumbled on a black background – so frustrating!!

I will continue looking into this because I am committed to figuring out how to code, at the very least, for the three aspects listed above,  I am really unimpressed that the standard “block quote” format gives such little contrast between the grey background and the slightly darker grey text (!?) and I am still confused about how to underline. (tips are welcome!)

I really enjoyed this week’s material and am inspired to learn more about accessibility as a foundation for applying  UDL across my practice.

“Like birds in a murmuration creating figures in the sky, maybe one day we’ll understand, we all help each other fly”. – Brad Montague

 

Additional Resources

Apple Accessibility – the Apple page that links various apps designed to address accessibility for vision, mobility and hearing differences

Carnegie Museums:  Web Accessibility Guidelines v1.0 – provides a ‘Best practices’ for text,  and two graphics that illustrate contrasting color (in code) on various backgrounds.