Descriptive transcript
Visual: An example lesson from a Rise course. The lesson ‘Link purpose in context’ includes a series of bullet points which all include text about different links used in the lesson. Each bullet point with text includes a link that says ‘Find out more’.
Kirsty: Hi, I’m Kirsty Wolf and I’m an accessibility tester for eLaHub. And I’m here today to talk about links, and to talk about how they can be designed in a way that’s more useful for me, but also for other people. Because one of the good things about designing accessible content is that if it’s good for me, it’s probably going to help some other people as well.
So, I’m using a screen reader. I’m using JAWS and I’d like to demonstrate some of the challenges that I encounter when people have designed learning content that contains links. And also to show you some good practice as well.
So most people know that the screen reader will read the information from the page, but it also has inbuilt functionality that you may not be aware of. This is particularly relevant in relation to links, because it can also bring up a list of the links that are on the page. Not all screen reader users use this, some use it more than others, but it can be particularly helpful if you have a page with a lot of links, because then you can find what you’re looking for more easily.
However that only works if the links have been labelled well, because the point of labelling a link is to tell you where it’s going – you know – what’s going to happen when you click that link. And one of the common mistakes that I come across, and that I’ll show you today, is when people just say ‘Find out more’. Because if you have a link that says ‘Find out more’, unless you’ve read what comes before that, you don’t know what you’re going to find out more about. And if you have a list of links, then all that text is removed, so you just have a list of ‘Find out more’, ‘Find out more’, and that’s a bit confusing and also a bit tedious. And to be honest, it’s one of the reasons why I don’t use this feature sometimes because I know that people like to label their links ‘Find out more’, or ‘Go here’ or things like that. And that’s not very helpful. But I’m going to show you now, we have a page here with some content on it and if you just read down the page it does make sense. So we have a piece of text here…
JAWS (Job Access With Speech screen reader): ‘Designing accessible… WebAIM gives a great overview of keyboard accessibility including some common keyboard shortcuts and additional guidance. Designing accessible learning content programme accessible links. Link. Find out more. Opens in a new tab.’
Kirsty: OK, it’s good here that it says ‘Opens in a new tab’ – that’s a good thing to do, because then we know that we’re going to leave this page and have a new tab. But then the next one, you’ve got some more text here…
JAWS: ‘If you’re not sure how keyboard accessibility looks in action W3C’s accessibility overview has a useful video demonstration. Link. Find out more. Opens in a new tab.’
Kirsty: OK and that’s also ‘Find out more’, but it’s the same. So if you’re reading down here, it’s not such a deal breaker because you’re reading the text, and you know for each one.
It’s a bit repetitive, but you know what it’s in relation to. But for anyone who uses the special JAWS feature that can bring up a list of links – I’m just going to do that now. You probably won’t see very much, but there’s a keystroke and it will bring up all the links that are available on this page.
Visual: An image of the ‘Elements List’ dialogue box from JAWS is shown. The type ‘Links’ has been selected, so that all of the links on the page are listed. The list consists of four links which all say the same ‘Find out more (opens in a new tab); visited’.
We return to the original image of the lesson in Rise, with a small visual of the ‘Elements List’ also shown to one side.
Kirsty: OK, here we have, ‘Find out more’, ‘Find out more’, ‘Find out more’, ‘Find out more’… I have no idea what that’s about. But if they were labelled intuitively, with labels that had something to do with what you would be linking to, it would be easy to use this links list, and to find out more about the thing you actually wanted to know about.
Visual: An example of another lesson from a Rise course, this time including a bulleted list where each visible link is provided with a unique label.
Kirsty: So this is a different page, and I would like to show you with this page how to do it in a better way. So, I wouldn’t say the other page was completely inaccessible, but the more links you have that say ‘Find out more’, ‘Find out more’, that becomes quite tedious. And it can also be quite difficult for somebody who has pulled up the links list because they can’t use the links list essentially, because unless you click on every one to see where it goes. That’s a very time-consuming way to get information. So this page here is better, because we have a link. I’m just going to move JAWS’ focus down onto the link…
JAWS: ‘Follow the link. WebAIM keyboard accessibility overview. Opens in a new tab.’
Kirsty: OK, you know exactly what that is, we have some more information about it underneath it if we want to… to find that out… a bit more, but the link itself tells you exactly what’s going to happen when you click on that link.
JAWS: ‘Follow the link. WebAIM keyboard accessibility overview. Opens in a new tab.’
Kirsty: So that’s useful for me if I’m just reading the page normally. That’s also useful for any other users. They don’t have to be JAWS users or access technology users, everybody knows what’s going to happen with that link. And similarly, when you move on to the next one…
JAWS: ‘Follow the link W3C keyboard compatibility overview. Opens in a new tab.’
Kirsty: Yep, that’s different from the first one, and you know what it does, and then just scroll to the final one.
JAWS: ‘Assistive technology and switch users. Opens in a new tab.’
Kirsty: So if you were looking specifically for something about access technology and switch users, you would know by moving the focus to this link that that’s what is behind this link, that’s the destination, that’s what you’re going to find out.
So that’s doing it this way, but the other way is also using the links list and I’m going to show you that now. So if we just open up the links list…So now…
Visual: An image of the JAWS ‘Elements List’ dialogue box is shown. The type ‘Links’ is selected and a list of all the available links on the page is shown. Each link has a unique label. We then return to the previous image of the lesson from the Rise course with a small visual of the ‘Elements List’ also shown to one side.
JAWS: ‘W3C Keyboard compatibility overview. Opens in a new tab. Assistive technology and switch users. Opens in a new tab.’
Kirsty: And there’s another one. So you can, you don’t need to have all the text around these links to know where these links are going to take you if you decide to use the links list. And that’s helpful because especially if there are a lot of links on the page some people do that because they want to get to the information faster. I’m just going to come out of there now.
JAWS: ‘Escape.’
Kirsty: So this shows why it’s better for me, better for people who rely more on the links list, and better for everyone if you give your links a clear label and let people know where they’re going to go if they click on that link.
Visual: Another lesson from a Rise course. This time the bulleted list includes a number of visual links, each displayed as the full URL destination.
Kirsty: One final thing that I’d like to talk about in relation to links, is about putting the full URL in the link text, because that’s really not very helpful.
Sometimes people give their links good URLs, but sometimes they’re really obscure. Sometimes they have the date if it was an article, sometimes they have a lot of additional information, and that’s all going to be read out by the screen reader if you put the full URL as the destination.
So we have an example here. These are quite intuitive, but they’re also quite long and these are some shorter links, there are other links that are way longer. But listen to how long it takes for JAWS to read this…
JAWS: ‘Link https WebAIM org techniques keyboard. Opens in a new tab.’
Kirsty: And another one…
JAWS: ‘Link https www w3 org WAI perspectives videos keyboard. Opens in a new tab.’
Kirsty: And you’re lucky, because these ones, my JAWS is set to not read all the additional punctuation. Sometimes people’s JAWS will read ‘https, colon, slash, slash, www, dot…’, so all the punctuation as well, and that will take even longer than mine did. But mine was still quite tedious as it read through the whole URL. And that doesn’t actually tell you where it’s going. It doesn’t tell you what will happen if you click on that link. So it’s better to write clear text for your link destination to know where people will be going. Because otherwise, they will have to listen to something like this…
JAWS: ‘https www group com articles keyboard accessibility. Opens in a new tab.’
Kirsty: And that takes time to do that. And the more time that somebody has to take, the longer it will take them to complete your learning. And that can also affect how engaged they are with the learning. Because if you make it easy for them by not making them listen to a lot of additional information that they don’t actually need, or that doesn’t add value, then they’re more likely to be engaged with your content.
Because my JAWS here is quite slow. I tend to have it faster, but some people have it at this setting. And then it takes a very long time to read through all these URLs. And it can be quite tedious, because you still don’t know what’s going to happen when you click the link.
So that’s why it’s good to always think about what you want people to know, what they’re going to do, what they’re going to access when they click each link, and to make that clear and intuitive in the text that you write for the link’s destination.
Recent Comments