🎨 Palette: Improve accessibility with semantic fieldsets#499
Conversation
Replaces `div` elements acting as radio/button groups with native HTML `<fieldset>` and `<legend>` elements to improve accessibility and screen reader support. Adjusts CSS resets to ensure there are no visual regressions. Updates tests and adds a UX learning journal entry. Co-authored-by: n24q02m <135627235+n24q02m@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
Dependency Review✅ No vulnerabilities or license issues or OpenSSF Scorecard issues found.Scanned FilesNone |
1 participant
💡 What: Replaced
divelements that use ARIArole="group"androle="radiogroup"with native HTML<fieldset>and<legend>elements.🎯 Why: To improve native screen-reader support and semantic structure, aligning with web accessibility best practices (preferring native HTML over ARIA attributes).
📸 Before/After: The visual design remains identical due to CSS resets applied to the new semantic elements. (Verified via local testing).
♿ Accessibility: Replaces invisible ARIA attributes and roles with native, semantic HTML elements (
<fieldset>and<legend>) which provide better default behavior and parsing by assistive technologies.PR created automatically by Jules for task 11156367287283793560 started by @n24q02m