E-mail List Archives
Thread: Image alt text for multiple product views on retail websites
Number of posts in this thread: 5 (In chronological order)
From: Greg Jellin
Date: Wed, Sep 25 2019 5:26PM
Subject: Image alt text for multiple product views on retail websites
No previous message | Next message →
Hello friends,
I'm working on an interesting problem for a major retailer. Each product
detail page has several product view images in both thumbnail format and
large image. As is typical on retail product sites the expectation is
that users will select various product thumbnails and the main image
will be a larger version. To see an example of what I'm talking about
take a look at a random product on Target's website:
https://www.target.com/p/wrangler-men-s-button-down-shirt-gray/-/A-54587668?preselect=54501186#lnk=sametab
Notice that Target wraps each thumbnail image with an a button
containing an aria-label. The aria-label basically provides the name of
the product with "image x of x". The alt text on each thumb is null. And
the large version of the image also uses null alt.
I've investigated several major retailers (Walmart, Amazon, Zappos,
etc.) and they all have different techniques. None describe the details
of the images.
I'd like to hear your opinions. What is useful to screen reader users
here? If you can't see the images what would be an appropriate treatment?
Do you think that each thumb should be described in detail (i.e., "Front
view of man wearing Wrangler Button-Down Shirt")?
Should null alt be used across the board on these images?
Should the entire region be hidden from screen readers?
Thanks,
Greg
From: Mark Magennis
Date: Thu, Sep 26 2019 2:28AM
Subject: Re: [EXTERNAL] Image alt text for multiple product views on retail websites
← Previous message | Next message →
Hi Greg,
I have two immediate thoughts on this.
First, alt text is intended to give equivalent information. The information a person gets by viewing an image depends not just on the visual content of the image but on the user's purpose in viewing it. For example, "Front view of man wearing Wrangler Button-Down Shirt" might be good alt text on a stock photo library image because a user might be looking for images of men wearing particular types of clothes. But it is probably not good on a shopping site because you're not interested in what the image shows but on the nature of the item. So better alt text might be "Men's Wrangler Button-Down Shirt in brown and blue bold check pattern".
My second thought is who's going to write this alt text for all these products? Is it even feasible? Are they even likely to do a half decent job that gives the information that visually impaired users need? Do we even know what information these users do need (my example above may be quite wide of the mark)?
In practice it may be beyond the client's writing skills and resources to produce alt text any better than " Wrangler Button-Down Shirt" or whatever description is already attached to the product in the database, and this may well already be being used for the page heading anyway.
Don't want to put a downer on it, but worth considering.
Mark
Mark Magennis
Skillsoft | mobile: +353 87 60 60 162
Accessibility Specialist
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Greg Jellin
Sent: 26 September 2019 00:26
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: [EXTERNAL] [WebAIM] Image alt text for multiple product views on retail websites
Hello friends,
I'm working on an interesting problem for a major retailer. Each product
detail page has several product view images in both thumbnail format and
large image. As is typical on retail product sites the expectation is
that users will select various product thumbnails and the main image
will be a larger version. To see an example of what I'm talking about
take a look at a random product on Target's website:
https://www.target.com/p/wrangler-men-s-button-down-shirt-gray/-/A-54587668?preselect=54501186#lnk=sametab
Notice that Target wraps each thumbnail image with an a button
containing an aria-label. The aria-label basically provides the name of
the product with "image x of x". The alt text on each thumb is null. And
the large version of the image also uses null alt.
I've investigated several major retailers (Walmart, Amazon, Zappos,
etc.) and they all have different techniques. None describe the details
of the images.
I'd like to hear your opinions. What is useful to screen reader users
here? If you can't see the images what would be an appropriate treatment?
Do you think that each thumb should be described in detail (i.e., "Front
view of man wearing Wrangler Button-Down Shirt")?
Should null alt be used across the board on these images?
Should the entire region be hidden from screen readers?
Thanks,
Greg
From: Brian Lovely
Date: Thu, Sep 26 2019 6:29AM
Subject: Re: [External Sender][EXTERNAL] Image alt text for multiple product views on retail websites
← Previous message | Next message →
Hey Greg,
"man wearing..." is likely to not be useful if you're in the section of the
site devoted to men's clothing. Another way of looking at it is if every
picture description starts with "man wearing" is it really useful in
describing the purpose of any one unique image?
Mark is right in that (for clothing) the most important info is the style,
pattern, and color. For a vacuum cleaner or coffee maker, I would assume
the features are already described in text, so alt="Black and Decker Coffee
Maker Model 4598" is not really useful information that the user can't
already get from page content. Many of the images would best be hidden from
screen readers to reduce noise.
Again, if the style, pattern, and color of a garment is already provided in
page text, then the image is decorative and should be provided with an alt
attribute set to a null value.
It's a subtle art, and there's no one size fits all solution.
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
From: Greg Jellin
Date: Thu, Sep 26 2019 7:50AM
Subject: Re: [External Sender][EXTERNAL] Image alt text for multiple product views on retail websites
← Previous message | Next message →
Great feedback Mark and Brian! Really appreciate your time.
Mark, yeah, we are concerned about the feasibility of our client being
able to implement a solution that provides good, consistent, accurate
alt text. This client has 10s of thousands of products across many
sites. I don't believe they have the capacity to author alt text for
every product view. The most feasible scenario would be a programmatic
approach that pulls the product title/desc. from the database. I don't
think that would be very helpful for users.
And Brian, spot on. The relevant details of the product are all in text
form on the page. The title and description of the product, the
selected color (and color choices), etc.
Our goal here is to ensure we are providing what would be useful for
users and at the same time we are complying with WCAG. It is also
important that whatever our recommendation, it is feasible.
My hunch is that users will gain no benefit from providing alt text on
the various product views. I am considering recommending hiding the
entire product view feature from screen readers, as it appears that
Amazon does. All relevant information would be available in text.
Greg
On 9/26/2019 5:29 AM, Brian Lovely via WebAIM-Forum wrote:
> Hey Greg,
>
> "man wearing..." is likely to not be useful if you're in the section of the
> site devoted to men's clothing. Another way of looking at it is if every
> picture description starts with "man wearing" is it really useful in
> describing the purpose of any one unique image?
>
> Mark is right in that (for clothing) the most important info is the style,
> pattern, and color. For a vacuum cleaner or coffee maker, I would assume
> the features are already described in text, so alt="Black and Decker Coffee
> Maker Model 4598" is not really useful information that the user can't
> already get from page content. Many of the images would best be hidden from
> screen readers to reduce noise.
>
> Again, if the style, pattern, and color of a garment is already provided in
> page text, then the image is decorative and should be provided with an alt
> attribute set to a null value.
>
> It's a subtle art, and there's no one size fits all solution.
>
> >
>
>
> The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
>
>
>
> > > >
From: mhysnm1964@gmail.com
Date: Thu, Sep 26 2019 2:57PM
Subject: Re: [External Sender][EXTERNAL] Image alt text for multiple product views on retail websites
← Previous message | No next message
Descriptions of products does not necessarily help the screen reader user as well. Using the example, what is the cut of the shirt, does it have pockets, does it have buttons on the collar, ow big is the pattern, what type of weave, ETC. Not sure how this can be handled in a shopping situation as this is a big gap as I can see it.
Even electronics they don't describe the product in a way you get a feel for what it looks like and if that is a component of your decision. Then you could buy something that doesn't fit your notion of Essenics.
Sean
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Greg Jellin
Sent: Thursday, 26 September 2019 11:51 PM
To: = EMAIL ADDRESS REMOVED =
Subject: Re: [WebAIM] [External Sender] Re: [EXTERNAL] Image alt text for multiple product views on retail websites
Great feedback Mark and Brian! Really appreciate your time.
Mark, yeah, we are concerned about the feasibility of our client being able to implement a solution that provides good, consistent, accurate alt text. This client has 10s of thousands of products across many sites. I don't believe they have the capacity to author alt text for every product view. The most feasible scenario would be a programmatic approach that pulls the product title/desc. from the database. I don't think that would be very helpful for users.
And Brian, spot on. The relevant details of the product are all in text form on the page. The title and description of the product, the selected color (and color choices), etc.
Our goal here is to ensure we are providing what would be useful for users and at the same time we are complying with WCAG. It is also important that whatever our recommendation, it is feasible.
My hunch is that users will gain no benefit from providing alt text on the various product views. I am considering recommending hiding the entire product view feature from screen readers, as it appears that Amazon does. All relevant information would be available in text.
Greg
On 9/26/2019 5:29 AM, Brian Lovely via WebAIM-Forum wrote:
> Hey Greg,
>
> "man wearing..." is likely to not be useful if you're in the section
> of the site devoted to men's clothing. Another way of looking at it is
> if every picture description starts with "man wearing" is it really
> useful in describing the purpose of any one unique image?
>
> Mark is right in that (for clothing) the most important info is the
> style, pattern, and color. For a vacuum cleaner or coffee maker, I
> would assume the features are already described in text, so alt="Black
> and Decker Coffee Maker Model 4598" is not really useful information
> that the user can't already get from page content. Many of the images
> would best be hidden from screen readers to reduce noise.
>
> Again, if the style, pattern, and color of a garment is already
> provided in page text, then the image is decorative and should be
> provided with an alt attribute set to a null value.
>
> It's a subtle art, and there's no one size fits all solution.
>
> >
>
>
> The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.
>
>
>
> > > archives at http://webaim.org/discussion/archives
>