Accessibility Features in
Clarity

The
Clarity
product team is committed to ensuring support for the WCAG 2.1 AA standard. From release 15.9.1, Accessibility enhancements will be released incrementally to help organizations increase adoption and help users with accessibility requirements to experience
Clarity
seamlessly. The following table lists the accessibility improvements addressed in this release:
What is it about?
Who is it for?
What’s the change?
Visual design
Users with colorblindness
Color contrast and visible focus
Responsive design
Users with limited vision or partial blindness
Popup windows, text areas, and the browser zoom
Keyboard navigation
Users with mobility impairments
Key input, tab order, focus
Note
: Special keyboard controls or custom shortcut key combinations are not supported in this release.
Screen reader support
Users with partial or complete blindness
Semantics, hierarchy, page structure
This page lists the accessibility features supported in
Clarity
. For information on accessibility features supported in
Classic PPM
, see Accessibility Features in
Classic PPM
.
2
Supported Components
The following components support 4 aspects of accessibility - visual, responsive design, keyboard navigation, and screen reader support:
While the individual components listed below support 4 aspects of accessibility, the overall
Clarity
UI is not yet fully accessible. For example, navigating from the Main Left Navigation Menu to the grid, using a keyboard, is not supported at this time. However, once you are inside the grid and in a particular attribute, you can use keyboard controls to perform the required action.
  • Text Box
  • Text Area
  • Single-Value Lookup
  • Multi-Value Lookup
  • Check Box *
  • Radio Group
  • Date Picker
  • Button
  • File Attachment *
  • Color Picker Component *
  • Main Left Navigation Menu
  • View Options
    • Money and Number decimal display
    • Per-Period Metrics
    • Periods
    • Start Period
    • End Period
    • Totals Columns
  • Saved Views
  • Item Action Bar (multi-select grid)
    • Select All, Deselect All, Edit, Mark for Deletion, Clear Deletion
  • Color Picker - Pick List Color
  • Toast Message
  • Generic Filter
  • Layout Switch (Board, Grid, Timeline)
  • Attachment (Grid)
  • Search
* In limited instances, these components may not meet color contrast, keyboard, or screen reader accessibility. This limitation will be addressed in a future release. For example, the Color Picker meets color contrast requirements but it will be updated in a future release to use the single-value lookup component to support keyboard navigation and screen reader.
Color Consolidation and Mapping
Clarity
is introducing a new color palette to improve the overall visual experience for all users including those with accessibility requirements. In previous releases, different sets of color palettes were used for the following elements:
  • Project banner and Documents tags
  • Custom picklists
  • Classic display
  • Sequential colors
As part of the upgrade, the previously selected colors are mapped to the new colors and are automatically updated. The following screenshots compare colors used in older releases to the new color palette::
Color Mapping for Project Banner and Document Tags
Color Mapping for Custom Picklists
Color Mapping for Classic Display
Color Mapping for Sequential
Colors
Sequential colors represent those that are sequentially applied by the system(for example, per-period metrics in a grid view). The sequence maximizes the visual difference between adjacent colors.
Changes to the Visual Design
The following sections include images that indicate changes to the design and appearance of the supported components to meet the visual design aspect.
Text Box and Text Area Component
Single-Value Lookup Component
Multi-Value Component
Checkbox and Radio Button Components
Date Picker Component
Button Component
File Attachment Component
Color Picker Component
Color Picker - Custom Picklist
Main Menu Navigation
15.9.2 - Changes to the Visual Design
The following sections include images that indicate changes to the design and appearance of the supported components to meet the visual design aspect.
Accessibility – Toast Messages
Linked
Accessibility – Color Picker
Linked
Accessibility – Icons
Linked
Banner – Styling
Linked
Grid Column Panel - Expand and Collapse All
Linked
15.9.3 - Accessibility Improvements
The following lists the accessibility improvements addressed in this release:
Accessibility – Login Page
Linked
Accessibility – Skip Link
A skip (navigation) link provides a way for users of assistive technology to skip what can often be many navigation links. A skip link provides an accessibility structure that allows users to have immediate access to pertinent content.
Linked
In the context of Clarity, the skip link navigates the user directly to the grid and focuses on the “+” button.
Icons – Improved Visual Contrast and Inclusivity
Linked
Accessibility – Toast Messages
Linked
Banner – UX Styling Updates
Linked
16.0 - Accessibility Improvements
The following lists the accessibility improvements addressed in this release:
Accessibility Platform Support
Given the overwhelming evidence, the product team has determined the combinations below are the supported platforms, for the Clarity 16.0 release, from an accessibility perspective.
Acc_PlatformSupport.PNG
Screen reader support is limited to the combination above. However, visual and keyboard navigation requirements are supported for both Mac and PC users as well.
Operating System
  • Operating system data was detected from the system used to complete the survey.
  • Respondents without disabilities were almost 6 times more likely to use Apple than respondents with disabilities, whereas users with disabilities were more likely to respond using iOS devices.
Acc_OperatingSystem.png
Primary browser
  • Chrome usage among respondents nearly tripled in the last 22 months, making it the most popular browser.
  • Firefox usage decreased sharply.
  • Internet Explorer usage continued to decline, but it is still used by 14.5% of respondents, making it more commonly used than Safari (9.8%).
Acc_PrimaryBrowser.png
Primary screen reader
  • Respondents with disabilities are more likely to use JAWS and NVDA and less likely to use VoiceOver as their primary screen reader than respondents without disabilities
  • Respondents employed full or part-time were more likely to use JAWS than other respondents.
  • NVDA users reported higher levels of screen reader proficiency than users of other screen readers.
Acc_PrimaryScreenReader.png
Main (Left) Navigation
  • Updates to ensure the screen reader announces each workspace using their respective naming conventions.
    • The screen reader informs the user if the workspace has been previously “visited”, if it is the current page, button type, and the name of the workspace.
    Acc_MainNav.png
  • Improved vertical scroll & keyboard navigation support should the page be maximized or minimized.
    • A horizontal scroll bar is introduced when needed.
    • A new right-click action, from the main navigation, provides an ability to open the selected workspace in a new tab or new window.
Acc_RightClick.png
 
Accessibility
  • Object, URL, or Attachment “Link” navigation
    • Keyboard option to navigate directly to an Object, URL, or Attachment using the interactive LINK within the selected cell.
    • Alternative keyboard option to edit the Object, URL, or Attachment NAME within the selected cell.
Accessibility.png
Clarity 15.9.3 – keyboard user only had the ability to edit the Object, URL, or Attachment NAME within the selected cell. No ability to navigate was available.
Accessibility - My Timesheet
  • All elements of visual design, responsive design, keyboard navigation, & screen reader support have been considered including:
    • The period carousel
    • Submit, Notes, & Add / Remove Tasks buttons
    • Expand & Collapse All controls
    • Expand & Collapse controls for individual Investment Task grouping
    • Copy & Delete action button
    • Searchable drop-downs (e.g., Input Type Code, Charge Code, User Value 1, User Value 2)
    • Text boxes for hours or days entry
Acc_MyTimesheet.png
  • My Timesheet | Notes Tab is compliant
    • All elements of visual & responsive design, keyboard navigation, and screen reader support have been considered.
Acc_NotesFlyout.png
Accessibility - Financials
  • The Financials module is compliant
    • In addition to this module’s associated (common) grid compliance, this release delivers keyboard navigation and screen reader support for Cost Plans, Budgets, Benefit Plans, & Actuals Transactions menu options.
Acc_FinancialModule.png
Accessibility - Miscellaneous items
  • All elements of visual & responsive design, keyboard navigation, and screen reader support have been considered.
Acc_Misc.png