Making Videos and Remote Sessions Accessible – and other new W3C WAI resources

Mar 8, 2021 14:49 · 5172 words · 25 minute read

Hi, there. Thank you so much for joining me to talk about making video and remote sessions accessible to people with disabilities.

00:11 - I will also talk about some other new resources from the W3C Web Accessibility Initiative, which I’ll pronounce as WAI (“way”).

00:20 - I want to start out by playing a couple of clips from a video to illustrate some of the points that I’m going to make during this session.

00:28 - It’s a BBC video. There are a couple of things you need to know that you might not, depending on where you live in the world and how old you are.

00:37 - A Blackberry is a personal digital assistant, an electronic device that proceeded smartphones.

00:46 - And Orange is a network for mobile, et cetera.

00:50 - I’m going to play two clips from this video, and the first one, you’re going to be blind, so you can hear it, but not see it.

00:58 - And the second one, you will be deaf, so you can see it, but not hear it.

01:05 - All right, let’s see how that goes. (bell ringing) I bought something from you last week and I’m very disappointed.

01:14 - Oh yeah. What’s your problem? Yeah well, my Blackberry is not working.

01:19 - (audience laughing) Why is that so funny? What’s the matter? You’ve run out of juice? (audience laughing) No, no, it’s completely frozen.

01:33 - (audience laughing) All right. I don’t get why that’s funny.

01:36 - It’s annoying. Oh yeah, I can see that. Okay, this next clip is from the same video, I’m going to mute the sound and we’ll see how that goes.

01:51 - I see, everyone’s laughing. Why is everyone laughing? Even the actor is having trouble not laughing.

02:00 - Why is everyone laughing? It’s doesn’t look funny at all.

02:05 - Yeah, without captions – I don’t get it.

02:08 - Okay, so that’s to illustrate this. We’re missing the point of this video if we can’t see it or can’t hear it.

02:16 - It is very clever though, so I’ll let you listen to the rest of it and think about the importance of the visual description, and being able to get the audio information.

02:28 - The visual description of this is it’s in a fruit and vegetable shop.

02:33 - And there are no electronics. So it’s actual fruit.

02:36 - Like the orange is a piece of citrus. And he talks about a date, which is, I think they’re fruit.

02:43 - A date which he puts into his diary, which is actually a paper calendar.

02:50 - And then at the end, there’s an egg carton with a cost written on the top.

02:55 - All right, so there’s your visual description going in.

03:00 - (bell ringing) I bought something from you last week and I’m very disappointed.

03:06 - Oh yeah. What’s your problem? Yeah well, my Blackberry is not working.

03:12 - (audience laughing) What’s the matter? You run out of juice? (audience laughing) No, no, it’s completely frozen.

03:25 - (audience laughing) (Man knocking) Oh yeah, I can see that.

03:30 - I’ll tell you what let’s try it on orange. (audience laughing) That’s got a few black spots, you see? Oh dear.

03:40 - Yeah, sorry about that. Yeah. (audience laughing) Well there are, you didn’t get my Blackberry working.

03:47 - Well it could be an application issue. Where did you store that Blackberry? It was on my desktop.

03:52 - Well you could try using a mouse to drag the Blackberry to the trash.

03:56 - (audience laughing) Then after you’ve done that, you might wanna launch the black wave from the desktop.

04:02 - (audience laughing) Well, I’ve already tried that a few times.

04:08 - I mean it already was messing up windows. (audience laughing) Well might be worth waiting a couple of weeks.

04:14 - They got the latest Blackberries coming in then.

04:16 - Well, could you give me a date? Certainly.

04:19 - (audience laughing) Let me put that date in my diary.

04:23 - (audience laughing) In a paper calendar.

04:26 - Anything else I can help you with? Yes, yes.

04:28 - I’ve also got a problem to be honest with my apple.

04:32 - (audience laughing) Oh dear, oh dear, that is an old apple, isn’t it? Yeah, yeah.

04:37 - When did you buy that? Last week. Last week? Huh, they’ve brought out two new apples since then.

04:42 - (audience laughing) What’s the problem with it? Well, I’ve tried to put my dongle in it and it won’t fit.

04:50 - (audience laughing) Oh yeah. This is the part we missed without captions really.

04:55 - (audience laughing) I don’t think it’s your dongle.

04:58 - (audience laughing) Well, I didn’t know much about these things, but my wife has seen a few dongle’s in her time.

05:04 - (audience laughing) And she says it’s a little bit on the small side.

05:09 - (audience laughing) Well frankly, there’s no lot I can do about that.

05:12 - (audience laughing) Tell you what, let me try booting it.

05:15 - He kicks it. (glass breaking) (audience laughing) Now it’s crashed.

05:21 - (audience laughing) Anything else I can help you with? Well funny enough, yes, My grandson’s birthday is soon.

05:31 - Okay. Now he’s already got an Apple and a Blackberry.

05:34 - I mean have you got anything else he might just like? (Owner inhales) Well we’re doing a special offer on these.

05:39 - I mean I can’t make head or tails of them, but the kids seem to like them.

05:43 - Eggs box 360. (audience laughing) That’s the egg carton.

05:48 - All right. So that was just for fun, but you see how important it is to be able to get both the visual information and the auditory information.

05:57 - Otherwise this video doesn’t make sense. And that’s even more important when we’re talking about things like training videos, and education, and other important information.

06:05 - That’s what we’re going to talk about next.

06:08 - We’re going to talk about making our media and remote sessions work for people with all types of disabilities, including motor or physical, visual, cognitive or learning, hearing, speech, all different kinds of impairments, as well as multiple impairments.

06:27 - The same person having different issues. I’m also going to mention WCAG, it’s the standard we developed, Web Content Accessibility Guidelines, W-C-A-G.

06:41 - That standard does include requirements for media.

06:47 - And we have a separate resource that presents it in a different way, and goes into more detail.

06:53 - And that resource is called Making Audio and Video Media Accessible.

06:59 - It’s kind of a tutorial for how to do that.

07:01 - That resource includes all of the WCAG requirements as well as best practices for optimum accessibility that go beyond some of the minimums of WCAG.

07:14 - You can find that resource on the WAI website.

07:19 - The address is w3. org/WAI/media/av for audio/video, or from anywhere on the WAI website in the main navigation, the third item is Design & Develop, and then in the secondary navigation, the fourth link is Audio and Video Media.

07:41 - And that will get you to this resource that I’m going to talk about next on making audio and video media accessible.

07:48 - This covers several things that you would expect.

07:51 - It covers captions, subtitles. It gives you a good example of why automatic machine-generated captions are not sufficient.

08:03 - So go look up that example. It talks about transcripts, including descriptive transcripts, which include both the audio information and the video visual information too, which is essential for people who are deaf and blind to be able to get the information from your video.

08:22 - It talks about interactive transcripts. It talks more about the description of visual information and about sign languages.

08:31 - And I’ll talk about description of visual information a little bit more later.

08:36 - Before this resource gets into those nitty gritties.

08:40 - It has three sections even ahead of that. They are foundational for understanding this.

08:46 - What do you think those sections are? What do you need to know before you jump into the details? Well, whether you’re focusing on meeting WCAG and being accessible for media or anything else, we strongly believe that the first thing you need to do is understand how people with disabilities use the technology.

09:07 - Because if you don’t understand that, you won’t be able to implement things well and provide a good accessible user experience.

09:15 - So that’s the first page of our resource. It talks about understanding the user needs and the user experiences of people with disabilities.

09:26 - It also provides examples of how what we do to make our media accessible makes it more used by people with and without disabilities.

09:35 - So that’s a good illustration of our tagline: essential for some (people with disabilities) and useful for all (people in different situations).

09:49 - There’s also a section on the benefits to organizations.

09:52 - It covers things like SEO, search engine optimization.

09:58 - A little side note: If you are looking for examples for a business case or such of how what we do for accessibility benefits others and organizations, I encourage you to take a look at this page and that list.

10:13 - I think that’s very compelling, very compelling.

10:17 - All right, the next page in this resource is on planning and managing accessibility for your media.

10:24 - It gives you some guidance, whether you’re developing all of it in-house or whether you’re outsourcing it or whether you’re trying to decide what to do in house and what to outsource.

10:35 - So that’s planning and managing. The last link in this section is to a page on media player accessibility.

10:45 - Now there’s still one I haven’t mentioned, any idea? This is one that I think gets forgotten a lot when we talk about accessibility.

10:54 - I think we’ve focused on accessibility of existing media – retrofitting.

11:00 - And this page helps us focus early on in the process.

11:03 - This is on the audio and video content itself, the content.

11:10 - And what are the accessibility considerations that you need to do from the beginning? – when you’re planning, when you’re scripting, when you’re storyboarding, and later when you’re recording and producing, what do you need to think about? And I’m going to stress that as we go through.

11:25 - Some examples that this page helps address, common barriers that we see in videos is: missing description of visual information for people who can’t see the video.

11:38 - And that includes things like the title text at the beginning of the video, (I said all the text that was in there. ) It includes things like links or email addresses at the end.

11:50 - (You notice I read out all the links. ) It includes speakers’ names and texts.

11:54 - If you have, like you’re doing interviews or whatever and you put in text on the video the person’s name and their title, you need to make sure that that information is available.

12:04 - Any text in a presentation. You don’t have to read it out exactly.

12:09 - You just have to make sure that you’re conveying the key information.

12:13 - And I’m demonstrating that as we go. Another common barrier is requiring sight or hearing to understand the actual content of the video.

12:24 - So if your video has something like: “attach the small ring to the green end”.

12:30 - Yeah, well what if people can’t see green? What if they’re colorblind? You could fix that by adding something like: “attach the small ring to the green end, which is the larger end. ” Okay, now I know, even if I can’t see it.

12:45 - Other common barriers are making the text that you have in the video hard for some people to see (people who can see and have low vision) because of insufficient contrast or just tiny text.

13:00 - So those are some of the common barriers that we want to avoid, and this page helps.

13:04 - There are six points under Audio and five points under Video.

13:09 - And each one of them is indicated if it directly relates to a WCAG requirement, Level A, AA, or AAA, or if it’s something that goes beyond minimum requirements.

13:23 - Take a look at that page. I think if we were all thinking about this when we were doing videos, it would really increase the accessibility quite a bit.

13:32 - From the first page of the main resource, it’s the third link: Audio Content and Video Content.

13:43 - Okay, I’ve got a graph that shows something we’re all familiar with in a software development life cycle or website or web app or, it’s the cost to make a change.

13:54 - And that is, if you have to make a change early on in requirements or analysis, it’s not going to cost that much.

14:00 - But the later you go into coding or testing or production, then those changes later are much more expensive.

14:08 - And with accessibility in general, I think this is a steeper curve, and especially when we’re talking about media, about video or audio.

14:17 - Because if we don’t do those things that we cover in that Content page, you could end up in a situation where retrofitting to make the video accessible is either going to be really awkward, or maybe not even feasible, and you may have to redo it.

14:36 - So this is why it’s really important that we get this done, And we understand what we need to do from the beginning.

14:44 - An illustration of this: I have a picture of a house with stairs along the side of the yard.

14:51 - And to make that accessible, they had to add this really ugly steel ramp that goes back and forth, and back and forth, and back and forth, and back and forth, and back and forth, and takes up the entire front yard.

15:02 - We want to avoid that. We want our accessibility to be smooth and beautiful, right! In order to do that, we really need to start from the beginning when we’re planning and we’re scripting, and we’re storyboarding, and make sure we’re getting that done upfront.

15:19 - The issues that we need to address. Okay, I’m going to give you an example of a visual description, or description of visual information or audio description – It’s called different things.

15:32 - Basically, here’s a training video and I’m going to play the first version of this, you are blind.

15:44 - So you can’t see it, but you can hear it. And let’s see how that goes.

15:49 - For now, let’s do an activity to illustrate that.

15:52 - This is a quiz to see what you think. I have two pages here and I’m going to ask you a question about them.

15:59 - Here is version one. (paper rustling) Look at it carefully.

16:03 - Now here is version two. (paper rustling) What do you notice about it? How is it different? Both pages have the exact same text content, that is, they have the same words.

16:14 - They even have the same font family. But they look very different.

16:18 - Now, the question for your quiz. If you have a person with significant low vision, which would they be able to read better? Which would be easiest for them to read? Would they be able to read this one better? (paper rustling) Or would they be able to read this one better? You probably said this one. (paper rustling) Well, not necessarily.

16:44 - All right. How’d you do on that quiz? Who picked the first one and who picked the second one? (Shawn giggles) Yeah, don’t know at all.

16:51 - All right, that was made up. If you had to add description to that existing training – I have a graphic of someone pulling their hair out – it’d be a lot of work and it’d be awkward, because you’d have to keep pausing to explain every time the trainer says “this one” or “this one”, which one it is, right.

17:11 - So we want to avoid that. And you can, if you think about it ahead of time.

17:16 - You can do something that’s called “integrated description”.

17:19 - And that is where the description is just included in the script.

17:23 - It’s just the way it’s done. And so it’s smoothly incorporated in the training.

17:29 - Next I’ll show you the real training that scenario comes from.

17:35 - Well, let’s do an activity to illustrate that.

17:37 - I have two pages here. Version one is 11 point text with 1. 15 line spacing, and the paragraph width is about 40 characters.

17:50 - It takes up about 10% of a sheet of paper. So just a little bit.

17:55 - Version two is large print. It’s about 26 point type, double line spacing, also has a width of about 40 characters, but because the text is so large, the exact same text, the same content, takes up the entire page.

18:13 - So my question to you is: if you have a person with significant low vision, which would they be able to read better? Version one with the small print? Or version two with the large print? You probably said version two.

18:30 - Well, not necessarily. All right. There’s an example of integrated description.

18:38 - You understood – even if you didn’t see it – exactly what was it you needed to know about this [visual] information, and it was just smoothly integrated.

18:45 - So we don’t have to go back and do separate description files.

18:49 - Now, if you wanna know the rest of the story of this training video, you can find it in the media resource.

18:59 - It is linked as an example of integrated description.

19:04 - All right, so integrated description works really well for training videos like that.

19:09 - But what if you have a story? Like a film story.

19:14 - Yeah, an integrated description, isn’t going to work.

19:17 - You’re not going to have the character saying, “I banged on the door”, right.

19:23 - Instead you’ll probably be adding description separately, maybe as an audio file.

19:30 - If there are enough pauses in the main sound like the dialogue, and you don’t need much description, you can just integrate it in the pauses.

19:41 - Like in the video example we started with, from the BBC, I was doing some of that.

19:46 - Just adding some visual description as we went.

19:50 - But sometimes that won’t work. Sometimes there’s just not a lot of time space.

19:55 - The dialogue keeps going, going, going. There’s no break.

19:58 - You need to describe something that’s important to understand the story.

20:01 - So what do you do then? Well, if you haven’t thought about it ahead of time, then a lot of times what people end up doing is pause the action in the video, add audio description, restart the action, pause, description, restart, pause, description.

20:19 - And it’s just not very smooth. It’s not very smooth.

20:22 - Sometimes you can do something really cool instead.

20:26 - You can film extra time for the spaces. We have an example of one of our Perspectives Videos.

20:36 - By the way, if you haven’t seen those, I encourage you to go look for the “WAI Perspectives Videos” and take a look at those.

20:44 - And there are some linked from our media resource.

20:48 - What we did is we filmed extra time in the scenes, so that we could keep the video going and integrate, have the description with the nice flow of video.

21:02 - For the version of the video without description, one scene is three seconds.

21:09 - But then the same scene in the video with description is seven seconds.

21:14 - So that’s really cool. And if you want to see an example of that, again it’s in the media resource.

21:22 - Okay, here are the things to get started. You probably know about captions, and transcripts, and sign language, and this will give you more information on media players, on understanding the user experience, and really importantly: what you need to do upfront for description and for other things to make sure you can have a smooth accessible user experience with your audio and video.

21:47 - Again, you can find that on the WAI website at w3. org/WAI/media/av We also have a related resource.

21:59 - If you’re doing something like this, a presentation.

22:02 - You’ll probably want to take a look also at the resource called: “How to Make your Presentations Accessible to All”.

22:08 - That covers like meetings, and training, and other types of presentations.

22:15 - It includes broad things like making sure the venue is accessible, considering accessibility when you’re scheduling sessions.

22:25 - And it also has some specific things for presenters.

22:28 - The sections there you want to particularly look at are: Preparing slides and projected material, and: During the presentation.

22:37 - That has some additional information for you.

22:40 - You can find that from the WAI website: from the main navigation, the link is Teach and Advocate, and then it’s the first main link under there, Make Presentations Accessible.

22:53 - This was originally designed a few years ago for live sessions.

22:59 - A lot of it does apply to remote, and we’re in the process of updating it to cover more about remote.

23:07 - And we may make that interactive, so you can select what you want and get specific information.

23:14 - Hopefully this answered some of your questions about making video and remote sessions accessible.

23:21 - Maybe it introduced new questions and you know now where to go find answers in the media resource and in making presentations accessible.

23:31 - Now, if we were in person and I could see you, I would ask how many people knew about those two resources before today.

23:38 - And I would guess that some did not. And that’s one of the things that I’d like your help with, is telling people about these resources.

23:47 - We have a lot of cool stuff on the WAI website that people don’t even know about.

23:52 - And I want to highlight a few just to show you the breadth of information you can find on the WAI website to answer your questions.

24:02 - I need to convince my boss to give me time to make my web app accessible.

24:08 - We have a business case for digital accessibility.

24:11 - We had an old version years ago, and we updated that to be a totally different approach.

24:16 - Take a look at that. I have been tasked with developing an accessibility course for our in-house team.

24:28 - We have several different training resources, and about year and a half ago, we started working on a curricula.

24:35 - We now have a detailed curricula to help you develop your own course, tell you what to, suggestions on what to include, learning objectives, things like that.

24:46 - Right now we have several foundation modules and we’re about to publish the developer modules and we’re working on designer modules.

24:55 - There’s something that’s already there and that you can watch or contribute to, as we continue to develop that.

25:01 - We are redesigning our investment services website.

25:07 - Our customers are mostly retirement age. So we are looking for guidance on how to make our website easy to use by older people.

25:18 - We have a resource for that. We have several actually related to design for older users.

25:23 - Including a resource that says: these are the particular WCAG techniques to focus on to make your site more usable by older users.

25:34 - I have a user experience background and I want to include people with disabilities in our design process.

25:41 - I need help convincing my department head to let us do it.

25:45 - And I could use some tips. Again, this is something that we feel very strongly about.

25:51 - We have a resource called Involving Users for Better Easier Accessibility, and it starts out with some of the benefits of involving users early and throughout the process in user centered design, other user experience techniques.

26:09 - And then we also have another page that is specifically on evaluating accessibility with people with disabilities, including usability testing and things like that.

26:21 - To follow the European law, we have to post an accessibility statement.

26:26 - We could use help creating our accessibility statement.

26:30 - We can help you create an accessibility statement.

26:34 - We have a resource that explains the sections and background behind an accessibility statement; it has an example, a short one and a long one; and then it actually has a generator.

26:46 - You just put in your information, and it will generate an accessibility statement for you – that you can use as is, or edit further.

26:58 - Howdy! I need to write a report on website accessibility.

27:04 - If you haven’t looked at our introduction to web accessibility recently, I’d encourage you to take a look at that.

27:09 - We rewrote it a little while ago to really communicate a different approach – that accessibility is about enabling people with impairments, and avoiding creating disabilities, creating barriers.

27:27 - That web technologies are meant to be accessible.

27:31 - And if you’re doing things right, you are accessible.

27:35 - And if you’re not, you are keeping people from using your stuff.

27:40 - Take a look at that. I need help. I need help.

27:45 - I need help. We can help you. These are just an example of the things that we have.

27:52 - Somewhat often we get a question and we’re like, “Hey we have a resource for that. ” So I’d encourage you to take a look and see what resources we have on the WAI website that you find helpful or that you think other people might find helpful.

28:06 - And then share those with them. You can just skim around the whole site, yet maybe the easiest way is to look through the WAI Resources page.

28:15 - That lists all the main resources with a little description. That’s available from w3. org/WAI/resources We also have a free online course.

28:34 - About a year ago, we launched that, and it’s the free course on Digital Accessibility Foundations, (currently called Intro to Web Accessibility) That has five different modules.

28:45 - Of course, it talks about understanding how people with disabilities use the web.

28:50 - Has a module on business case planning and managing, and one going through WCAG, web content accessibility guidelines.

29:00 - Take a look at the free online course, and again, tell other people about it if you would.

29:08 - We expect to have that available longterm. And hopefully later this year, do an update including for WCAG 2. 2.

29:19 - How can I get notified of new WAI resources? Relatively recently, we started a WAI-announce list.

29:28 - If you were previously on the Interest Group list and you said, this is too much, we started it for those people who just want to get announcements and not a lot of other things.

29:38 - There are only a couple messages per month from me and other staff.

29:45 - I encourage you to sign up for the WAI-announce list.

29:51 - You can also subscribe to our Twitter or RSS feed.

29:56 - If you want to do that, from the WAI Home Page, the News section, and there’s a link to subscribe.

30:02 - This is good stuff. How can I help? We’d love for you to help.

30:07 - That’s what W3C is: bringing people together to help.

30:10 - We want input from people with disabilities, from people in organizations, from government, from around the world, with different perspectives.

30:19 - We encourage you, if you have comments on the resources on the WAI website, near the bottom, there’s a box: Help improve this page.

30:28 - There’s a link to an email address, and also even GitHub.

30:32 - So you can work and edit and do a pull request with your suggestions for existing document.

30:38 - If it’s one of the standards documents, then near the top, is the section: Status of this document, And that includes how you can comment.

30:48 - If you might be interested in more actively participating in these resources, take a look at our information about participating in WAI.

30:57 - Think about if you are able to make the time commitment and are inclined to do that type of work.

31:04 - We really, really want your help. (Shawn vocalizing) Right, I was filming her dad and she wanted me to film her, too.

31:12 - So I taught her how to say the word “accessible”.

31:18 - I want to make the web accessible. All right.

31:23 - We want you to, too. We want to include it in education for kids that age.

31:29 - And as soon as they’re learning about all this stuff, to learn about accessibility.

31:34 - We have a lot of resources on the WAI website to help you make the web accessible, and we encourage you to take a look at those.

31:44 - Thank you so much for taking the time to learn about making videos and remote sessions accessible to people with disabilities.

31:51 - I hope you learned some things, and I really hope that you will go to the WAI website to find out even more, and help us share this information, so others can, too.

32:00 - Thanks so much!.