Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Above areas would include compliance changes such as colour changes to text colours, input fields border colours, background colours.

1.1       Introduction of the Colour Toggle

In order to enable the colour compliance, you would require following below steps.

 Step1 - Navigate to Settings (figure3figure 3)

Step2 - Click on Settings

...

...

Step 3 - Enable the WCAG Compliance Toggle (figure 4)

Step 4 - Click on Save

...

Step 5 - Navigate to any area as mentioned above and colour changes would be visible. (i.e. Project register view while the toggle is enabled figure 5 & Calendar settings figure 6).

...

Project workflow panel would include text-based statuses for phase and objects. (figure 7)

...

1.2       Accessibility Compliance

As Phase 2 is completed and currently in testing, Camms is planning on achieving 100% compliance from an Accessibility perspective in all of the newly developed areas of the platform that are not currently compliant.

The below areas of the application will be AA compliant for operability and navigability.

  • Project Board and Team object

  • Project Register

  • Add Projects Project Register

  • About Us, User Guide

  • Favorites

  • Login, Sign Out

  • Menu

  • My Quick Update (My Project Tasks will only be compliant)

1.2.1       Keyboard accessibility

Now users can navigate the above areas with the Keyboard through the ‘Tab’ & ‘Arrow’ keys & the application view can be zoomed to 200%.

 

How do I navigate using the keyboard?

Step 1- Click the ‘Tab’ key on the respective page, then a user would be able to view a pop-up which would indicate to skip to main content. (figure 8)

Clicking ‘Tab’ key for the second time would continue the users focus on the Header and Left Navigation panel.

Clicking the ‘Enter’ key on Skip to main content would allow a user to navigate within the page.

...

Step 2- To navigate within the page buttons and icons continue using the tab key.

Step 3- To navigate within the grid would be by using the ‘Arrow’ keys.

Step 4- If you require to activate a content and open the content, such as navigating into a project the content on the cell would be focused by pressing the ‘Tab’ key.

 

Step 5- Press the Enter key to open the content.

Arrow keys would allow scrolling within a grid from cell to cell (i.e. Project register shown below, figure 9)

Change on focus on cells/buttons will be indicated as below. (i.e. Highlighted cell Capital works, figure 10)

...

How do I access more content on a Grid?

Step 1- As mentioned above navigate to the cell and the ‘+5 more ‘content using the ‘Arrow’ keys once the necessary cell is selected press the ‘Tab’ key and press the ‘Enter’ key to view the content of the cell. (figure 11)

...

Step 2- Once you’ve opened the see more view, click on the ‘Enter’ key to close. (figure 12)

...

1.2.2       Accessibility via Screen Readers

Once a screen reader is installed and opened accessed it would read the current page opened within the application.

  • All toad messages would be automatically announced through the screen reader.

  • All input fields (text, numeric, dates, dropdowns, checkboxes, radio inputs etc.) are now linked to the respective labels.

  • Screen reader will be enabled to reading invisible labels on placeholder texts

  • Labels which include an asterisk (*) which previously only visually indicate that a field is mandatory will be read by the screen reader as a mandatory field.