© 2014 Boise State University 1

Accessibility

When websites are correctly designed, developed, and edited, all users have equal access to information and functionality.

© 2014 Boise State University 2

Accessibility

1 in 5 people in North America claim one or more disability.

© 2014 Boise State University 3

Accessibility• Colored links assist the color blind.• Large images assist the elderly.• Semantic HTML and textual-equivalents for

blind users.• Plain language and illustrated images assist

users with dyslexia and other learning difficulties.

• Contextual alternative text assists people with slow internet connections.

© 2014 Boise State University 4

Accessibility• A social responsibility.• Federal requirements serve as a model.• Provides equal access for all, regardless of

disabilities, age, & internet connection.• Provides benefits to aging workplace

population.

© 2014 Boise State University 5

Use Headings Instead of Font Sizes

© 2014 Boise State University 6

Web Semantics - Headings

© 2014 Boise State University 7

Review Your Site

WAVE 3.0 - wave.webaim.org

© 2014 Boise State University 8

Label Graphics & Images

Give your image a concise title.

Use Alt-Tag, and use it correctly.

© 2014 Boise State University 9

Contextualize Your Links• Incorrect: “For the latest version of our

software, click here.”

• Correct: “For the latest version of our software, click here.”

© 2014 Boise State University 10

Accessibility Tips & Tricks• Again, don’t change the font size. Use headings

or shortcodes to emphasize text.• Explicitly state information. E.g., indicate

required fields in a form by using a phrase such as “required.”

• Explain pulldown or navigation menus.• Use the Boise State theme! The theme is your

friend.• Don’t forget to evaluate your site on a phone.

© 2014 Boise State University 11

Clean Up Your Media Library

© 2014 Boise State University 12

Clean Up Your Media Library

© 2014 Boise State University 13

Optimize Your Images• Output your images to destination size.• Crop excess white space.• Save photographs/gradients as JPEG (JPG) files

(apply approx. 30% compression).• Save line art/solid color images as PNG files (8-

bit if possible – 24-bit can vastly increase file size).

© 2014 Boise State University 14

Take It Easy With the Slideshows• No more than 5 rotating slides in each slider

gallery.• Ensure image sizes and descriptions are

consistent.

© 2014 Boise State University 15

Free Optimization Tools• TinyPNG

Compress PNG files 50-80%.

• Smush.it Optimize all web images.