Fix Common Accessibility Issues

Accessibility Issues (Low Contrast, Missing Alt Text)

• Problem: Content is difficult to perceive for users with visual impairments or those using screen readers.
• Why it fails: Excludes users, potential legal issues (WCAG compliance), poor user experience.
• How to Fix "fix low contrast text" / "add alt text to images":
  • Check Contrast Ratios: Use browser developer tools or online contrast checkers to ensure text meets WCAG AA (4.5:1) or AAA (7:1) contrast requirements against its background. Adjust colors as needed.
  • Write Meaningful Alt Text: For every image that conveys information, add a concise description in the alt attribute. If an image is purely decorative, use an empty alt attribute (alt="").

    <!-- Informative image -->
    <img src="chart.png" alt="Bar chart showing increasing sales from Q1 to Q4">
    
    <!-- Decorative image -->
    <img src="background-swirl.png" alt="">