I believe accessibility should be considered at every stage of the design process. Creating accessible experiences benefits people with disabilities while also making digital products easier to use for everyone.

At Foodstuffs, I took an active role in championing accessibility beyond my day-to-day design work. I looked for opportunities to share knowledge, improve existing components, and influence how brand guidelines were applied to digital products.

My work focused on three areas: helping content editors create accessible content, improving the accessibility of shared design system components, and ensuring brand identities could be applied to digital experiences without compromising readability.

Empowering content editors

A website's accessibility depends not only on its design and code, but also on the content published to it. I recognised that content editors played an important role in creating accessible experiences, but needed the knowledge and guidance to do so confidently.

To help, I created a presentation introducing web accessibility, explaining why it matters, and covering practical considerations relevant to content editors. I focused on how everyday content decisions can affect accessibility and what editors could do to make the content they published more inclusive.

I also followed up with a practical guide addressing specific areas where editors were struggling, giving them a resource they could refer back to when creating and updating website content.

This helped bring accessibility into the content creation process, rather than leaving it solely to designers and developers.

See Full Presentation

Improving accessibility in the design system

I also looked for opportunities to address accessibility issues directly within the components designers used.

The existing hero banner component had a usability issue at tablet sizes: text could overlap with the background image, making the content difficult to read and the layout less reliable.

Previously, the component used a single background image with text positioned on top. I redesigned it to use a fixed-ratio image on one side and a separate text container on the other.

By separating the image and text into distinct areas, the layout became more predictable and prevented the content from overlapping the image at tablet sizes. It also created a clearer separation between visual content and text.

I also introduced preset colour combinations that paired backgrounds with suitable text and button colours, ensuring each option met accessibility contrast requirements. This gave editors more flexibility while making accessible choices the default.

Balancing brand identity with accessibility

When applying the Four Square brand refresh to digital products, I noticed that the new brand direction relied heavily on all-caps typography. While this was an important part of the visual identity, using all caps extensively across web content can make text harder for some people to read.

Rather than simply replicating the brand guidelines, I raised the accessibility concern with the brand lead and proposed an approach that preserved the brand's distinctive style while supporting readability.

I recommended reserving all-caps typography for hero copy, supported by a dedicated text style, while keeping the standard heading hierarchy — H1, H2, and so on — in sentence case.

This allowed the brand to retain its visual impact in prominent moments without extending all-caps styling throughout the website. I also incorporated this approach into the design system, helping establish a consistent way to apply the refreshed brand across digital experiences.

See Full Presentation

The impact

Through these initiatives, I helped make accessibility a more practical and visible part of the digital design process at Foodstuffs:

• More informed content editors: Provided educational materials and practical guidance to help editors create accessible website content.

• More robust components: Redesigned the hero banner to prevent text and imagery from conflicting at tablet sizes.

• More accessible brand implementation: Influenced how the Four Square rebrand was translated into digital products, balancing brand expression with readability.

For me, championing accessibility meant more than identifying individual issues. It meant helping people make better decisions, improving the tools they work with, and ensuring accessibility was considered when design systems and brand identities were brought to life digitally.