bcgov / entity

ServiceBC Registry Team working on Legal Entities
Apache License 2.0
23 stars 59 forks source link

UI Design - Capture high level Assets accessibility items #21050

Open atronse opened 6 months ago

atronse commented 6 months ago

I've surfaced items that have a high impact (because they appear across many pages), items that are easy to implement and improve page structure (ie. swapping one heading level for another), and items that affect keyboard accessibility (ie. keyboard traps). I've added a 'Priority' column and added the number '1' on each item to identify it as higher priority.

https://docs.google.com/spreadsheets/d/1OC89KbzUyIK7rUcQzzrE7X6ouZx_4F1s7FTtygayFUg/edit#gid=609762042

Here is a list of items:

1- Keyboard accessibility of the Search Category document (line 7 from spreadsheet) Here's the styling rules:

image.png

and here's is a link to the a video recording of the issue to show how it can be reproduced: https://www.loom.com/share/a7d6e3c376b643d2bc3bc4ad816e45ba?sid=91396ae2-016a-4a9d-a1b8-73d543807eab

2- Missing headings (line 13, 51 and 71 from the spreadsheet) In the Tombstone area, the heading here should be an H1 image.png and the Section headers on the page should be marked up as h2

image.png

Skips h2, gos from h1-Amendment to h3- Original Registering Party image.png

3-Request Access MHR Qualified supplier link not focusable/skipped in focus order (line 17)image.png

4- New registration keyboard trap on Stepper (line 28) Cannot navigate beyond stepper with keyboard, resets to first page in stepper flow. Tab should focus the step item, but not select it. Enter should activate the step that is focused. Currently, the tab key both focuses and activates the item, so there is no way to tab to the fields within a step https://dev.assets.bcregistry.gov.bc.ca/new-registration/length-trust

5- Second child dropdown list not operable with keyboard when first dropdown list has been activated initially (line 58)- focus on list seems to be lost once the parent item is toggled https://www.loom.com/share/058f0d55c32f446e84eb1d6d11848a7a?sid=52550a92-e5eb-4a38-a033-3376e1a06829

6- Auto-scrolling table (Line 68) https://dev.assets.bcregistry.gov.bc.ca/dashboard (user BRTEST1)

7- Missing, duplicate and orphaned labels (line 72) Difficult to identify all instances of form inputs as URL does not update on context change... but all fields should all have 1:1 relationship between input and label, and be correctly associated in the markup

8- Cannot make a selection using keyboard for Registering or Secured Party (same component). Also, 'Add a Secured Party that doesn't have a code' is not appearing in tab order, possibly because it is marked up as an anchor and is missing an href attribute https://www.loom.com/share/139c208e52544337bb43de5185cc5d58?sid=b85a9d9d-3703-4784-bc0c-065d3aabeda0

9-Cannot tab into Submenu items from split button in table (line 99) https://test.assets.bcregistry.gov.bc.ca/mhr-registration/home-owners https://www.loom.com/share/46dab4470a524165b019dffaa809d10c?sid=b44d213d-fd37-4e19-976b-7da342a61569

10-Announced as a text field instead of a dropdown list (similar to line 31, line 60) https://dev.assets.bcregistry.gov.bc.ca/new-registration/add-collateral https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-select-only/

Some items are global, so we may want to look at them more broadly: -Missing 'Skip to content links' -Tooltip keyboard accessibility -Unique page titles

LizGovier commented 6 months ago

@saragunnarsson Let's set up a meeting for tomorrow to review the work that's needed here.