Skip to content

Conversation

@huangkevin-apr
Copy link

Problem

The IBM Equal Access Accessibility Checker detected two accessibility violations in the partner logos section of homepage:

  • Missing accessible name for links: Hyperlinks must have an accessible name for their purpose
  • SVG elements missing accessible name: Non-decorative SVG elements must have an accessible name
image

Solution

This patch addresses both violations by:

  • Adding aria-label to link elements: Each partner logo link now includes an aria-label={name} attribute, providing a clear accessible name that describes the link's purpose (e.g., "DMA", "ITP", "Netlify", "GitHub Sponsors")
  • Marking SVG logos as decorative: When the Logo component is rendered as an SVG, it now includes aria-hidden="true" to indicate it's decorative, since the accessible name is already provided by the parent link's aria-label

Generated Patch:

@@ -282,14 +282,15 @@ const IndexPage = ({ data }) => {
                       className={css.logo}
                       href={url}
                       target="_blank"
-                      rel="noreferrer">
+                      rel="noreferrer"
+                      aria-label={name}>
                       {typeof Logo === 'string' ? (
                         <GatsbyImage
                           image={data[Logo].childImageSharp.gatsbyImageData}
                           alt={name}
                         />
                       ) : (
-                        <Logo />
+                        <Logo aria-hidden="true" />
                       )}
                     </a>

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.

Fix Before:
image

Fix After:
image

Testing

✅ IBM Equal Access Accessibility Checker now shows 0 violations (previously 2)
✅ Screen readers can now properly announce partner links
✅ Visual appearance remains unchanged

Impact

This fix improves accessibility for users relying on assistive technologies, ensuring all partner links are properly labeled and announced by screen readers.

@netlify
Copy link

netlify bot commented Jan 11, 2026

Deploy Preview for java-processing-faf822 ready!

Name Link
🔨 Latest commit a02e77b
🔍 Latest deploy log https://app.netlify.com/projects/java-processing-faf822/deploys/6963bb9d3c67a90008dd26d2
😎 Deploy Preview https://deploy-preview-668--java-processing-faf822.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant