37
10 things you can do today to make your content more accessible Jonathan Whiting WebAIM.org

Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Embed Size (px)

DESCRIPTION

Presented by Jonathan Whiting, MS on September 27, 2013 at the fourth annual Center for Health Literacy Conference: Plain Talk in Complex Times.

Citation preview

Page 1: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

10 things you can do todayto make your content more accessible

Jonathan WhitingWebAIM.org

Page 2: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Auditory Disabilities

From webaim.org/intro/

Page 3: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

1. Provide Captions

Page 4: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Search for captioned videos

Page 6: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Speech Recognition

Page 7: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

2. Make Links Meaningful

Page 9: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Low Vision

NoCoffee Vision Simulator (Chrome)

Page 10: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

3. Provide Plenty of Contrast

Page 11: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

3. Provide Plenty of Contrast

Page 12: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Color Blindness

`

Page 13: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

4. Don’t Rely on Color

Page 14: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Color Blindness

The green mushrooms listed here are okay to eat. The red mushrooms will kill you.

– Amanita– Chanterelle– Porcini– Shitake– Tylopilus

Page 15: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Color Blindness

The green mushrooms listed here are okay to eat. The red mushrooms will kill you.

– Amanita– Chanterelle– Porcini– Shitake– Tylopilus

Page 16: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Color combinations don’t matter(for accessibility)

…just contrast and color reliance

Page 17: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Blindness

Page 18: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Screen Reader User Surveys

Page 19: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

5. Use Headings

Page 20: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Headings

The Wrong way to do headings:• HTML- <p class=“heading2”>Big text (usually) resized with

CSS</p>• PPT and MS Word- Plain text enlarged

The Right way to do headings:• HTML- <h2>Use true headings</h2>• PPT- Use slide templates• Word- Use styles panel

Page 21: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

6. Add Alternative Text

Page 22: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Alternative Text• Read by screen readers• Alternative to images when images are

disabled or not supported• Provides semantic meaning and

description to images• Used by search engines

Page 23: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

What is equivalent alternative text?

CONTENT and FUNCTION

VERY RARELY Description

Page 24: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

If you couldn’t use a picture, what text would you put in its place?

Page 25: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible
Page 26: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible
Page 27: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

7. Give documents unique titles

Page 28: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Page titles

• Often the first thing read

• Should be succinct and descriptive

• Should usually match or be similar to the main heading

Page 29: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Google is blind

...and deaf

...and can’t use a mouse

Page 30: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

8. Don’t ‘Print’ to PDF

Page 31: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

…‘Save’ to PDF

• Works in:– MS Office for Windows

(not Mac)– Adobe InDesign– OpenOffice.org

• Does not work in:– Google Docs– Apple iWork

• Can also create PDF in Adobe Acrobat

Page 32: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Preferred Formats for Web Content

HTML > PDF > Doc/PPT > Anything else

...except PPT slides, then PDF is usually better

Page 33: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

9. Check your Web Pages

Page 34: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

2 Easy Tools

1. WAVE tool - wave.webaim.org1. Red icons = accessibility problems2. ‘Styles’ and ‘No Styles’ view3. Contrast checker

2. Your keyboard – Tab, Shift + Tab (tweaking required on Mac)– Check forms– Open/close boxes

Page 35: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

10. Become an Advocate

Page 36: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Become an Advocate

• Take responsibility for your content• Know your limits and seek help when needed• Ask others about accessibility• Congratulate others (and yourself) for making

a difference

Page 37: Jonathan Whiting - Ten things you can start doing today that will make your website more accessible

Thank You!

http://webaim.org

• Web based forums

• E-mail discussion list

• Tutorials, articles, and resources

• Blog

• Accessibility Reference Guide