Posted on by Henny Swan in Testing, User experience
When conducting usability testing with disabled users, we observed how well images performed from both a visual and non-visual perspective when it came to finding and understanding content.
We often think of accessible images as having alt attributes with appropriate text descriptions for people who can not see or understand them.
What gets overlooked is whether the visual content of the image is appropriate to the context of use for people with sight. Equally, if the text description fits in to the flow of adjacent content.
Six people with disabilities were invited to test a news website on a desktop. Participants included:
Each participant was asked to find an article about disability on the homepage and by using search.
Each article consisted of an image, heading and text presented in that order both visually and in the code. The image was positioned on top as a rectangle, the heading underneath, followed by a date and name of the author, then short text introducing the topic.
In most cases, the heading stretched over two to four lines and was roughly 10 to 17 words. Most, possibly all, of the images were stock photos.
When the visual content of the image and its text description did not complement the heading it was grouped with, it negatively impacted people's understanding of the page.
For example, when looking for an article about disability, our participant with dyslexia and ADHD didn't read the long headings. Instead they looked at the images for context but couldn't find any about disability:
It's helpful with the imagery for articles but I'm not necessarily sure that pictures actually go with the titles that much. For me images are always helpful to sort of sum up what something is about quite quickly [...] but some of them don't really seem actually relevant.
Our participant who was browsing with speech recognition and had ADHD didn't connect the visual content of the image with the heading and commented:
The picture seems artificial; I guess it's a stock photo.
Similar issues were experienced by both screen reader users, who said text descriptions of images often did not convey any useful information. As one commented:
The description just says 'diversity', what does that mean? It tells me nothing about that graphic.
Both screen reader users commented on the inconsistent quality of text descriptions.
Some text descriptions gave context, for example, "A disabled woman at work" for an article about disability at work. Other text descriptions were just a single word which was not helpful:
A graphic called covid is amusing. What picture is that!
The other screen reader user, mentioned inconsistent text descriptions. They also noticed some images didn't have a text description and commented the experience was "disjointed".
Other images were followed by a caption, so blind participants knew an image was on the page but could not tell what it contained. They found this annoying and made them wonder what content they were missing:
The images on news articles are often not labelled. It just says "getty image istock" or whatever, it doesn't say what the image is a picture of.
On the search results page, images preceded the heading it was associated with which caused one of the two blind participants to navigate to the wrong article.
Wondering what the image with a text description "diversity" contained and referred to, he decided to read the related article. Instead of selecting the article title that followed the image, he selected the one that preceded it, and never realised his mistake.
Decorative images do more than just decorate a page, they also provide context, regardless of whether you can see an image or not.
Our key research insights are:
Read more about moderating usability testing sessions, analysing findings and how we can support you with our Agile Usability testing service.
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。