The Bakery a non-profit | Accessibility Audit

Objective:

To audit the current website for accessibility issues and to recommend an update with more modern patterns.

Shown below is my Figma file for the audits from the screenshots taken at the time. (some updates have been made since).

 

A series of screenshots with added notations to show why it is not accessible with added accessibility considerations.

Strategy

To recommend a way to change the current site to be more accessible and recommend some modern updates.

 

Some things we considered in the updates:

  • Update the site from 7.0 to 7.1 version (which ended up being a lot trickier than anticipated)

  • Reformatting current imagery

  • Take a look at current copy for potential updates

  • How can we make the site easier for the team to manage?

  • Is there a more accessible way to implement an interactive map which will eventually span nationally and possibly worldly one day?

  • Can we possibly add in more of “Andy’s” assets (a set of assets The Bakery implements on all their social media and graphic media)?

  • Take a look at the Footer to be more accessible

  • Is there a better top navigation which could help the user to understand who they are and what they offer?

  • Other items like pagination and image reduction to help with page load timing out issues

  • Recommendation of an updated landing page

 

Landing Page Proposal

A view of the landing page in consideration for review. I always add in my research to back up my design choices so they are able to make more informed decisions.

 
An example landing page: tells the user that they specialize in helping local artists and also take donations in support.

Adding in “Andy’s” Assets

It was a lot of fun playing with the implementation of “Andy’s” assets while still keeping the screens accessible!

Below is a before and after with the addition of “Andy’s” assets.

 
Before screenshots and after designs. New page includes silly characters in background with card layout and navigation to current artist open calls.

The Proposal Decisions

The approved proposal:

  • I did not update any of the copy, but we did shorten it to be less then 70 characters per line item

  • I added in “Andy’s” assets on every screen (though not visually added in the Figma comps)

  • I cleaned up the footer and top navigation to be more accessible

  • By updating the version of the site, we were able to make it easier for the team to update as needed.

  • I added in a card style layout

  • I was unable to secure a good fit for a better interact-able map nor pagination

 

A series of reviewed Figma comps on the designs mutually approved. Designs include card style layout, updated navigation and footer, and playful “Andy’s” assets added in the background.

A look behind the scenes: The Design System

Reach out for all your accessibility concerns!