fix: add accessible names to footer social media links

[huangkevin-apr]

Description

This PR addresses 4 accessibility violations identified by IBM Equal Access Accessibility Checker in the footer social media links. The fix adds proper accessible names through both aria-label attributes and visually-hidden text, while marking decorative SVG icons as aria-hidden, ensuring full WCAG Level A compliance.

The accessibility checker identified that footer social media icon links lacked accessible names:

Impact:

• Screen reader users cannot identify the purpose of these links
• Voice control users cannot navigate to these links using voice commands

Solution

Implemented a layered accessibility approach with multiple techniques to ensure maximum compatibility:

1. Added aria-label to links

<a
  aria-label={social.name}
  // ... other props
>

Provides accessible name directly on the link element.

2. Added visually-hidden text

<span className="sr-only">{social.name}</span>

Provides text content that's:

• Hidden visually using .sr-only utility class
• Still accessible to screen readers
• Acts as fallback if aria-label is not supported

3. Marked icons as decorative

<IconComponent
  aria-hidden="true"
  // ... other props
/>

Prevents screen readers from announcing redundant icon information.

Testing

✅ Verified with IBM Equal Access Accessibility Checker
✅ All 4 "Hyperlink has no link text" violations resolved

Fix Before

Fix After

Additional Info

The patch submitted in this PR was generated by A11YRepair, an automated Web Accessibility repair tool that I developed to address common accessibility violations in web applications. The generated fixes were manually reviewed and validated before submission.

[netlify]

✅ Deploy Preview for peaceful-ramanujan-288045 ready!

Name	Link
🔨 Latest commit	a9197e7
🔍 Latest deploy log	https://app.netlify.com/projects/peaceful-ramanujan-288045/deploys/69751fe5cd3e900008ad2664
😎 Deploy Preview	https://deploy-preview-904--peaceful-ramanujan-288045.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[github-actions]

Welcome to AsyncAPI. Thanks a lot for creating your first pull request. Please check out our contributors guide useful for opening a pull request.
Keep in mind there are also other channels you can use to interact with AsyncAPI community. For more details check out this issue.

[TenzDelek]

lower the A to a for "Add" to fix the ci.
overall love the update. somehow miss this during the modularization.
hope it is not conflicting with #659
PTAL @AceTheCreator

[huangkevin-apr]

lower the A to a for "Add" to fix the ci. overall love the update. somehow miss this during the modularization. hope it is not conflicting with #659 PTAL @AceTheCreator

Thanks.

[AceTheCreator]

lower the A to a for "Add" to fix the ci. overall love the update. somehow miss this during the modularization. hope it is not conflicting with #659 PTAL @AceTheCreator

Yea, we need to merge #659 to avoid conflict 👍🏾

[TenzDelek]

kindly resolve the conflict. cc @huangkevin-apr