enhancement: Post Editor : Accessibility Improvement#788
Open
jaynomyaro wants to merge 2 commits into
Open
Conversation
Author
|
Done ma...Thank you! @RUKAYAT-CODER2025 |
Contributor
|
Great job so far There’s just one blocker — the workflow is failing. Could you take a look and fix it so all checks pass? Happy to review again once that’s done. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
This PR enhances the Post Editor by introducing accessibility improvements to ensure that all users, including those relying on assistive technologies, can create and edit posts seamlessly. The changes align with WCAG 2.1 AA standards and improve usability across diverse user groups.
🎯 Key Improvements
Keyboard Navigation
Added full support for tab/arrow key navigation across editor controls.
Ensured focus states are visible and consistent.
Screen Reader Support
Implemented ARIA labels and roles for editor buttons, toolbars, and formatting options.
Improved semantic HTML structure for better interpretation by assistive technologies.
Color Contrast & Visual Cues
Updated button and toolbar styles to meet minimum contrast ratios.
Added non-color indicators (icons/text) for formatting states.
Error & Status Messaging
Introduced accessible alerts for validation errors and save/publish status.
Messages are announced to screen readers without disrupting workflow.
🛠️ Implementation Details
Refactored editor toolbar components to include ARIA attributes.
Added role="status" and aria-live regions for dynamic updates.
Adjusted CSS variables to meet contrast requirements.
Introduced unit tests for accessibility compliance using axe-core.
✅ Testing
Manual testing with NVDA and VoiceOver screen readers.
Verified keyboard-only workflows for post creation and editing.
Automated accessibility checks integrated into CI pipeline.
📊 Impact
Improves inclusivity and compliance with accessibility standards.
Enhances user experience for individuals with visual, motor, or cognitive impairments.
Reduces risk of accessibility-related issues in audits.
🚀 Next Steps
Extend accessibility improvements to media upload dialogs.
Add localization support for ARIA labels.
Conduct usability testing with diverse user groups.
👉 This PR positions the Post Editor as more inclusive and compliant, while also laying the groundwork for future accessibility enhancements. closed #359