Jenn’s bare bones accessibility cheatsheet.
Because the web needs to be more accessible than it was in 1994. (View Tweet)
Can you tab to every link, form field, interaction point?
Just hit tab and make sure everything is in a logical order.
Drop down menus can be opened via enter or spacebar.
Or if your nav menus suck for keyboard you have a site map easily accessible by EVERYONE. (View Tweet)
Run a color contrast checker and fix issues.
There are tons online. I like to recommend WAVE. But do browsers have built in checkers for individual elements so you do you.
https://t.co/11o0TbOtlG (View Tweet)
Alt text!
Logo alt is company, product or team name.
If there is no alt text, users get the filename.
If there is a blank alt, it is skipped.
If you don’t know what to do for the alt, what would you say to a friend on a phone if you were describing it? That’s your alt. (View Tweet)
Use semantic elements everything shouldn’t be a div or span.
Use native HTML elements whenever possible. There are built in accessibility features whenever you use them.
Also known as please stop faking lists and use the list element instead. (View Tweet)
“Click here” gives no meaning.
Where are they going? Is it a link to a different site? A PDF? A pop up?
Stop training your users to click random links, your security team will thank you. (View Tweet)
Really, just start with these five things. You will fix so many accessibility issues if you do.
And the best part, these things apply to emails, documents, webpages, tweets, really anything that can go online.
Practice it everywhere. (View Tweet)
Jenn’s bare bones accessibility cheatsheet.
Because the web needs to be more accessible than it was in 1994. (View Tweet)
Can you tab to every link, form field, interaction point?
Just hit tab and make sure everything is in a logical order.
Drop down menus can be opened via enter or spacebar.
Or if your nav menus suck for keyboard you have a site map easily accessible by EVERYONE. (View Tweet)
Run a color contrast checker and fix issues.
There are tons online. I like to recommend WAVE. But do browsers have built in checkers for individual elements so you do you.
https://t.co/11o0TbOtlG (View Tweet)
Alt text!
Logo alt is company, product or team name.
If there is no alt text, users get the filename.
If there is a blank alt, it is skipped.
If you don’t know what to do for the alt, what would you say to a friend on a phone if you were describing it? That’s your alt. (View Tweet)
Use semantic elements everything shouldn’t be a div or span.
Use native HTML elements whenever possible. There are built in accessibility features whenever you use them.
Also known as please stop faking lists and use the list element instead. (View Tweet)
“Click here” gives no meaning.
Where are they going? Is it a link to a different site? A PDF? A pop up?
Stop training your users to click random links, your security team will thank you. (View Tweet)
Really, just start with these five things. You will fix so many accessibility issues if you do.
And the best part, these things apply to emails, documents, webpages, tweets, really anything that can go online.
Practice it everywhere. (View Tweet)