blob: cb4ad2789cdf624fa0beb810d3cf2b1a21552817 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
[[!meta title="Simple Accessibility"]]
[[!meta date="2018-09-07"]]
Implementing proper accessibility practices can seem a little daunting at first, but there are a few basic standards you can introduce into your project work-flow that are fairly straightforward:
## Basic design
1. Test that your project has the proper contrast color settings between type, backgrounds, icons etc.
2. Only use "fancy" grid-ordering for minor layout design - avoid rearranging important content via CSS
## Content
1. Use proper HTML structures (aside, header, main, footer elements as needed)
2. Make use of the [aria-label attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute)
3. Ensure your website/app can be navigated completely (and properly) with only a keyboard
## Images
1. Avoid using CSS backgrounds for content images (should only be used for patterns, layout design etc.)
2. Ensure proper `alt` attributes are provided on all images
It isn't much - but follow these basics and you'll be one step closer to providing better accessibility to your users.
|
