Insite Access Video Demo Transcript
Reviewer: Hi, today we’re taking a look at a table. This is a size chart for a pair of gloves on the website of a sporting goods company, and we’re doing an accessibility review, a demo, using JAWS 2025 as a screen reader as well as Windows 11 and Google Chrome on a Hewlett Packard laptop. I’m beginning with my focus in the cell that is at the intersection of the column and row headers, and with my JAWS commands, I’m going to be navigating using the control and the alt key which I’m holding down with my left hand, and on the external keyboard that I’m using, I’m going to be pressing left and right, up and down arrows with my right hand on the number pad.
So let’s navigate horizontally across this top row:
Screen Reader: [S M L XL XXL column 6]
Reviewer: I hear that xxl is column six
Screen Reader: [End of row]
Reviewer: and there’s nothing there after that.
Screen Reader: [XL column 5 L M S XS column 1 beginning of row]
Reviewer: So extra small seems to be the smallest size. If I down arrow through column 1:
Screen Reader: [Length row 2, Hand Circumference row 3]
Reviewer: I get the row headers. And as I up arrow, you’ll hear a curious thing:
Screen Reader: [Length row 2 xs row 1]
Reviewer: It appears that xs, extra small, is the column header that is on top of Length and Hand Circumference. I would expect to find some measurements under that. If I go down to Length:
Screen Reader: [Length row 2]
Reviewer: and I right arrow:
Screen Reader: [S 6-6.75 column 2]
Reviewer: this is more what I would expect
Screen Reader: [M 6.75-7.5 column 3]
Reviewer: One very good thing about this chart is that as I right arrow, you will hear that the column header, in this case size, is being very clearly announced, followed by the content of the cell, which are the measurements, followed by an announcement about the column that I’m in. As a blind user who cannot see this visually, it’s very easy to get lost in a chart, even a small one. I appreciate the time that the web developer has spent, and I can tell that they have made some effort to make this an inclusive experience. And that’s very common on websites. You’ll find that there are some strengths from an accessibility perspective, and there may also be some areas for improvement,. Because almost no page is going to be perfect.
I think that this particular company has an explicit commitment to being inclusive. Their mission statement includes information about athletes with disabilities and how they aspire to help everyone, regardless of their physical ability, to enjoy the outdoors. So I appreciate that, and it builds a lot of brand loyalty for me when I can see these little details that have been paid attention to. Let’s continue to navigate to the right:
Screen Reader: [L 7.5-8 column 4, XL 8-8.5 column 5, XXL 8.5-9 column 6.]
Reviewer: Now, that should be the last column, but if I arrow once to the right:
Screen Reader: [9.0 dash 9.5 Column 7]
Reviewer: I’m hearing additional content, which makes me think that perhaps if I up arrow I’m going to hear XXXL?
Screen Reader: [Top of column]
Reviewer: But in fact there’s nothing there. When I use my home key to get back to the first cell:
Screen Reader: [XS column 1, row 1]
Reviewer: The presence of the XS above Length, coupled with what appears to be a blank header above column 7, leads me to believe that all of these sizes are shifted one to the left.
That causes me to be a bit concerned about how certain I will be if I place an order based on what auditorily seems to me to be the proper size. Using the web content accessibility guidelines, WCAG 2.1 AA as a technical standard, I would think this may be a perceivability error. It sounds like it might be a 1.3.1 Information and Relationships issue, because the information that I’m hearing auditorily may be just a little bit different than what is there visually, because I think visually there is a blank spot between the column and the row headers at that intersection in the upper left-hand corner of the table.
One reason that this is significant is because when customers experience that little bit of hesitation and uncertainty, it has consequences. Of course being able to order something online is a wonderful convenience for anyone, but for a person who is blind such as myself, I don’t drive. To be able to order something and have it sent to my home is an amazing thing about the times we live in. And if I am concerned that I might get something that doesn’t fit, that means I might need to make a trip to exchange it anyway. Perhaps a person is planning for a trip this weekend and they don’t have the time to make an exchange. Going down to make an exchange means that they might have to get into an Uber and incur some additional transportation expenses, and they’d need to do that during working hours instead of doing it in the evenings when they might have a little bit more free time. In that case, a person might abandon the cart and go to a competitor, and place an order there.
I think that you would want to take a look at this chart, and I would begin by looking at WCAG 1.3.1 Information and Relationships, to see what information you can get there. And then go up into that upper left-hand column, that first cell, and try putting some content in there, just a word like “size,” and see if that will perhaps cause everything to shift right. Thank you.