App Header, App Footer, Side Menu: Use proper HTML Landmarks

[ArakTaiRoth]

Info

This was raised in the UAIM Accessibility Reported as a Level 3 Issue. The issue is as reported, "Regions (footer, etc.) not labelled correctly; could easily get lost and not really have a mental map of the site". The recommendation is to use proper descriptive landmarks to help users understand the structure and navigate more effectively.

Acceptance Criteria:

1. Update effected components to use proper landmarks within the component
   • App Header --> Wrap in a <header> landmark
   • App Footer --> Wrap in a <footer> landmark
   • Side Menu --> Wrap the component in a <nav> landmark

[Spark450]

Do we need to consider unique nav labels for situations where we have multiple nav elements on the page at one time.