Feat/accessibility-structure: added new pages and card previews for accessibility hub

[amandadupell]

What does this PR do?

Restructures the Accessibility page to be a hub with spokes. Added new card previews with simple icon UI for new pages.

Where should the reviewer start?

Accessibility page then all newly created MDX files.

What testing has been done on this PR?

Manual testing.

In addition to the feature you are implementing, have you checked the following:

General UX Checks

• Small, medium, and large screen sizes
• Cross-browsers (FireFox, Chrome, and Safari)
• Light & dark modes
• All hyperlinks route properly

Accessibility Checks

• Keyboard interactions
• Screen reader experience
• Run WAVE accessibility plugin (Chrome)

Code Quality Checks

• Console is free of warnings and errors
• Passes E2E commit checks
• Visual snapshots are reasonable

How should this be manually tested?

Running locally or deployment link

Any background context you want to provide?

What are the relevant issues?

#1816 #2118

Screenshots (if appropriate)

Should this PR be mentioned in Design System updates?

Yes

Is this change backwards compatible or is it a breaking change?

Backwards compatible

[taysea]

@amandadupell looks like we're getting failing checks here -- likely need to update yarn.lock

[taysea]

I am having a variety of thoughts stirring around how we might make adjustments to this content in a way that tells more of a story. Right now, it's starting to feel a bit overwhelming with the number of cards and links and paths I could go.

Still need to simmer a little more on what I might recommend, but just want to comment to start the discussion. Wondering how we might make some this feel more like a sequence of things to explore.

[halocline]

I agree with @taysea 's instinct here. Perhaps we should take a moment to pause here and see whether or not we are in alignment with our compass heading here?

It feels like we have assembled a great collection of resources, however we aren't exactly clear as to what our objective and storyline is. I have jotted down some starting thoughts and will elaborate on these, but noting them as a draft for now.

DRAFT

Proposed Storyline:

• Why - What is this and why should I care?
  • Believe that the web is a resource for everyone and that HPE is committed to making it usable by all.
  • Limited abilities affect us all. Some permanent, some temporary. Wear glasses to read? To see from a distance? Experienced an injury such as a sprain, broken bone, or repeated use injury like carpal tunnel or tendonitis? Or even recovering from an elective surgery? At any given time ~25% of the population is experiencing limited abilities of some sort.
• What - Accessibility is the practice of ensuring visual, auditory, mobility, and cognitive abilities are considered for all HPE web experiences.
  • Assistive technologies
  • Content hierarchy (focus order, sections/groupings, ...)
    • Spacing, layout, touch targets
  • Content (copy, images, lists, tables, charts, figures, forms, layers)
    • alt text, announcements
• Key User Tasks (perhaps we should organize around what a user is trying to accomplish and align content to each user story?)
  • Navigating and Understanding a site's structure (how do I get around?)
  • Navigating and Understanding a page's content (how do I gain a summary / feel for the contents of the page without having to read every single thing --> equivalent to being able to skim a page judging for relevancy)
  • Consuming a page's content
• Implementation
  • semantic markup
• Testing & Auditing