Irish universities still fall short on website accessibility

Despite higher educations institutions having a couple of years to get their websites up to standard when it comes to accessibility guidelines, Irish institutions haven’t lived up to expectations.

By now, under the EU Web Directive 2016/2102 (EU Standard 301 549) all public sector websites and mobile apps should be regarded as accessible, which means that they meet the W3C’s Web Content Accessibility Guidelines (WCAG).

But when the National Disability Authority completed Ireland’s first monitoring report in December 2021 it found that none of the websites or mobile apps reviewed complied fully with the standard required under the directive WCAG 2.1 level AA.

During the testing of these sites, the Irish body checked the websites of four Irish educational institutes – Technological University Dublin, University College Cork, University College Dublin and the University of Limerick – and found them wanting.

We decided to take a closer look at the state of accessibility within higher education institutions, and run a series of simplified tests across a sample of pages on each institution’s website.

These were home pages, study or course pages, and current student pages. We also ran the tests against the top UK higher education institutes, just to see how the Irish ones stack up.

What we found was rather alarming: The Irish institutes fell short on their accessibility tests. Their British counterparts’ websites which, although were not perfect, fared better.

Why is this an issue?

Well, first, it is a government requirement to be compliant.

Second, if these websites are not compliant this means that a large number of students won’t have access to the important information or services available on them. Students with disabilities make up a large proportion of Ireland’s student population. In the 2017/2018 academic year students with disabilities represented 6.2% of the total student population.

The organisation Ahead, which helps create inclusive environments in education and employment for people with disabilities, believes that the true figure may be as high as 15% to 20%.

All of the major Irish universities were tested along with the following UK institutions:
 

• Anglia Ruskin University
• Ulster University
• University of Westminster
• Cambridge University
• Oxford University
• London School of Economics

Methodology

Here is an outline of the process we adopted, built upon Gov.UK’s accessibility monitoring guidance.

For each institution we investigated the following pages: home page, study or course page, and (current) student page. This ensured consistency and a reasonable spread of target audience.

First, we ran axe DevTools® browser extension, and noted the number of critical and serious issues found. 

Then we carried out these simplified manual testing steps:       

1. Browse around the page initially to identify interactive elements
2. Tab through page with keyboard only to check:
   1. User can navigate to (and action) every link and interactive element, without a mouse (WCAG 2.1.1 Keyboard)
   2. No keyboard traps (WCAG 2.1.2 No Keyboard Traps)
   3. Focus style and visible & focused element visible (WCAG 2.4.7 Focus Visible)
   4. Logical focus order, no unexpected / confusing jumps (WCAG 2.4.3 Focus Order)
   5. No unexpected behaviour on focus (WCAG 3.2.1 On Focus)
3. Zoom text size to 200% in browser to check navigation & content readable with no cut off (WCAG 1.4.4 Resize Text)
4. Simulate viewing page on small screen (increase zoom up to 400%) to ensure navigation usable and no content overlapping or cut off (WCAG 1.4.10 Reflow)
5. General check of page for unexpected behaviours: if animations or auto-scrolling carousels check controls available (WCAG 2.2.2 Pause, Stop, Hide)

Most common issues       

• The main navigation “drop-downs” are not accessible or controllable via keyboard. Alternatively, they are not visible when focused
• Text resize causes navigation or content to be cut off and unreadable    
• No controls to pause, stop or hide automatically scrolling carousels
• Elements on page have no clear focus style, the outline has been removed without providing appropriate replacement, or the element is not visible when focused

Breaking down the issues

These are the measures we looked at, why they are so important and how the sites fared in general.

Keyboard

Some people using the site may be using a pointing device, or a keyboard rather than a mouse so there is a need to be able to navigate to all links and interactive elements without a mouse, i.e. just by using a keyboard. This was more difficult than one might have thought, and many sites fell short here. The Irish sites displayed a 62% pass rate when it came to keyboard accessibility. The UK sites had a 67% pass rate.

No keyboard trap

This measure looks for keyboard traps (where a user gets stuck in a loop and can't get back to rest of page). This is basically how easy a site is to navigate using a keyboard. 

All the sites fared well on this. Both the Irish and the UK sites passed all of the tests in this section. Although on one Irish website that had a good score on this section I couldn’t get to the fees menu with a keyboard, so I’m not too sure how it passed the AI test. 

Focus visible

The focus surrounding elements is visible (so when tabbing to an element it is clear where you are on the page, which item is currently selected). 

Focus visible is another issue that’s quite common: Either information is hidden when you focus on them or there isn’t a focus style. That would affect anyone who’s slightly visually impaired or who has motor impairments and has to use the keyboard, so they can’t use a mouse, or maybe use a pointing device.

Only 31% of the pages tested on the Irish sites passed the focus visible test versus 67% of the UK sites’ pages.

Focus order

This checks that the focus order is logical, so when tabbing with a keyboard focus does not jump around or back-forward in a potentially confusing way so you lose  where you are on the page.

79% of the pages on the Irish sites passed on focus order, versus 100% of the UK pages.

On focus

When a user tabs through a web page using a keyboard, the behaviour should be predictable when an element receives focus. Forms should not submit automatically, open new windows or move focus another component on simple focus, without specific action by the user. All the pages tested passed this test.

Resize text

Content needs to still be readable and navigation still usable (and not cut off) when text is zoomed to 200%. This is an issue because it can affect a large number of people because many people – those with visual impairments or who wear eyeglasses, or whose eyes are tired - will want to increase the font size.

The resize text issue is interesting because it fails pretty much everywhere. The Irish sites had only 7% of pages pass this test. The UK university sites fared slightly better, on 28%, but resizing text was a problem overall.

Reflow

If the content is changed to organise to a narrow screen (320px) what happens to the website? Can you still read the content, and navigate through it? 93% of pages on the Irish websites passed on reflow, compared with 100% of the UK pages.

Pause, stop, hide

What’s happening to videos, animations or carousels on the website? Are they playing automatically? Is there an option to pause, stop or hide them?

Videos, animations or carousels should have this option so that, especially when it comes to users with issues such as dyslexia or neurological disorders, so these items don’t kick off automatically. These features are on plenty of the home pages and it’s rare that they have controls. Eight of the Irish pages had these features, and all eight failed the test. Of the UK sites only three had pages with these features, and all three passed the pause, stop or hide test.

Do quick fixes work?

Some of the websites had added accessibility overlays to their sites. This is a type of software or plugin that is offered to “improve the site’s accessibility” issues, by allowing users to increase font sizes and offer a sort of screen reader, for example. 

The problem is that some website owners add these, and think the problem has been fixed – but it has not been. These tools are limited and don’t actually solve the accessibility issues in your website’s source code. In fact, they can create additional barriers for disabled users.

If you are someone who needs a screen reader you will use your own screen reader anyway, so you’re not exactly going to use one that you might not necessarily even be able to access.

We would not advise the use of these overlays. It’s certainly not the quick fix people would want it to be.

Ultimately, the only way to truly ensure a website will stay compliant is to:

• Identify the areas that are most problematic
• Put together a plan and timeline to resolve those issues, focusing on most critical items
• Engage with accessibility professionals and disabled users
• Train and educate developers and content managers to ensure the website stays compliant once it has been fixed
• Implement mechanisms or processes to ensure inaccessible code or content is identified before it goes live
• Perform regular checks to rapidly identify issues and fix immediately.

The bottom line

How easy are these accessibility issues to fix properly? Some issues like colour contrast could be easy, others may require complex rework, or even lengthy conversations about alternatives.

Each website is unique, even if its built on the same underlying code, it has been set built differently and the issues really all depend on the design, code implementation, team and stakeholder involvement.

However, accessibility is an essential investment and when considered from the beginning will have a minimal outlay compared to complex retrofits.

The Irish university website that performed the best was actually spot on across the board in terms of all measures, it was just the text resizing that let it down. University websites can vary greatly from one section to another which makes full compliance a difficult task.

But the overarching feeling after examining the test results was one of disappointment that these education websites had still fared so badly when it came to accessibility issues.

The bottom line is that Irish sites were completely shown up by the UK sites. Why is this? Did the Covid-19 pandemic push everything back in terms of priorities? Is it a lack of in-house knowledge and skills, or code that doesn’t stand up to the accessibility guidelines? I’ll address these issues in my next blog.