Readability and colour choices

Colour contrasts can be deceiving because we are subject to optical illusions. The video below shows how two different shades of grey are actually the same. That’s why you can’t rely on judging contrast by eye. Fortunately there are colour checkers to help with colour choices especially for websites. And why do you need colour contrast checkers? Because more than 8% of the population has colour vision deficiency (colour blindness). 

UPPER CASE is not good for readability

Colour choice is one factor in readability. Others include using sentence case. Using upper case or capitals does not convey important messages more urgently. The image shows that using upper case to indicate a low bridge did not stop a truck driver from driving under it. Upper case is harder to read because the shape of the words are unfamiliar. 

A semi-trailer is stuck under a bridge with the warning "low bridge" in upper case.

Colours for reading and learning

The processes of how we read text has an impact on how we take in information. Colour coding can help readers quickly identify key information and assist their reading and writing. Colour coding has gained popularity in classrooms to support student learning and reading.

The title of this paper is, What Color Scheme is More Effective in Assisting Readers to Locate Information in a Color-Coded Article?

From the abstract

Color coding, a technique assigning specific colors to cluster information types, has proven advantages in aiding human cognitive activities, especially reading and comprehension. The rise of Large Language Models (LLMs) has streamlined document coding, enabling simple automatic text labeling with various schemes.

This has the potential to make color-coding more accessible and benefit more users. We conducted a user study assessing various color schemes’ effectiveness in LLM-coded text documents, standardizing contrast ratios to approximately 5.55:1 across schemes. Participants performed timed information-seeking tasks in color-coded scholarly abstracts.

Results showed non-analogous and yellow-inclusive color schemes improved performance, with the latter also being more preferred by participants. These findings can inform better color scheme choices for text annotation. As LLMs advance document coding, we advocate for more research focusing on the “color” aspect of color-coding techniques.

Website readability

The most accessible websites are those that have an Easy Read option.  A good example is the My Allied Health Space. At the top of the home page is the symbol for Easy Read and this is where you click to turn it on.  Below is first, the standard webpage followed by the Easy Read webpage.

Screenshot of Allied Health Space standard format.

My Allied Health Space home page with option for Easy Read at the top of the page.

Screenshot my allied health space in easy read format.
My Allied Health Space with Easy Read option turned on

Thanks to Dr Em Bould, Senior Research Fellow at Monash University for the inspiration for this post. Dr Bould has great advice on this topic based on research.   

AI for captioning

A speaker stands at a lectern and captioning sceen is behind his right shoulder
Dedicated captioning screen close to the speaker.

Artificial Intelligence (AI) can take captioning to another level claims Microsoft. AI for automatic speech recognition removes the need for a human captioner for lectures in universities and elsewhere. The Microsoft AI blog article and video below focuses on deaf students, but more people are taking to captioning on their phones for convenience.

Captioning helps all students by adding another layer of communication and this point is made in the article. The captioning is turned into transcripts and students have a reference to read after the lecture. They can also have the lecture automatically translated into several languages.

This is a detailed article and covers automatic speech recognition, translations, and a growing demand for accessibility. This technology is not expected to take over from Auslan or ASL as they are languages in their own right. However, this is another example of how technology is helping humans by taking over from humans and bringing the advantages to more people.  

Note on the image at the top: The image shows Dr Ger Craddock at the inaugural Australian Universal Design Conference in 2014. A captioner sat in the room to caption real time. Speaker names and place names were given to the captioner beforehand to prevent errors.

 

Accessible websites need accessible content

Close up view of a web page where content can be added. Accessible websites need accessible content.As our lives transition to digital formats it’s important to know some digital accessibility basics. Creating accessible websites is the first step. But accessible websites need accessible content too. If your Word or PDF documents end up on a website, will they be accessible? 

Gregg Vanderheiden from the Trace R&D Center has developed an Accessibility Masterlist which has more detail on accessible digital design. The Masterlist acts as both information and a checklist for developers and others.

The Masterlist is helpful for anyone engaging a web designer because it shows what needs to be considered.  Most web designers know about web accessibility and say they will meet the standards. However, standards are a minimum and tend to get tacked on at the end. Not the best solution – better to be integrated to avoid digital clunkiness. 

Some Quicksheets

Here are some of the 33 Trace R&D Center Quicksheets that summarise information:

What are Learning Disabilities?

Cognitive Disability

Accessible content – everyone’s business

A laptop is open on a desk and a tablet next to it. Accessible online content is everybody's business.You don’t have to be a technical expert to do simple things such as using a clear font and ensuring colour contrast. Describing images using the alt-text feature helps people with screen reader. It also adds to search engine optimisation which means Google will like you more. Captioning videos is essential because it is useful for everyone – it’s universal design. 

An easy-to-read magazine article from Canada explains more on their blog page, which is an example of clear text and plain language. The title of the article is, Experts calling on businesses to make their online content more accessible.

Web design is one part, uploaded documents also need to be accessible.Check out the WCAG for people who haven’t read them

A related resource is the Handbook for accessible graphic design. .

Making online spaces accessible

A laptop screen is open showing participants in an online meeting. Making online meetings accessible.Citizen action has never been more important and much of this is done online and through social media. This is due to the ease of technology, a pandemic and plain economics. Consequently, it’s important to make online spaces accessible for everyone. 

On The Commons Social Change website, Manisha Amin provides some advice form making online spaces accessible. Here are some facts about the Australian population:

      • 18% living with disability
      • 70% of disabilities are invisible
      • 20% have a long term health condition
      • 28% live in regional and remote areas
      • 48% born overseas or have parent born overseas
      • 8% men are colour blind

These figures don’t include people who have a temporary loss of capability, such as a broken leg. 

An inclusive social environment, online or face to face, is created through respect and listening. Being accountable for your own emotions and accepting all experiences are valid are important too.

Online meetings have benefits and drawbacks and not everyone needs the same features. For example, having video on helps people to lip read and see facial expressions. But some people with neurodiverse conditions find video distracting. 

Live captioning is better than auto-generated captioning and provides a transcript later. Captioning is also good for people with limited English language skills or find different accents difficult to understand. 

The article is titled, Digital Accessibility: Making Online Spaces Accessible. There’s more information about preparing for meetings and good advice about learning to be inclusive. Don’t worry about not getting it right first time – it’s a learning journey for everyone.

In addition, meeting facilitators need to be aware of the power dynamics in the room. Who holds the pen? Who has the loudest voice or the most influence?  

Sheri Byrne Haber has also written about Zoom for people with vision loss.

Economics of universal design in ICT

Part of a computer screen showing code. Economics of universal design in ICT.It is often thought that economic arguments will win the day if social justice arguments are ignored. This may be partially true if these arguments are allowed to be heard. “On Assessing the Costs and Benefits of Universal Design of ICT”, is another attempt to show that universal design has cost benefits, particularly if you take the longer view. This research paper on the economics of universal design in ICT is from Norway.

Abstract: In the ICT and IT domains, universal design is typically viewed as a burden and an expense, and its application is often justified only by ethics and/or legislation. Advocates for universal design are arguing that it is cost-effective, but so far there are few studies that document this in a detailed way. In this work, we discuss related research and studies dealing with the costs and benefits of accessible and usable ICT solutions.

In particular, we discuss the findings regarding what is a universally designed solution, what is needed to make such a solution, how much does it cost, what impact can be anticipated by the extra effort, and how it can be measured.

Finally, we suggest an approach for carrying out cost-benefit analyses of developing universally designed solutions. There is a weak indication that the economical benefits of UD solutions are much higher than the initial and running costs.

I think it is problematic to talk “cost-benefit” because politically it seems it has to benefit those who are not excluded. “Cost effectiveness” is a somewhat different measure with a focus on outcomes rather than outputs. Schraner et al have developed a different model using assistive technology as a case study.  Jane Bringolf, Editor.

Using AI to remove accessibility barriers

a graphic representing Artificial Intelligence. Using AI to remove accessibility barriersThe latest CanAxess newsletter features a visual podcast on AI for Accessibility. The team from Global AI discuss how using AI to remove accessibility barriers can help people with cognitive impairments understand content better.

There’s a second video on Inclusive Design 24. This one is about using screen readers to evaluate a website. There is also a link to a repository of downloadable screen readers testing resources.

Other articles include automating accessibility testing and a list of useful links about usability. Jonathan Kaufman writes in Forbes magazine about how accessibility is a wake up call for the progress of business evolution. He writes: 

“Microsoft’s CEO Satya Nadella said, “… top of mind for me… is how we must make Microsoft products accessible to the more than 1 billion people globally of all abilities… Universal design is central to how we realize our mission and will make all our products better.” 

Discover more about accessibility in the ICT and Universal Design section of this website. 

Posters for digital design

Graphic of a male sitting behind a computer screen with the words web design on the wall behind him.Web designers provide the framework for content. Then it’s up to others to provide the content. Pictures, videos, text, colour, readability are important for accessibility once the site is built. 

The UK Government has a series of six digital design posters for designers. The aim is to raise awareness of people with different digital access needs. To keep things simple, the posters are divided into Do and Don’t. The content of each poster is listed on the webpage titled, The Dos and Don’ts on designing for accessibility.  Also available in 17 languages.

One of the six Do's and Don'ts Posters, mobility, showing a short list of do's and don'ts of accessibility.
Do’s and Don’ts Poster

The posters help designers make online services accessible. They cover low vision, deaf and hard of hearing, dyslexia, motor disabilities, people with autism and users of screen readers.

The posters are simple and this is what makes them effective. Basically they act as visual prompts to designers rather than offering technical know-how. There are posters for people:

with autism

who use screen readers

with low vision

 with dyslexia 

who are Deaf or hard of hearing

with physical or motor disabilities.

Posters by Barclays Bank 

A screenshot of the inclusive digital design poster showing the principles of inclusive design
Digital design poster

Barclays Bank has developed a set of inclusive digital design posters. They are based on seven design principles. These principles can be applied to other design fields as well as digital platforms. You can download the A3 poster which gives a quick overview. Or download a more detailed  set of A4 posters.

The posters are a good quick reference for web and app design professionals. The seven principles below are explained in more detail: More detail of the seven principles are explained:

      1. Provide comparable experience
      2. Consider situation
      3. Provide comparable experience
      4. Be consistent
      5. Give control
      6. Offer choice 
      7. Prioritise content
      8. Add value

 Artificial Intelligence and inclusion

The way businesses design and develop new technology will determine the inclusiveness of our digital society. Technology has the potential to bring people with disability into the workforce. 

The 24 page PDF report, Amplify You, covers understanding the digital divide, design for humans, AI is the new UI, and more. I the last section, What to Do Now, it has bullet points under headings of: Understand the implications of accessibility, Design accessibility into your business, Build an ecosystem of accessibility – and continuously think about what is next.  

Writing alt-text and choosing colours

A laptop computer on a desk showing several pictures. How to write meaningful alt text and choose colours.When you are in a rush it’s easy to leave out the description of the image in the alt-text box – but should you?. Alt-text is a description of an image that’s shown to people, who for some reason, can’t see the image. Among other things, alt-texts help:

    • people with little or no vision
    • people who turn off images to save data
    • search engines find your website and posts

People with little or no vision probably benefit most from alt-texts. They use a screen reader to navigate the web.  If you don’t include alt-text you run the risk of a screen reader trying to convey something like “publicity_pre_launch.jpg, or “cropped_img32_900px.png”. Find out more from Axess Lab on how to convey context and meaning without writing an essay! Once you get into the habit, it doesn’t take long to do.

Choosing colours for websites

Colour diagram showing the three different types of colour vision deficiencyColour vision deficiency or colour blindness affects around 10 per cent of the population. But each person varies in what colours they can see, which is why it is not “colour blindness”.  So what colours are best if you want all readers to enjoy colours on your website?

Colour choice is not just a matter of making it look good – it can affect the readability of text and graphics as well.

A small qualitative study looked at two websites to assess their readability and usability by people who have colour vision deficiency. The researcher analysed body text, background and links and found they affected usability of the websites. The results should be read in conjunction with the methodology otherwise it won’t make sense. The conclusion section does not provide the specific outcomes.

The title of the article is, The effects of color choice in web design on the usability for individuals with color-blindness.  This is a Masters theses.

Colour kindness for colour blindness

A group of people standing holding a pink banner with the words You are Not Alone, but you can't see the word NOT because it is in pale red and blends into the background colourIt’s one thing to talk about colour blindness, but it is quite another to see what it looks like to the 6-10 per cent of the population that have colour vision deficiency. Axess Lab has produced an excellent set of successes and failures using real life examples of colours used by web designers.

These examples provide really good guidance for anyone involved in web content and design, as well as printed material. The blog page has links to more information. There is a nice pic of what a football field looks like to someone who can’t see red and green – so it’s not all about the web – it’s all around us as the picture shows. If you want to see more on this topic see ColourBlindAwareness Twitter feed. 

The banner in the picture shown should read ‘You Are Not Alone’, instead it looks like, ‘You Are Alone’.

 

Understanding typefaces for accessibility

Example of typefaces images.
Image courtesy Medium

More people have difficulty reading than most people think. Low vision, dyslexia, low literacy, and learning disabilities are some of the reasons. Previous posts have covered the topic of plain language and Easy Read. But choosing the right typeface is also important for communicating successfully. Without understanding typefaces, things like colour contrast will make little difference. 

Gareth Ford Williams explains key elements in his article. He says claims of some typefaces being more accessible than others are not backed up by evidence. 

lower case 'i' and upper case 'L' and '1' look the same.
Gill Sans upper case ‘i’, lower case ‘L’ and ‘1’

Different typefaces provide different styles in how letters are formed. For example, Gill Sans upper case ‘i’ and lower case ”l’ and ‘1’ look the same. However, in Verdana they are distinct from each other. 

Mirroring is something than young children do. For example, muddling ‘b’ and ‘d’ and ‘p’ and ‘q’. However, the letter flipping effect can be lifelong. 

Spacing or ‘visual crowding’ is another consideration. Some typefaces have the same space between letters regardless of letter width. Helvetica is one example. Calibri has different spacing between letters. A wide letter like m has more space around it than an i or a t. In some cases the letters can look joined up such as ‘ol’ or ‘vv’. Tight letter spacing is not great for people with good vision either. 

The article has several good examples to illustrate points made. The title is, A Guide to Understanding What Makes a Typeface Accessible. Williams makes the point that there is no one right typeface. As always, it depends on your audience. However, this article provides great insights into yet another aspect of communicating accessibly. The article is technical in some places.

Thanks to Dawn Campbell on Linked In for alerting me to this article.

How web design decisions are made

Graphic indicating web design.When choosing a web developer to update your site, don’t assume they know all about accessibility. The guidelines for web accessibility are often treated like tacked on ramps to a building. That is, something you think of after you’ve done the design. To ensure accessibility of your site, it pays to know how web design decisions are made. And you don’t need to be a tech person.

A paper from the United States spells out the development process to show how accessibility gets missed. The authors report that one study found that more than 70% of websites contain multiple  barriers to accessibility. Another study found that almost all homepages didn’t meet the basic web standards for accessibility. 

The Web Content Accessibility Guidelines (WCAG) are a general guide for developers. But they are not the total answer because they are more about code compliance than accessibility. Hence, design briefs need to include usability testing early in the concept stage. 

The process often begins with brand, customers, and the message to be communicated. This stage rarely involves accessibility concerns. Designers make assumptions about users – usually people like themselves – for the next steps. Designs are reviewed by art directors and brand creators. Colours and font choices are considered at this stage but without reference to accessibility. 

If the design team lacks diversity this is where design justice becomes design privilege. Before any coding takes place, images, animations and graphics are created to show what the site will look like. Users are not involved in the testing at this stage. The key issue with web accessibility tools is that they look at code, not these mock-ups. 

Priority is brand message

The prototype stage would be a good point in the design process to begin user testing. It is as this stage colour, font, layout and other critical access features can be addressed. However, communicating brand message takes priority. Responding to the needs of less privileged and less able users is left for coding checks rather than usability checks.

The authors conclude that considering accessibility early in the process can bring greater usability for all. However, industry development processes often result in accessibility being an afterthought. Standards are not enough to meet the needs of all users. Consequently, industry’s internal processes need to change. 

The title of the paper is, Addressing Accessibilty as Advocacy. The authors use the term “special needs”. The article is easy to read and not tech-based. It is more about advocating for social justice in the digital world.

Choosing an IT designer

computer screenThe Centre for Excellence in Universal Design in Ireland has a comprehensive IT Procurement Toolkit. It takes potential purchasers of IT systems through the process of procurement, including assessing potential suppliers, and overseeing the successful implementation of accessibility features. It also shows how to manage the accessibility of the system once the set-up phase is complete. This means ensuring that documents staff produce for the website also meet the accessibility criteria. Each section of the Toolkit is provided separately. It includes: 

    • Writing Request for Tender
    • Assessing Candidates and Tenders
    • Development and Implementation
    • Evaluating Deliverables
    • Maintaining Accessibility.

Cognitive disability digital accessibility guide

Front cover of the cognitive disability digital accessibility guide.The ability to access online content provides access to goods and services, and in COVID times, each other. But content on websites and smart phones is not user-friendly for everyone, particularly people with cognitive disability. However, digital communication is here to stay and it needs to be inclusive. The Cognitive Disability Digital Accessibility Guide explains the important aspects for organisations that publish documents online. 

The Guide is designed to provide practical, step-by-step information for designing and delivering effective best-practice digital communication. Some of the guidance is easy to do, for example, defining abbreviations and acronyms. The Guide provides useful information on:

    • How to support people with cognitive disabilities to use computers and mobile devices.
    • Developing documents structured and written in ways that support people with cognitive disabilities.
    • Guidance on policies and standards for people with cognitive disabilities in an organisational context.
    • Preparing communication messages for people with a cognitive disability.
    • Creating websites that support people with a cognitive disability.

The Guide also covers traditionally-implemented accessibility guidelines of WCAG 2.0 Level AA as well as looking at the increasing relevance of Level AAA requirements. It also delves into the role of affordable consumer devices such as tablets and helpful apps.

Of course, if the design is suitable for people with cognitive disability, there is a very good chance it is going suitable for everyone. This has been shown with the use of plain language summaries

Centre for Inclusive Design (formerly Media Access Australia) produced this guide. Although it was published in 2016, most of the information is still relevant. 

People with cognitive disabilities or impairments include: acquired brain injury, autism, dementia, developmental disability, Down syndrome, intellectual disability, dyslexia, attention deficit disorder, and learning difficulties in general.