Advising Gateway Accessibility and Usability Information

Lack of landmark regions

Despite the visual appearance of a “banner” landmark, the red bar at the top of the application is not marked up as a banner region. Landmark regions help structure webpage content and make it easier to navigate via screen reader.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Content structure is effectively communicated via screen reader. (WCAG 1.3.1)

Banner elements are all announced as H2

All elements in the banner are announced as if they are wrapped in an H2 tag. Every single element (UW crest logo, help button, etc.) is announced as a heading level 2, which makes navigating through these elements tedious and confusing.

The text “Advising Gateway” seems to be marked up as H1, but it is announced as both heading levels 1 and 2. This bad markup might also be the cause of additional issues in how the banner is announced by screen reader, such as the text “Advising Gateway” not being announced at all on some pages.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Content structure is effectively communicated via screen reader. (WCAG 1.3.1)

No “Skip to Main Content” link

There is no Skip to Main Content link.

This barrier primarily relates to the following accessibility guidelines:

• Operable: Users can skip to the main content on a webpage. (WCAG 2.4.1)

Tooltips are not accessible by keyboard or screen reader

Throughout the application, any information contained in tooltips (i icons) can only be accessed by hovering over the icon with a mouse. The information cannot be accessed by keyboard or screen reader (each i icon is announced as “info,” but lacks interactivity).

This barrier primarily relates to the following accessibility guidelines:

• Operable: Elements are selectable and interactive by keyboard. (WCAG 2.1.1)
• Perceivable: Content structure is effectively communicated via screen reader. (WCAG 1.3.1)

Some content is cut off or rapidly blinks at high magnification

At 250% magnification or higher, any Note information (for a specific note) gets cut off at the bottom.

Between 175% and 200% magnification (or when resizing a window to variable widths), there is a glitch that causes the page content to rapidly move/blink, which could potentially trigger seizures or neurological discomfort for some users.

At various screen widths and levels of magnification, there are instances where the user must horizontally scroll in order to access all page content. This can significantly increase the physical and cognitive effort needed to use a tool.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Content reflows as it is magnified without loss of information or functionality, and without requiring scrolling in two dimensions. (WCAG 1.4.10)
• Operable: Avoid content that flashes, or keep it under thresholds. (WCAG 2.3.1)

Orange on white is low contrast and relies on color to indicate error

If a user misses a required field when adding information about a note, the form control with the error turns orange. However, this orange color has low contrast with the white background (2.5:1 ratio).

This also relies on a color change to indicate the presence of an error.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: All visual elements have sufficient color contrast. (WCAG 1.4.3)
• Perceivable: Color is not used as the only visual means of conveying information. (WCAG 1.4.1)
• Understandable: Errors are identified and described to the user in text. (WCAG 3.3.1)

Blue button focus state is low contrast and relies on color to indicate state change

For any UW blue buttons, the focus state is indicated by a slightly darker shade of blue but lacks an outline or change in button size. This color change has low contrast (between default state color and focus state color). It also relies on color alone to indicate the state change.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Color is not used as the only visual means of conveying information. (WCAG 1.4.1)
• Perceivable: All visual elements have sufficient color contrast. (WCAG 1.4.11)

“Print all notes” button opens PDF in new tab without prior warning

Upon selecting the “Print all notes” button, a PDF opens in a new tab without providing a prior warning to the user. Without a clearer label or instructions, users are likely to expect a Print dialog to open upon selecting this button.

This barrier primarily relates to the following accessibility guidelines:

• Understandable: Entering data or selecting an interactive element has predictable effects. (WCAG 3.2.2)

“Remove selected reason” button is not consistently announced by label

When creating a note and selecting from the Contact Reasons list, the “Remove selected reason” (X icon) button is only announced properly by a screen reader in browse/reading mode. When navigating in forms mode (tabbing through interactive elements), the button is announced only as “graphic” without a label.

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Information about elements, like labels or required fields, are communicated via screen reader. (WCAG 1.3.1)

Tabs are not consistently announced by a single label

When using forms mode to navigate in a tab grouping, each tab is announced properly by a screen reader. However, when navigating in browse/reading mode, each tab is announced twice, first by its text label and then by its count (e.g., “tab, Degrees Awarded” and then “tab, 1”).

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Information about elements, like labels or required fields, are communicated via screen reader. (WCAG 1.3.1)

Illogical reading order in tab groupings

When navigating in a tab grouping, such as Academic Plans/Degrees Awarded, the content labels in the left column (e.g., “Program,” “Plan,” “Subplan”) are all announced sequentially before the corresponding content in the right column (e.g., “G744,” “Creative Writing MFA,” “Poetry”).

This barrier primarily relates to the following accessibility guidelines:

• Perceivable: Screen readers access content in a meaningful order. (WCAG 1.3.2)