Accessibility Matters: Making Your Product Available to Everyone
âąAls PPTX, PDF herunterladenâą
1 gefĂ€llt mirâą452 views
Presented at Interchange 2016
Empfohlen
Weitere Àhnliche Inhalte
Andere mochten auch
Mehr von Char James-Tanny
KĂŒrzlich hochgeladen
KĂŒrzlich hochgeladen (20)
Accessibility Matters: Making Your Product Available to Everyone
- 1. 1 Accessibility Matters: Making Your Products Available to Everyone Char James-Tanny Schneider Electric
- 2. Char James-Tanny ~ @charjtf 2
- 3. Char James-Tanny ~ @charjtf 3 Categories and More > Visual (including colorblindness) > Hearing > Motor > Learning / Cognitive > Aging > Chronic Illnesses
- 4. Char James-Tanny ~ @charjtf 4 People with Disabilities
- 5. Char James-Tanny ~ @charjtf 5
- 6. Char James-Tanny ~ @charjtf 6 ACCESSIBILITY = Usability for (almost) everyone
- 7. Char James-Tanny ~ @charjtf 7
- 8. Char James-Tanny ~ @charjtf 8
- 9. Char James-Tanny ~ @charjtf 9
- 10. Char James-Tanny ~ @charjtf 10
- 11. Char James-Tanny ~ @charjtf 11
- 12. Char James-Tanny ~ @charjtf 12
- 13. Char James-Tanny ~ @charjtf 13 DO NOT PLAY IF YOU GET SEIZURES FROM FLASHING CONTENT.
- 14. Char James-Tanny ~ @charjtf 14
- 15. Char James-Tanny ~ @charjtf 15
- 16. Char James-Tanny ~ @charjtf 16
- 17. Char James-Tanny ~ @charjtf 17
- 18. Char James-Tanny ~ @charjtf 18 Standards and Guidelines So what should you do to make sure that your documents and websites are as accessible as possible? Use WCAG 2.0 and POUR.
- 19. Char James-Tanny ~ @charjtf 19 WCAG 2.0 - http://www.w3.org/TR/WCAG20/ 1 Perceivable *1.1 Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language. *1.2 Provide alternatives for time-based media. 1.3 Create content that can be presented in different ways (for example, simpler layout) without losing information or structure. *1.4 Make it easier for users to see and hear content including separating foreground from background.
- 20. Char James-Tanny ~ @charjtf 20 WCAG 2.0 - http://www.w3.org/TR/WCAG20/ 2 Operable 2.1 Make all functionality available from a keyboard. 2.4 Provide ways to help users navigate, find content, and determine where they are. 3 Understandable 3.1 Make text content readable and understandable. 3.2 Make Web pages appear and operate in predictable ways. 3.3 Help users avoid and correct mistakes. 4 Robust
- 21. Char James-Tanny ~ @charjtf 21 Take Advantage of Existing Plug-ins
- 22. Char James-Tanny ~ @charjtf 22 Take Advantage of Features in the Program
- 23. Char James-Tanny ~ @charjtf 23 Mobile Applications > Google Accessibility Scanner (Google Play Store) > VoiceOver (iPhone) and TalkBack (Android)
- 24. Char James-Tanny ~ @charjtf 24 Other Things to Think About⊠> CONSISTENCY > Headings > Web pages: > No separate sites > Add a page title > Set a language > Create a âfocusâ style
- 25. Char James-Tanny ~ @charjtf 25 More Things to Think About > Tab order and keyboard navigation (PDF, Documents, Applications) > Print gray-scale to check color contrast > PowerPoint: Set all bullets to use the same point size. Use a minimum of 28 points. > Using video? Add captions and transcript. Donât auto-play (use audio controls).
- 26. Char James-Tanny ~ @charjtf 26 Need More Reasons?
- 27. Char James-Tanny ~ @charjtf 27 Good News! > Twitter now allows you to add alt text to tweets (mobile only). > Itâs becoming more difficult to find bad examples. > More public figures are talking about mental illness, depression, and other disabilities.
- 28. Char James-Tanny ~ @charjtf 28 Don Baird. http://www.flickr.com/photos/old-curmudgeon/2298969471/ Used with permission.
- 29. Char James-Tanny ~ @charjtf 29 Questions?
- 30. Char James-Tanny ~ @charjtf 30 Thank You!
- 31. Char James-Tanny ~ @charjtf 31 Supplemental Links > See PDF at SlideShare.
Hinweis der Redaktion
- When I was 10, I broke four toes on my right foot. Skateboarding. While being towed by a bike. On Easter Sunday. In upstate New York. When I hit a piece of ice and flew through the air. Then, as now, there wasnât much the doctors could do, although in my case, they couldnât splint the toes together. When it was time for me to go back to school, my parents made arrangements for me to be picked up by a special transportation bus. You see, we lived about eight miles from the New York State School for the Deaf, and I joined the kids on the bus for the six weeks it took for my foot to heal. They couldnât hear, and I didnât know sign language. So they taught me to fingerspell American Sign Language so that we could carry on at least very basic conversations. Forty years later, I realized that those broken toes were my introduction to people with disabilities. Because over those 40 years (and in the 10 since then), I have met people with varying degrees of abilities. While many people are scared of getting a disability, I know that itâs just a part of life.
- The World Health Organization (WHO) estimates that globally, 20%, or approximately 1 billion people, have at least one disability. Itâs the worldâs largest minority group and the only one that everyone will join at any time. (As Cindy Li said, âEveryone is temporarily abled.â) And while most people tend to think of the blind as the reason why we need to make sure our products are accessible, it is so much more than that.
- Disabilities are categorized as permanent or temporary; visible or hidden; from before birth or acquired afterward. Some disabilities, especially physical, are obvious, but that doesnât really tell you anything about the disability. If you see someone with a stick or a guide dog, they are legally blind. (How blind are they? Thereâs no way for you to tell. And there are a lot of legally blind people who donât use either a stick or a guide dog.) This category also includes people, typically men, who are colorblind. If you see someone with hearing aids, theyâre hard of hearing. (How much or how little can they hear? Thereâs no way for you to tell.) There are approximately 300 different sign languages around the world, but only about 3 million sign language users. If you see someone in a wheelchair or using a walker or a cane, all you really know is that they have trouble walking. (Why do they have trouble walking? Thereâs no way for you to tell. If you see them stand up from a wheelchair, it doesnât mean that theyâre faking.) Motor issues include traumatic injuries (resulting in paraplegia or quadriplegia), Cerebral Palsy, Muscular Dystrophy, Multiple Sclerosis, Spina Bifida, Amyotrophic Lateral Sclerosis (Lou Gehrigâs Disease), arthritis, Parkinsonâs Disease, and Essential Tremor. In addition, tremors can also be a side effect of certain types of drugs. Learning and cognitive issues include dyslexia, dyscalculia, dysgraphia, dyspraxia, aphasia / dysphasia, auditory processing disorder, visual processing disorder, and autism. Attention Deficit Hyperactivity Disorder (ADHD) isnât typically considered a learning disability, but it can disrupt learning. These disabilities are typically considered âhiddenâ because they donât manifest physically and most people donât disclose them. Aging has its own set of issues on top of any other disabilities. At this time, more than 130 million people are over age 60. The aging population typically has multiple disabilities, although they donât refer to them that way. They just say theyâre âgetting olderâ. A recent census analysis states that before 2020, people 65 and over will begin to outnumber children under the age of 5. Chronic illnesses cover a wide variety of issues such as debilitating pain, fatigue, dizziness, repetitive strain injuries, fibromyalgia, and anything with âchronicâ in the description.
- The word âdisabilityâ can be scary. And sometimes, people with hidden disabilities donât want to tell anyone for a variety of reasons, typically reactions. (âOh, you poor thing.â âIâd die if I had to deal with that.â âYou sure youâre sick? You donât look sick.â All of the people on this slide have hidden disabilities (a few have visible disabilities, too). You canât always tell by looking, either at their photos or at them, what disability or disabilities they have. Combined, this group has disabilities including arthritis, asthma, autism, autoimmune disease (body and retina), back problems, legally blind (totally blind, blind in one eye, low vision), brain tumors, cataracts, chronic bronchitis, chronic migraines, chronic pain, colorblind, compromised immune system, Central Sensitization Syndrome, diabetes, epilepsy (both acute and chronic), fibromyalgia, food allergies, hearing loss (total or partial in one or both ears), knee problems (one has knees that dislocate frequently, one has no kneecaps, others have arthritis), Meniereâs disease (inner ear, causes balance and hearing issues, and says it sounds like kazoos when in a cycle), near-sighted, pernicious anemia, Polycystic Ovary Syndrome, PTSD, Rheumatoid arthritis, seizures (symptom), SMART Syndrome (Stroke-like Migraine Attacks after Radiation Therapy), unsteady balance as a result of necrotizing fasciitis. Oh, and one of the people shown donated a kidney to a stranger.
- On average, people spend about 11% of their lives with some kind of disability. My son tried to fit his 11% in before he finished high school. (Obligatory Jesse slide.)
- So what does it mean to us as technical communicators when we talk about accessibility? Weâre really talking about usabilityâŠbut for more people. Most usability experts concentrate on making sure that the given product (application, website, document, etc.) lets users accomplish their goals. But they rarely think about adding accessibility to the mix. Iâm talking about things like using headings and plain language, color contrast, good link text, alt text, videos without captions, font size, font family, and more. Note that it typically isnât possible to make everything work well for everyone. The range of disabilities is too wide and sometimes the solutions are exclusionary. For example, someone who is blind can play a game with sound. Someone who is deaf can play a game with visuals. But here are some examples from companies that are trying (and in some cases, fixing) to make their sites better.
- For example, this clothing site is nice in that it uses the âtitleâ tag to identify the color of, in this case, different camisoles. But if you are blind or colorblind and relying on the descriptions to determine what color you will wearing, youâll probably never be quite sure. (Or you get to have a discussion similar to the one that I had, where I had to explain that âceramicâ was teal, âpoppyâ was purple, and ârouge redâ was pink.) BTW, they also donât quite understand how to use alt text. The code for this photo was alt=âLace Cami, POPPY PURPLE, hi-res" title=âLace Cami, POPPY PURPLEâ. Iâm pretty sure that someone relying on the alt text (typically someone using a screen reader) doesnât really care that the photo is high resolution.
- A lot of people with disabilities are gamers. On the web, no one knows if you have a disability. And some companies are doing a lot of work to help make the gaming experience better. AbleGamers analyzes and reviews games, and they work with Evil Controllers to make more adaptive game controllers for people with various mobility issues. This screenshot is from Clash of Kings (difficult for someone who is colorblind, like my husband, to distinguish the background colors). Some game companies have already started using good color contrast or added it to their settings; in one case, the creative director was colorblind, and he started pushing for better color contrast. By the way, good color contrast also applies to PowerPoint presentations, websites, Word documents, PDFs, and more.
- Website active links without good color contrast. The regular link isnât quite dark enough to meet the color contrast guidelines and the active link just about disappears.
- When I went to check the color contrast ratios for the article links, I discovered that someone had updated the CSS. (Note the dates: It was the same day.)
- Weather maps and restaurant websites tend to be the worst for usability and accessibility. On the left: Savannah, Georgia, day-by-day weather forecast for October 2015. Most of the forecast is fine with black text on a white background, but the map also includes a comparison of the current temperature and what it feels like. Those two lines are in dark gray and yellow, which are very difficult distinguish. On the right, a column of one Boston weather map with three different colorblindness filters applied (in order, normal, protanopia (red weakness), deuteranopia (green weakness), and tritanopia (absence of blues). The winter of 2014-2015 in Boston was brutal (with more than 11 feet of snow in some places). My husband, who is colorblind, had trouble distinguishing the bands of color on the weather map and wasnât sure how much snow we were going to get.
- âDear Kittenâ video with closed captions. Although youâd think that Purina could pay for someone to actually verify the caption content.
- Flickering video. This is bad for people with epilepsy or who get seizures. (And it also has bad captions.)
- If youâre working on a website, there is a âfocusâ attribute that lets keyboard users know where they are (without having to watch the URLs at the bottom). Years ago, web developers used to hide the âfocusâ because it was ugly. However, itâs actually really useful. Can you tell me which link is selected at the Barnes & Noble site? No, because there isnât any indication on the slide. (The Stores & Events link was selected.) But on the LavaCon site, you know exactly which link is selected because it has a dotted border (although the color contrast could be better). And the Interchange site uses focus, but itâs really difficult to see because of the background.
- We can also use âSkip linksâ on websites to let keyboard users jump over any information at the top of the page to get to specific information. These links can be static (that is, they are always on the screen), which makes them more convenient for people who use the keyboard to navigate but can see (at least something) to know that theyâre there. These links can also be hidden until a keyboard user tabs to them. Both ways help people who use screen readers. (Note that more than the blind use screen readers. People with dyslexia and cognitive issues, and those who speak English as a Second Language also use them.) The New York Times has a nice feature. After tabbing through Sections and Search, a link shows up for Skip to Content, and tabbing again toggles that link to Skip to Navigation (not shown). NBC News, on the other hand, doesnât have a âskipâ feature. (And âMOREâ is always highlighted, which can be distracting for just about everyone.) One nice thing is that in the last six months, theyâve added the âfocusâ box.
- Another type of disability is situational disabilities. People end up at the wrong place (physically or on the web) because theyâre in a hurry or theyâre panicking. Other places where situational disabilities occur are at the office (conference calls in open cubes, anyone?), bars and airports (if the volume is even on, itâs still impossible to hear), doctorsâ offices (âwhite-coat syndromeâ), and more. I used the map of the Mansfield Police Department because I needed to call them once. (My husband was driving my car, which had broken down, so he left it in a parking lot. I wanted to call to let them know that we werenât abandoning the car and would pick it up the following morning.) It was currently 11 p.m., I was tired, and I was worried. So I did a quick search for âMansfield Police Departmentâ and called the number. I didnât even notice that the area code (817) was not a Massachusetts area code (mine is 781). When the officer answered, I told him that my car had broken down and was in the Stop and Shop parking lot. He asked me where I lived, and then gave me the correct number for the police department that I needed. For some reason, the Mansfield police department in Texas showed up first in search. And this officer had gotten so many incorrect phone calls that he printed out a list of the numbers for all of the Mansfield police departments in the U.S.
- And everyone can be affected by problems, not just those with disabilities. In this example, the main website for Thomas Keller includes all sorts of informationâŠlocations, publications, online store, and moreâŠif youâre using a desktop. But if youâre on the web, all you can see is pretty pictures of food and connect to their social media.
- The bolded items on the next two slides pertain to tech comm.
- 2.2 Provide users enough time to read and use content. (While Technical Communication rarely uses timed media, itâs something to be aware of.) 2.3 Do not design content in a way that is known to cause seizures. (While Technical Communication rarely uses flickering video, itâs something to be aware of.) 4.1 Maximize compatibility with current and future user agents, including assistive technologies.
- The first plug-in is WCAG Contrast Checker for Firefox. Enable it, and you can use it to determine the correct color contrast ratios for any content. For example, if you want to check the color contrast of your PowerPoint slides or Word docs, select the text, select the color picker, and see what the RGB values are. Type them into the box, and youâll either get a green checkmark (yay!) or a red X (find another color). The second plug-in is Fangs for Firefox and Chrome. It analyzes the page the way a screen reader would and provides the results. It shows number of headings and number of links, images, links, lists, and so on.
- Microsoft Word document with the navigation pane enabled, which shows where headings have been formatted. Good document structure requires headings, and it requires that they are used sequentially.
- Itâs the right thing to do. When you make your documents and products accessible, you also make them easier to use for people without disabilities. Youâll probably make more money. People with disabilities have a cumulative annual disposable income of $1 trillion, with $544 billion in the US alone. (Remember that 20%? If your products arenât accessible, youâre completely missing some portion of that 20%.) And itâs the law. The ADA âgives civil rights protections to individuals with disabilitiesâ (and more and more, websites are being considered âpublic accommodationâ). Section 508 covers businesses working with the federal government. Most other countries already have fully comprehensive laws based on WCAG 2.0. Recent lawsuits: Uber (guide dogs), California man sued Colorado Bagân Baggage (and won), H&R Block (legal agreement). Note: Some law firms are now filing suits without a client. Several companies are offering free audits. If your company gets notice that your website is not compliant, do not settle (this will just lead to more settlements). Contact a company that performs accessibility audits for websites and fix the problems.
- Whatever you do: make sure that whatever you do actually improves accessibility and usability.
- Time for a quick iPhone demo?