Making content visible to everyone
Scenario:
Meet Luna, a talented web developer who's excited to share her new photography portfolio website with her friend Marcus. Marcus has low vision and relies on screen reader technology to browse the web. Luna wants to ensure that Marcus can experience and appreciate all the beautiful landscape photos she's carefully curated for her site. She knows that without proper alt text, her stunning images will be invisible to Marcus and other screen reader users. Help Luna make her photo gallery accessible so everyone can enjoy her artistic vision!
Your Task:
Add descriptive alt text to 4 landscape images
Success Metric:
Alt text is descriptive, not redundant
Scenario:
Sofia is a content writer who just finished her first blog post about sustainable gardening. She's passionate about sharing her knowledge but realizes her article is hard to navigate. Her colleague Alex, who uses keyboard navigation and relies on heading structure to jump between sections, mentioned that the current heading organization makes it confusing to find specific topics. Help Sofia restructure her headings so readers like Alex can easily navigate through her valuable gardening tips!
Your Task:
Fix heading structure (h1, h2, h3 in logical order)
Success Metric:
Logical heading structure
Scenario:
Emma is designing a call-to-action button for her nonprofit's donation page. She chose a beautiful light gray text on a white background because it looks elegant and minimal. However, her grandmother Rose, who has age-related vision changes, mentioned she couldn't read the button text clearly during a family video call. Emma realizes that what looks stylish to her might be completely invisible to users with visual impairments. Help Emma create a button that's both beautiful and accessible to everyone, including users like Rose!
Your Task:
Adjust colors to meet contrast requirements
Success Metric:
4.5:1 contrast ratio achieved