L.A. Goal Accessibility

 

L.A. GOAL Accessibility

A laptop showing a persona named Nathan Anderson, who has Down’s Syndrome.

 
 

Opportunity

L.A. GOAL is an organization that provides services to developmentally disabled adults in Los Angeles since 1969. The representative from L.A. GOAL was looking for an accessibility audit of their site and assistance to help the site meet World Content Accessibility Guidelines (WCAG) 2.0 AA compliance. The project saved this non-profit $4,212 and helped them better serve their Members and Caregivers to their Members.

The Timeline

This project took approximately two months to complete and was on top of my full-time position and classwork

My Role

I was the lead accessibility specialist and designer in this project and received some assistance from a junior colleague

 
 

 
 

Background

L.A. GOAL is an organization that provides services to developmentally disabled adults in Los Angeles since 1969. L.A. GOAL’s Independent Living Skills Programs help each Member reach their highest potential in work and life. The programs are open to adults with all types of developmental disabilities, including Autism, Down syndrome, Cerebral Palsy, epilepsy, and other neurological disorders.

L.A. GOAL provides daily services to their Members in the following focus areas: 

  • Paid Employment 

  • Vocational Training 

  • Adult Education 

  • Life Skills Training 

  • Visual Arts/Professional Art Studio 

  • Music Therapy 

  • Music and Drama

  • Health and Wellness 

  • Leadership and Social Opportunities

Goals

  • Conduct user interviews to understand and empathize with the needs of L.A. GOAL’s Members and their Caretakers when accessing the L.A. GOAL site

  • Create personas to help the larger organization of L.A. GOAL to empathize with their Members’ needs, specifically in the context of their online interactions

  • Conduct a cognitive walkthrough of the site to see the most common places that users are affected by inaccessibility and usability issues

  • Perform a complete heuristic analysis focused on the accessibility of the L.A. GOAL website with the baseline goal of meeting WCAG 2.0 AA compliance.

  • Help L.A. GOAL fix issues found in the audit by providing guidance for updating their site structure and design

 
 
Two personas examples showing Marcy and Nathan Anderson; the caregiver persona and member persona. These personas are described in more detail in the following paragraph.
 
 

Understanding the Users

As a part of any user experience work we do, we must make an effort to empathize with our users and understand their goals before we begin work. Understanding users is essential in the context of serving disabled people as our social understanding of disabilities tends to be inherently biased. Speaking to individuals helps us create inclusive designs by stripping away our assumptions, leading us to more valuable hypotheses. To understand L.A. GOAL's users, I went through the process of interviewing Members of L.A. GOAL, stakeholders in the organization, and an occupational therapist specializing in care and support for cognitively disabled people, particularly for severely autistic people. 

Members

Members of L.A. GOAL have neurological, developmental, and cognitive disabilities and regularly work with and as a part of the organization. Members of L.A. GOAL often have been a part of the organization for years, but usually will work within the non-profit in unique ways, changing their focus depending on their interests at the time. Some Members enjoy creating art pieces, while others may prefer to learn budgeting skills and seek out specific careers. Most often, Members use the L.A. GOAL site to see what is new with the organization or to see themselves and their friends in photos.

Caregivers

Members of L.A. GOAL often have the support of one or more Caregivers. Caregivers may be a Member's parents or have other familial ties to the Member, but also may not be related at all. Caregivers will also use the L.A. Goal website to see news and events of the organization. In particular, Caregivers keep an eye on occasions where the Member they are caring for may be involved. They are also interested in assisting fundraising events. Caregivers tend to use the website more and tend to influence whether a Member becomes or stays a Member of L.A. GOAL. 

Non-Profit Organization

Individuals working for and with L.A. GOAL also use the website for different reasons, most often uploading and updating content. In talking with the L.A. GOAL team, I understood what their goals for the website were and, most importantly, how the site is managed. The website uses a content management system, which meant that the site would be more accessible for their team to operate in terms of content and structure. Using a content management system also meant that some accessibility issues I would find would be inherently baked into the system, and difficult for L.A. GOAL to fix independently.

Occupational Therapist

Finally, to fully grasp L.A. GOAL's members' needs, I spoke to an occupational therapist specializing in the care of cognitively disabled individuals, particularly with severe autism. This occupational therapist's expertise is in behavior management, sensory processing, self-care training, assistive technology, and home programming. By speaking to them, I learned common design trends that could make a web experience accessible and valuable to individuals with cognitive disabilities. In particular, I learned the importance of:

  • Consistent structure, rewarding users with clear patterns

  • Predictable interactions, relevant to users' need for routine

  • Pairing content with visuals to better explain the content's purpose and provide visual interest

  • A well balanced visual design leaning on white space to prevent users from getting distracted or disinterested

  • Built-in reinforcement, particularly in guiding users through their experience and ensuring they move in the desired direction

  • Clarity on timing, if a task requires dedicated focus and time

  • The use of simple and direct language

The most important part of this conversation was that everything outlined to me was already in line with the World Content Accessibility Guidelines (WCAG). These are also common themes of improved usability for most users. This meant that I already had the guidance needed to make this site accessible for its key users, but I could validate which specific parts of WCAG would be most relevant.

I was also able to use this research to better structure my user interviews with L.A. GOAL’s Members. All of the interviews and research I had done came together to create two well informed personas. These personas capture two people’s interest in L.A. GOAL, in this case, a Caregiver named Marcy Anderson and Member named Nathan Anderson.

View the complete personas

 
 
A table showing steps in a persona’s process interacting with L.A. Goal and potential accessibility issues from that persona’s perspective.
 

Cognitive Walkthrough

cognitive walkthrough is a step-by-step exploration of a service to see how well a particular type of user, usually represented by a persona, can accomplish a specific objective or set of goals. The chosen persona dictates the objectives selected for testing.

Cognitive walkthroughs can help in the context where it may be challenging to test a website with your users directly or better inform hypotheses before testing. They are also valuable as a benchmark for wireframes and sitemap improvements to ensure goals have been met. In this case, the cognitive walkthrough supplemented our interviews with Members, Caregivers, and the occupational therapist.

To do a cognitive walkthrough, we choose a user and a task that they are likely to perform, then go through completing the task as though experiencing it from that user's perspective. We use this process to outline issues we hypothesize the user would experience upon walking through these steps on their own. The activities we chose for this process were based on what our stakeholders' explained were the most common reasons that their users interact with the site. In this process, we had three different activities for our persona users, Marcy and Nathan Anderson:

  1. Marcy wants to make a donation

  2. Marcy wants to learn about programs for Nathan

  3. Nathan wants to see pictures from a recent event

From this exercise, we were able to identify the most pivotal points preventing L.A. GOAL's primary users from completing their goals. Common trends we identified were issues in:

  • Navigating the site using the nested sidebar navigation

  • Lack of clarity around current page location and how the user got there

  • Color contrast issues, most prevalent in button/link UI and nested navigation states

  • Donation pages having newly introduced navigation

  • Challenging to navigate image carousels 

  • Inability to zoom the site to up to 200% for vision impaired users

  • Links taking users away from the site without warning 

 
 
A spreadsheet outlining each accessibility consideration, the impact of not meeting it, and WCAG related to recommended fixes.
 
 

Heuristic Evaluation

A heuristic evaluation involves examining the interface and judging its compliance with recognized usability principles (the "heuristics"). In this evaluation, I paid particular attention to the site's ability to meet WCAG 2.0 AA standards, as this was a large part of L.A. GOAL's needs. I also reviewed L.A. GOAL’s code for programmatic accessibility issues, ones that would occur most commonly for screen reader and keyboard-only users. I tend to use the phase "heuristic evaluation" interchangeably with "accessibility audit," as improved accessibility leads to improved usability, and these two are commonly linked.

When it comes to generating an accessibility evaluation of web content, I use Deque's Axe Pro Chrome plugin to run automated testing and perform guided manual testing. I then review all of the automated test findings to ensure their validity (as sometimes automated tools catch errors inaccurately) and evaluate the user impact of fixing specific issues. The issues that have high levels of usability concerns, do not meet A-AA WCAG criteria, and occur most often tend to be given higher impact ratings. L.A. GOAL can then use these impact ratings and compare them with the effort required to assess when and how they will make adjustments. 

This heuristic evaluation and others I complete also include the specific details of the issues I encounter, which WCAG criteria it relates to, and recommendations to make fixes. In this case, I was mindful of the content management system the L.A. GOAL team was using to generate their site content as a CMS can limit the feasibility of making fixes.

View the full heuristic evaluation

 
 
The recommended updates to the sitemap, showing a hierarchical structure with primary navigation items and sub-items
 
 

Sitemap & Designs

To help L.A. GOAL make the changes needed to have a more accessible site, I also included recommended changes to the sitemap and designs. Since one of the biggest concerns was navigability, I determined that sitemap updates supplemented with straightforward UI would be essential. It would help their disabled users and their abled users more easily navigate the site.

One of the first recommendations I made was to avoid having nesting sidebar navigation. The sidebar navigation's nested behavior required a higher cognitive load, specifically when the nested items were difficult to read or had unclear titles. If users do not inherently understand the purpose of a link, they are less motivated to navigate to that link. The nested navigation included far more internal terminology, making those links' purposes unclear to users. In combination with UI lacking structural elements, I hypothesized that users would struggle to reach their destination with that navigation.

 
The recommended updates to the design with increased contrast between the content and navigation, as well as easier readability of content.
 
 

I recommended that L.A. GOAL have a set of primary pages within their navigation, but linked to subpages after users had navigated to the primary page. To help users understand these subpages and their purposes, I recommended using cards describing those pages with a link to the subpage. For example, when a user navigates to "Programs," they can learn what "Inside Out Productions" is by seeing a card's brief description. This should help cognitively disabled users better navigate the site and assist any users who do not know the meaning of specific phrases. This also would remove the need for a nested navigation, making the interface far more clear.

My primary concern about removing nested navigation was that users could struggle to remember where they had come from in the site's structure. It was possible that the nested navigation helped with clarifying the user’s path. To provide a clear indication of site structure, I recommended supplementing pages with breadcrumbs. This would prevent issues in navigability while also supplementing the overall system to the user. 

I also recommended removing the navigation items "ways to give" and "monthly giving," replacing them just with "donate." Donation is a more explicit call to action for users and is more commonly used by non-profits. The intent of "Donate" is more apparent than "Ways to Give," which I theorized would help drive traffic to that page. All of the ways users can donate would still be available as cards within the "Donate" page using the same card component I mentioned earlier.

Originally, L.A. GOAL had a combined page for "Blog, News, and Events," but including this many items under one link could be problematic. Users looking for an event would have to look through other posts to find that event and vice versa. Users who may be easily distracted would likely struggle to find their intended content. Additionally, blog and news posts occur in the past, while events happen in the future, meaning that users interpret these types of content differently. Past events can be easily archived, whereas small organization blog posts don't usually need archives. I recommended that the "news" and "blog" navigation items be combined into a single blog, and to create a separate "events" page. I theorized that this would lower the cognitive load of navigating by allowing users to select either blog posts OR events rather than both. Changing this also opened up the ability to change how L.A. GOAL managed their events by including registration capabilities. 

In addition to the structural changes, I recommended changes in the UI to improve accessibility for visual structure, color contrast, readability, and more. With all of the recommended changes, I also included a basic style guide so that L.A. GOAL could efficiently work within their content management system or with minor code changes to make updates. 

See the designs, styles, and explanations as comments in InVision

 
 
Color styles, and typographical styles provided to L.A. Goal
 
 

Limitations

True accessibility can't be met by an individual contributor within two months, though many significant steps can be taken. In an ideal situation, I would have taken more time to sit down with more Members and Caregivers to test my theories out. A limited number of user interviews are still valuable, but more extensive data sets are always more accurate.

It's also essential to remember that user testing with cognitively disabled people is not something that has been thoroughly vetted and explored by most user experience researchers. This factor combined with COVID affected my ability to perform testing in-person, limiting the information I could gather. However, having discussed best practices with the occupational therapist before user interviews, I optimized my time with participants by offering an exact schedule, reduced distractions, and positive feedback. I would be excited to further research gathering feedback from users cognitively disabled users.

As previously mentioned, the L.A. GOAL team used a content management system, plug-ins, and embedded content from third parties on their site. When we review the accessibility of a site or product, we also have to review the accessibility of the tools used within that context. Most tools have imperfections that are difficult to work around, so I considered this when offering solutions. I choose to provide solutions that would have the highest impact on L.A. GOAL's users, based on interviews' feedback, while also working within reasonable expectations. These are common occurrences for any product designer, which is why accessibility and experience design pair well together. Both require a technical prowess, understanding of human psychology, empathizing, learning from others, etc. 

 
 
“Anna was communicative, thorough, flexible, and extremely knowledgeable about website accessibility.”
— Rachel Hamburg, Director of Development at L.A. GOAL
 
 

Outcomes

When the finalized materials were handed off to my primary point of contact at L.A. GOAL, I received positive feedback on the thoroughness of the work combined with the effective ways in which it was communicated. Since there was a limited timeline for this project, I was not involved in implementing these recommendations. Given that most of the recommendations were sourced from the World Content Accessibility Guidelines, I believe that the site will be far more accessible upon implementation. I hope that the personas, cognitive walkthrough, heuristic analysis, sitemap, and design recommendations all scale upwards as L.A. GOAL further their mission.


Want to know more about my accessibility work? Read my Transamerica Accessibility case study where I outline my organizational efforts to make meet accessibility compliance across all digital products.

 
 

Want to work together?