Prevent errors, not just handle them:
• Format hints (MM/DD/YYYY)
• Real-time validation
• Clear labels
Especially valuable for users with cognitive or motor impairments.
##Accessibility
Prevent errors, not just handle them:
• Format hints (MM/DD/YYYY)
• Real-time validation
• Clear labels
Especially valuable for users with cognitive or motor impairments.
##Accessibility
https://bit.ly/3JlzhO2
https://bit.ly/3JlzhO2
That pricing table looks clear visually, but can screen reader users understand it?
Tables need:
• th elements for headers
• scope attributes
• caption elements
• logical reading order
The test: Does it make sense read aloud, one cell at a time?
That pricing table looks clear visually, but can screen reader users understand it?
Tables need:
• th elements for headers
• scope attributes
• caption elements
• logical reading order
The test: Does it make sense read aloud, one cell at a time?
https://bit.ly/4mOCkfu
https://bit.ly/4mOCkfu
aria-live is powerful but can overwhelm. Use "polite" for most updates, "assertive" only for urgent messages. Announce outcomes, not processes ("3 results found" vs "searching...").
Test with a screen reader - helpful updates can become annoying noise.
##a11y
aria-live is powerful but can overwhelm. Use "polite" for most updates, "assertive" only for urgent messages. Announce outcomes, not processes ("3 results found" vs "searching...").
Test with a screen reader - helpful updates can become annoying noise.
##a11y
Test at multiple points. Add shadows/overlays when needed. Good contrast helps everyone - in bright sun, on old monitors, when tired.
Test at multiple points. Add shadows/overlays when needed. Good contrast helps everyone - in bright sun, on old monitors, when tired.
That "Skip to main content" link is great - if it actually works. Too many jump to the wrong place or don't move focus properly.
Quick test: Tab to your skip link, activate it, then keep tabbing. Are you in main content or still stuck in nav?
That "Skip to main content" link is great - if it actually works. Too many jump to the wrong place or don't move focus properly.
Quick test: Tab to your skip link, activate it, then keep tabbing. Are you in main content or still stuck in nav?
AAArdvark lets you invite unlimited users, assign issues to the right people, track history, and discuss solutions - all in one place.
No more lost fixes in email threads.
Check out what we're building: aaardvarkaccessibility.com
AAArdvark lets you invite unlimited users, assign issues to the right people, track history, and discuss solutions - all in one place.
No more lost fixes in email threads.
Check out what we're building: aaardvarkaccessibility.com
Use h1, h2, h3 for content structure, not styling. Screen reader users navigate by headings.
• One h1 per page
• h2 for major sections
• h3 for subsections
• Don't skip levels
Use CSS for styling. Good structure helps everyone.
Use h1, h2, h3 for content structure, not styling. Screen reader users navigate by headings.
• One h1 per page
• h2 for major sections
• h3 for subsections
• Don't skip levels
Use CSS for styling. Good structure helps everyone.
Real HTML text is better than images of text almost every time.
Your users need text that scales, works with their tools, and adapts to their needs.
##accessibility #webdesign
Real HTML text is better than images of text almost every time.
Your users need text that scales, works with their tools, and adapts to their needs.
##accessibility #webdesign
Still using divs for everything? You're making extra work for yourself AND creating barriers for users.
Still using divs for everything? You're making extra work for yourself AND creating barriers for users.
When content loads dynamically, use aria-live regions and status text so everyone knows what's happening - not just sighted users.
Visual loading states ≠ accessible loading states.
##Accessibility #A11y
When content loads dynamically, use aria-live regions and status text so everyone knows what's happening - not just sighted users.
Visual loading states ≠ accessible loading states.
##Accessibility #A11y