Accessible Language Learning

Welcome to Accessibility in 5, a series from UFIT where we explore a quick tip on making your content more accessible in 5 minutes or less. I'm Stephanie and today's topic is making foreign language content accessible for students that need screen readers.

Learning a foreign language is difficult, but rewarding. To be able to make this experience accessible to screen reader users, we need to make sure to denote what language is being spoken on different parts of our Canvas pages and websites to ensure that screen readers can read the language being used with correct pronunciation. Not only do we want to do this just for the general good of our students, but it's also a requirement of WCAG 2.1 A and AA, parts 3.1.1 and 3.1.2. Here is a demonstration of the issue and fix it.

Hi everyone. So this is a quick demonstration of the situation that we discussed above in the email message post, wherever you're reading this, about needing to tag languages when they change on a page. So here is a page that has a bunch of different languages on it that should be read in the language that it is written in. However, this certain page has no tags. And the screen reader that I'm using to demonstrate this is JAWS.
So let's go ahead and take a look at what happens here.

Screenreader: Language is screen reader's test no tags colon 2024 [Incorrectly pronounced Spanish text]

Stephanie: This is Chinese. This is Japanese. This is Korean.

Screenreader: [Incorrectly pronounced Polish, German, French, and Icelandic text]

Stephanie: So as you can tell, the screen reader read them all with an English pronunciation. So it doesn't sound natural. It didn't even read some of the non-Romanized languages. And so when your students that are learning these languages need a screen reader, you really need to pay attention to making sure you tag the languages that are being used when you switch to them. So here's a page

Screenreader: languages and screen readers test colon 2024.Richardson languages and screen readers test colon 2024.
Richardson.

Stephanie: And this page does have the tagging. Which I'll show you what it looks like here after we listen to it. But let's go ahead and start listening. 

Screenreader: [Correctly pronounce text in Spanish, Chinese, Japanese, Korean, Polish, German, and French. Incorrect pronunciation of text in Icelandic]

Stephanie: And so this screen reader does not have Icelandic as a language. However, because it is tagged as Icelandic, it announced what it was before it tried to read it. So now let me turn JAWS off. So that way we can... So now that JAWS is off, let me show you what it looks like when you're editing. So when it's tagged, it actually says what language it is. And it has a box around the text that should be in that language. And in the HTML code, and this is not something we're expecting you to necessarily know how to do, but it's something to be aware of. This is where we denoted the language was with these paragraph tags. 

So if you have any questions, feel free to either reach out to your in-house instructional designer, or feel free to reach out to the Center for Instructional Technology and Training at citt@ufl.edu. 

Thanks for watching Accessibility in 5. You can find this video, as well as previous ones, archived in the resources section of the CITT website at citt.it.ufl.edu. Tune in next time to learn about other accessibility topics.