Accessibility evaluation

[NMichas]

[anagnoleon]

1. Login: Inputs are missing labels. Please add aria-labels that describe the elements.

2. The sidebar navigation expand/reduce trigger (Hamburger) does not have a description. Please add a title that describes it.
   One step further would be to add a tooltip. This applies to all icon buttons.

3. When a user navigates to a new page, the keyboard focus must be set on the title of the page.
   At the moment the focus stays in the main menu

4. When the main navigation is reduced (only icons are being displayed) all menu items are missing a description and all links are empty

5. The search field is missing a description. Please add an aria-label that describes the element.

6. All views need a first level heading (h1). If you need to keep the same design, add a class to the element and adjust it with css

7. When a modal dialog closes, the focus must be set/returned to the trigger of the modal dialog

8. All tables must have headers and a HIDDEN caption that describes:

• What the table is displaying/purpose
• How many results in total
• How many pages (incase of pagination)
• The current page and how many results per page

9. When there exist a loading animation, please add a hidden message so that a blind user can hear it.

10. Add hidden titles to the following places:

• Main navigation
• Search
• Breadcrumbs
• Main Content
• The Save/Cancel/etc line below the main content. Additionally, place these buttons inside an unordered list (ul)
• Footer (If existing)

11. If you have groups of Checkboxes/Radio buttons, place them inside a fieldset element and add a legend element.

For future reference
All pages need to be divided in regions/segments for better navigation for the blind.
These segments need to have an h1 hidden title. This way, when a blind user is using a text to speech software, they will be able to jump to that title very fast by clicking the "h" key, without having to navigate through, sometimes, tons of content with the tab or the arrow keys.