Let's Make the Web Accessible for All! #a11y
Design for Color Blindness
Things To Keep In Mind
✅ Red-/green deficiencies are more common in men.
✅ Use blue if you want users to perceive color as you do.
✅ Use any 2 colors as long as they vary by lightness.
✅ Colorbrlind users can tell red and green apart.
✅ Colorbrlind users can’t tell dark green and brown apart.
✅ Colorbrlind users can’t tell red a
My anti-overlay client letter - Alistair Shepherd
alistairshepherd.uk
When you use the <object> element, you can provide content between its opening and closing tags to be used as a fallback for when the linked image doesn’t load. This was a perfect opportunity to feed two birds with one scone:
- Provide a text presentation of the data presented in the chart as a fallback, and
- associate that text with the i
The Practical Accessibility Course
When the image of text is complex, the text alternative will often need to be accompanied by either (1) a more extended description of the image’s content, or (2) an alternative presentation of the image’s content.
The Practical Accessibility Course
To give both sighted and non-sighted users an equivalent experience, we can use the well-supported aria-invalid attribute. When the user focuses the input, it will now announce “Invalid” (or similar) in screen readers.
Adam Silver • Form Design Patterns
A focus indicator can also take other forms, but outlines are very common for good reasons.
Outlines have an advantage over other visual indicators (like borders or background colors, for example) in that they can be applied to the element without causing any significant changes to that element. And since an outline is not part of an element’s box ... See more
Outlines have an advantage over other visual indicators (like borders or background colors, for example) in that they can be applied to the element without causing any significant changes to that element. And since an outline is not part of an element’s box ... See more
sarasoueidan.com • A guide to designing accessible, WCAG-compliant focus indicators
Why outlines work best and box-shadow should be avoided to indicate focus
Ideas related to this collection