West Of England Combined Authority : HeX Productions

Case study brief: Website audit testing and accessible web development for WECA

West of England Combined Authority (WECA) is a devolution authority made up of Bath & north East Somerset, Bristol and South Gloucestershire Councils. The authority manages significant decisions and responsibilities for the three local authorities as a combined WECA authority.

As a public body, WECA required their website to be in line with the Public Bodies Accessibility Legislation, requiring it to meet WCAG 2.1 Level AA requirements. The authority commissioned HeX’s partners at Shaw Trust Accessibility Services (STAS) to deliver user testing for an accessibility audit and report on the level of accessibility on the current website. From those reports, WECA needed development support to help remediate any accessibility issue presented. HeX was recommended as a partner of STAS to assist with the fixing of the issues on the website.

Using unique coding and specialist themes made this case study unique

Shaw Trust Accessibility Services provided the user testing report to HeX prior to the fixes being made. HeX maintained contact with Shaw Trust Accessibility Services and WECA throughout the process.

HeX has significant experience in developing on the WordPress content management system, which is what WECA uses. HeX ran through the report ensuring that fixes were made in line with WCAG 2.1 Level AA requirements. The team were able to overcome the barriers that a WordPress theme posed, using JavaScript, CSS, php and child themes in order to customise the code and style of the website fixing any obstacles found. Many of the obstacles focused on links and buttons which HeX fixed by adding ARIA labels to them.

Audit and development activities delivered

Automated audit software scanning of websites.
Manual user audit testing with assistive technology and devices.
A technical review of the site, assessing codebase errors.
Accessibility report detailing site accessibility enhancements, linking to the WCAG criterion.
Accessibility consultancy giving demonstrations with the use of assistive technology and guidance on the site changes required.
Accessible web development work.

Liaising with user testers to understand errors present on an accessibility report

Alan Sleat, from the SYAS team, sat in front on a computer and wearing a headset - testing websites.

West of England Combined Authority (WECA) commissioned Shaw Trust Accessibility Services to carry out a user test of their website. This user test was in preparation for the Public Bodies (Websites and Mobile Applications) Accessibility Legislation 2018 coming into force in September 2020. The authority was aware they needed to be compliant to at least WCAG 2.1 Level AA but needed confirmation on whether they were or not.

The initial user test had been completed by our partners at Shaw Trust Accessibility Services. The Accessibility Services employ disabled users to manually audit websites. Their testing involves users of different abilities using their own methods of access, to test and scrutinise a website. These methods of access include screen readers, keyboard navigation and speech navigation. Some testers are also neurodiverse and require a website to be adequately clear and concise for them to be able to understand the content and the navigation structure.

Testers from Shaw Trust Accessibility Services audited the website, and generated a thorough technical report on the accessibility of the WECA website. From the report, WECA understood that they were not compliant with WCAG 2.1 requirements and needed assistance to remediate the obstacles found on their website.

Many of the testers found issues that were built into the theme that was being used for the website. A theme, when used on a WordPress website is a folder of files that work together to create the design of a site, this includes the structure, navigation and the content elements present on the page. Some errors identified were content fixes that could be done internally at WECA, however the majority would need an expert developer to fix.

Shaw Trust Accessibility Services recommended HeX to WECA as their development partners. HeX has had significant experience in developing accessible websites, as well as carrying out accessibility audits ourselves. This experience put us in a good position to be able to offer WECA the development fixes they required.

Once commissioned by WECA to help them, HeX liaised with the team at Shaw Trust to better understand the errors present on the site. This included communicating with some of the user testers in order to understand why an error affected them and how they would see it being solved. Taking this valuable information directly from the user testers meant that HeX could incorporate fixes into the site that were evidence based.

Implementing accessibility fixes based on accessibility user testing reports

a laptop displaying the WECA homepage, with an orange hexagon in the background

As well as listening and discussing issues present with the user testers, HeX were given the Shaw Trust report, giving them additional detail into the obstacles present on the website. The immediate problem presented to the development team when working on the site was that the site was built using a WordPress theme. This particular WordPress theme restricted some customisation options, meaning that errors with the design and structure of the website were unable to be built into the theme directly.

Using their expert knowledge, HeX developers were able to create a child theme of the website that was able to add on to the design and functions of the site. A child theme is a duplicate of the main (parent) theme, and one that requires the main theme to work. A child theme doesn’t contain all of the template files like the main theme does. In WECA’s case, HeX used a child theme.

Coding into the child theme in php, allows for additional code to be inserted to extend the functionality of the main theme. This included additions such as ARIA labels.

Developers also used additional CSS to change the layout of the site slightly so that the navigation structure would be more accessible. All users that access a website see a combination of the main theme, with the child theme addons applied to it. Thanks to the expertise of the developers involved in the project, we were able to overcome a challenge that a lot of websites may come to experience if they are built in non-custom, or restricted themes.

a screenshot of the WECA dropdown navigation menu from their website.

The whole process of the project was managed in Trello, an organisational app that allows cards to be added and removed from lists, comments can be made, and you can tag in other users to action tasks. Errors and fixes were moved as they were done by the developers, allowing for a transparent, iterative development process. This allowed WECA to understand the fixes that were being done. Alongside the project management in Trello, HeX regularly communicated with WECA in order to demonstrate where fixes were being implemented and showed them how they would benefit a user.

Providing demonstrations into why accessibility fixes are essential

Throughout the project, and at the handover at the end, HeX regularly spoke to WECA in virtual meetings. These meetings allowed for the team at HeX to demonstrate the fixes that were being completed, and the ones that were remaining. This allowed the client to understand the workflows of HeX and be assured that work was being carried out.

During the online meetings, HeX also demonstrated a number of obstacles, and the proposed fixes by using assistive technology such as screen readers and keyboard only navigation. This was approached thoroughly in the handover meeting once all the fixes had been made to the website. These demonstrations allowed the authority to understand why the fixes are beneficial and how they help disabled people. The crucial part of this was showing the WECA that accessibility fixes were not just important from a legal standpoint, but from a moral standpoint.

During the final handover meetings, HeX also supplied recommendations to WECA on how to ensure their website remained accessible as new content gets added. In addition, online resources were shown to them to demonstrate how they could carry out a simple audit on their content.

Audit testing and web development impact and outcomes

HeX was very proud to be able to assist with the accessibility of another public sector website with end-to-end accessibility support. We were also proud to work alongside our partners at Shaw Trust who’s user testing and advice were paramount to getting the WECA website to compliance.

a hand using a mouse sitting in front of a keyboard and monitor

Once fixes were complete, the WECA had a website that conformed to Web Content Accessibility Guidelines (WCAG) 2.1 Level AA standard.

HeX was able to demonstrate the fixes made using assistive technology, allowing West of England to understand changes that had been made and why they were important to disabled users. From our fixes, STAS were able to certify WECA as accessible. WECA are now reassured that they won’t be pursued by central Government for lack of an accessible website. The authorities are able to ensure their website and documentation is available to a larger group of people.

More case studies about accessibility audits and development