Jenn's Bare Bones Accessibility Cheatsheet

So you want to post something on the internet. Here are 5 quick things to do to make your content more accessible.

1. Can you tab to every link, form field, or 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 (aka not hidden in a screen reader only link).

2. Run a color contrast checker and fix issues.

   There are tons online. I like to recommend WAVE. But browsers do have built in checkers for individual elements so you do you.

3. Alt text!

   Logo alt is company, product, or team name (you don’t have to describe the logo).

   If there is no alt text for an image, screen reader users get the filename of the image. If there is a blank alt, the image is skipped by assistive technology.

   If you don’t know what to do for the alt, what would you say to a friend on a phon if you were describing it? That’s your alt text.

4. 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 know as please stop faking lists and use the list element instead.

5. “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.

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.

Originally this post was a Twitter rant.