Visual and Non-visual Experiences

[00:00:00]
>> So, the visual and non-visual experience, as we are getting more digging into accessible names and labels, we have to think about what's visible, and what are we trying to put in our labels and things? And my main motivation in talking to you right now about this is to caution you.

[00:00:22]
There's a temptation to want to craft the perfect label in a screen reader when it reads something like 2,154. But that's a weird way to announce a street number on an address. Or it's like you expect it to be read a certain way, but the screen reader is just literally spitting out the numbers.

[00:00:43]
That would be weird for a phone number if it was like, 300,110, 456. You'd be like, wait, that's a phone number, why is it reading it like that? Should I make a label that crafts it so that it announces it the right way? Don't do it. [LAUGH] It's a waste of time because a lot of that stuff is configurable in the screen reader, so save your effort and just let it announce what it's gonna announce.

[00:01:13]
This is a case where we can try too hard to fix stuff, and we're fixing it cuz we think it needs to be fixed. Let that come up in an audit or something. Give it a label, make sure all the basics are there. Just yeah, something to deprioritize is trying to craft the perfect label cuz you'll chase it forever and probably end up with something worse.

[00:01:34]
And there's an article in here from Adrian Rosselli on this. It's called Don't Override Screen Reader Pronunciation. And I see this as a topic a lot that people are talking about in the community of like, how do I get it to read out better? It's like, well, just don't bother.

[00:01:49]
[LAUGH] Just let it announce how it's going to announce. Let the screen reader do what it's supposed to do, and let the users configure it or make sense of that. So yeah, it's like we wanna fix it. Sometimes it's just not our place. So some screen reader commands and interaction modes.

[00:02:11]
So we've talked a lot about screen readers, we haven't fired one up yet, so now is our chance. We've got some tips and commands for using various screen readers in here. There are cheat sheets in here, so this should help you do some actual testing. These little details and summary elements all have more information.

[00:02:33]
The VoiceOver one is probably the most complete in terms of how to navigate. But they all, all of these little widgets have cheat sheets in them, which are things that you could share with your team, anyone who's getting started with screen reader testing, you can follow these. You can also print out this PDF of it.

[00:02:51]
I've put that next to my desk so that I can just look at it or at least keep it downloaded. They have a great note here that VoiceOver works best with Safari. It can work with Chrome or Firefox a little bit better than it used to, but we don't wanna file bugs against Chrome and VoiceOver when they're fine in Safari.

[00:03:11]
It's kind of like, we don't want to prioritize things that aren't where the users are. So we wanna make sure that we look at VoiceOver and Safari together. We don't wanna prioritize filing bugs against Chrome in VoiceOver if they work fine in Safari. Because we could be kind of, I don't know, it's not something we wanna spend time on if it's not really a user issue, cuz that's not where the users are.

[00:03:36]
So that's the VoiceOver one. VoiceOver works with key command combinations. So you hold Ctrl+Option and U, or Ctrl+Option, and right arrow, whereas NVDA and Windows screen readers work very differently. So, I talked about setting up a virtual machine. I'm gonna start mine in a second and you'll see how it looks.

[00:04:02]
But there's some info in here with cheat sheets. There's a how to on how to use parallels on a Mac. And so let's talk about Windows.