top of page

#GamesUR Summit - Website Diagnosis

2022-2023

Website Assistant - Member of the Committee

As a Website Assistant for the conference "Games UR Summit NA 2023", I diagnosed the accessibility and usability of the 2022 website and recommended measures to improve its redesign.

#GamesUR Summit's Website

The summit's website's homepage. The horizontal navigation at the top shows options for: home, the Summit, past summits, and About. The main content shows the date and location of the 2023 summit and a button reading "ticket info here"
GamesUR Summit logo

Summary

The #GamesUR Summit is an annual conference about User Research and User Experience in games. With the goal of improving on the summit's accessibility, in 2023, the organization recruited volunteers specialized in accessibility for every team of the committee.

As a Website Assistant, I was responsible for diagnosing the website's accessibility according to the Web Content Accessibility Guidelines (WCAG) 2.1. Level AA, providing directions to comply with them for the website redesign, and assisting my lead with the creation and maintenance of the website pages.

Roles and responsibilities

As a Website Assistant, I was responsible for:

  • Conducting a website diagnosis regarding accessibility compliance with the WCAG 2.1. Level AA.

  • Reporting on the website's compliance and providing guidance to create a compliant redesign.

  • Assisting my lead with applying changes and website maintenance tasks.

Besides this, I also assisted other teams with:

  • Auditing Summit documents (PDFs), such as the program, to ensure for screen reader compatibility;

  • Redacting a Close Captions guide for the captioning volunteers, with best practices about how to write them as well as well as instructions for how to use the HappyScribe website.

And I took on the iniatiative to:

  • Create a FAQ page;

  • Auditing the website about its usability, for future redesigns;

  • And redacting an Accessibility Statement.

A heading reads "Web Team". Below, we see two pictures and bios. One for the lead, Stephanie Puri, and the other for Patricia Mendes, the Web Assistant.

Web Team

A table with the heading columns: Principle, Guideline, Criteria. After that, each column has, as a heading, the name of a website page: Homepage, Sponsors and Schedule.

Report showing the compliance of three pages with 16 accessibility criteria.

01
Accessibility Diagnosis

Before the redesign, I checked whether the website's pages complied with the WCAG 2.1. Level A and AA criteria, by conducting manual and automatic checks.
 
For automatic checks, I used WAVE. For manual checks, I used:

  • HTML and CSS inspection;

  • Screen reader NVDA;

  • Color contrast checker;​

  • WebDev (Chrome Extension)

Report

I used a Google Sheets document to report on the website's compliance, signalling all non-compliant pages for each criteria.

A table with 4 columns (Subject, What/Who it affects, Goal, and Tasks) shows a number 9 goals related to navigability that affect people with motor impairments and people who are blind, for example, related to the focus order.

An excerpt of the simplified document.

02
Simplified report

As per my lead's instructions, I created a simplified document detailing the expectations needed for a compliant website. Per expectation, I explained:

  • The expected end-goal.

  • The subject it was tied to (e.g. readability, navigability);

  • The main problem or demographic affected by the goal or problem;

  • The tasks to do to ensure compliance with this goal.

The simplified report has 30 tasks related to fixing the problems I identified in the early diagnosis.

The Activision User Research Logo and its code next to it, with the alt test highlighted.

A Sponsor's Logo has adequate alt text.

A table with columns. The first shows the name of several committee members and the second shows a brief alt text describing their pictures.

Proposed alt texts for the committee members's pictures.

We read: 61 headings. h1: missing heading. h2: missing heading. h3. Missing heading. Then: h4: Ashley Guajardo. H5. Co-director. h4: Hannah Murphy. h5: she/her. h5. Co-director.

Inadequate heading structure
in the original Committe Page.

03
Improving Accessibility

Some of the tasks I took on to fix the website's accessibility were:

  • Redacting and coding, in HTML, adequate alt text for all of the website's images, including the pictures for the committe members' bios;

  • Adequately coded and hierarchized heading structures;

  • Color palette recommendations for sufficient color contrast, when that was something we could apply.

Limitations

Due to the type of Wordpress subscription used for the website, changing the style and colors of the page elements in CSS was not possible.

This led to some uncompliant elements, or elements that didn't follow best practices of readability:

  • Insufficient color contrast with links, navigation bar options, and icons or text in the header and footer;

  • Exxagerated spacing over and under all headings;

  • Keyboard focus not visible; 

  • Others.

We read: 13 headings. h1: #gamesUR Summit 2023 Committe. h2: Directors, h2 A/V team, h2 Branding Team, h2 Content review team, etc.

Adequate heading structure
in the redesigned Committee page.

A footer with a copyright notice, the idga logo and a link to the Code of Conduct, and social media icons. The text has low contrast.

The original footer didn't have any links (the "Code of Conduct" link was added after my proposal).

A page footer has three heading that precede lists of relevant links. The headings are: Summit: Join Us, and About.

New footer (redesign proposal).

04
Usability Audit

Accessibility and usability are different fields, in theory, but both are complementary and interconnected and essential for a good user experience.

For improved usability, I identified some possible improvements for the website's navigation structure. I suggested:

  • A more intuitive structure for the navigation menu;

  • A FAQ and Accessibility Statements page, which I drafted and developed in coordination with other teams;

  • Not implemented: an improved footer. While the original only had copyright notice and social media icons, I proposed for a redesign with hyperlinks for relevant pages.

  • Best practices for readability - ensuring each block of text only has 80 characters per line, as opposed to the original 171.

 

These proposals were based on an investigation of other conference and general website's best practices.

The page has a main heading called Frequently Asked Questions, and three h2 headings with the questions. "When and where will the GamesUR Summit 2023 be?" and "Will there be on-site parking?"

An except of the FAQ page.

The page's main heading is "Accessibility Statement". An h2 heading is called "The Summit". They show statements about the committment to make the website compliant with the WCAG 2.1. Level AA and accessibility considerations for the on-site event.

An except of the Accessibility Statement page.

05
FAQ Page and Accessibility Statement

As certain frequently asked questions arised in the conference's Discord group, I took the initiative to create a FAQ page detailing all important aspects of the conference.

  • Date and location of the conference, as well as parking options;

  • How to watch and participate in the conference online;

  • Accessibility accomodations provided on-site and online;

  • Quick links to the Speakers, Schedule and Talks pages, as well as links to past summit presentations;

  • Information about the 2023 committee and how to volunteer to help;

  • General contact information.

The page's main heading is "Accessibility Statement". An h2 heading is called "The Summit". They show statements about the committment to make the website compliant with the WCAG 2.1. Level AA and accessibility considerations for the on-site event. A third h2 heading is called "Our website" and describes how it was made accessible.

An excerpt of the Accessibility Statement page.

07
Accessibility Statement

After the redesign, I drafted and redacted an accessibility statement in coordination with the Committee Leads and the Inclusion Team.

This page details:

  • The Summit's commitment to accessibility;

  • Accessibility Accomodations provided on-site;

  • A comprehensible explanation about the accessibiltiy considerations integrated on the website and digital documents;

  • Website accessibility limitations;

  • Contact information for users who wish to report about problems or suggestions.

Wrap-up

An organization's website can only be fully accessible if there is an effort to achieve this goal from the leaders' part, as well as teamwork between the teams and their members.

Although we couldn't make the website fully accessible, I was able to identify the current problems and needs to address in the future, as well as lead to significant improvements on the accessibility of the conference's website and digital documents.

5 orange circles overlap, looking like petals of a flower, with the center being a circle in teal. Beside it, we read the words #GamesUR Summit North American 2023.

The GamesUR Summit Logo.

bottom of page