Enhance Accessibility (a11y) and SEO via alt Attributes

Description

According to AGENTS.md, all components must meet WCAG 2.1 accessibility standards. However, an audit of the src/sections and src/components directories shows rampant use of alt="" or completely missing alt attributes on critical <img> tags. Noteably, these aren't just decorative images; many are instructional (Kanvas-collaborate-banner.js, Features/index.js, AcademyFeaturesMobileSwiper.js) conveying important architectural context. Absence of descriptive alternative text negatively impacts screen-reader users, violating core CNCF accessibility principles.

Expected Behavior

A codebase sweep should be performed to systematically categorize images. Purely decorative images should retain alt="" with a supplemental aria-hidden="true", while meaningful images must be updated with descriptive strings (e.g., alt="Meshery collaboration architecture diagram"). This will fulfill the strict WCAG 2.1 compliance mandate in Layer5 guidelines, boost overall SEO indexing for cloud-native keyword ranking on major search engines, and significantly improve UX for visually impaired developers navigating community material.

Screenshots

Environment:

• Host OS:
• Browser:

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

• 📚 See contributing instructions.
• 🎨 Wireframes and designs for Layer5 site in Figma (open invite)
• 🙋🏾🙋🏼 Questions: Discussion Forum and Community Slack.

Join the Layer5 Community by submitting your community member form.