Today’s goal:
- Explore how to make websites usable for everyone
Today’s featured website:
- http://mylacroix.com/– Style your own can of fancy sparkling water!
Website Accessibility
- You will be broken into pairs or groups and will focus on a certain user group. Read the Do’s and Don’ts and be prepared to explain them later to the class.
- Screen readers Add GoogleVox to Chrome (remove after) and go to the school website to find out what’s for lunch tomorrow. Try using only the Tab key on your keyboard; no mouse! How easy or hard was this? What issues did you face?
- Dyslexia Read the Do’s and Don’ts on your poster. Find two websites- one that is a good example of making a site more accessible to people with dyslexia and one that needs work and has a lot of Don’ts.
- Low vision and color-blindness Go to https://www.toptal.com/designers/colorfilter and look at how Amazon.com looks to people with different types of color blindness (also try http://colorfuzz.com/ if toptal is too slow). Do you think Amazon does a good job of helping people with color blindness navigate the site and determine what’s important (for example, the price cut for the Echo)? Why or why not?
- Hard of hearing Go to YouTube.com and check out different videos. Do they all have closed captioning? Go to Jumanji’s site and review the home page as well as the videos page. How accessible is it for a deaf person?
- Autism Read the Do’s and Don’ts on your poster. Find two websites- one that is a good example of making a site more accessible to people with autism and one that needs work and has a lot of Don’ts.
- Physical or motor disabilities Go to AMC Assembly Row’s website and see how easy or hard it is to order movie tickets (don’t actually buy them, just try!) using only the Tab key on your keyboard; no mouse!
Class Discussion
- Each group will present their topic area
- What did you learn? Did anything surprise you?
- What can you do as a web designer to make your site more user friendly to all?
Tools and Resources for Website Accessibility
- http://contrast-finder.tanaguru.com/result.html– Helps you find contrasting colors for improved text readability
- http://www.washington.edu/accessibility/web/– Great for tips and approaches
- https://www.24a11y.com/2017/accessibility-testing-tools-desktop-mobile-websites/– Comprehensive list of tools and resources