What should alt text say on a linked product card?

Read the card as a control

For a fictional lamp card, the product name may already be a visible linked heading. A second linked image can create repetition if its alternative says the same thing without adding information. In another layout, the image may be the only link, so an empty alternative can leave the destination unidentified.

W3C WAI distinguishes image alternatives by purpose. Use its decision guidance with the actual component markup. A writing worksheet cannot establish that a theme or assistive technology announces the card correctly.

Inspect the information roles

Ask the developer how the image and heading links are implemented. Avoid inventing a universal alt string before that relationship is known.

Keep claims out of the alternative

Describe verified visible features where they help the task. Do not stuff the alternative with keywords or claims such as “best-selling” unless those facts are relevant and established. A blind visitor deserves the same accurate product information as a sighted visitor.

Verify the actual component

Have the developer or an accessibility reviewer inspect the accessible name and link behavior in the draft store. Review repetition, destination clarity and keyboard operation. CartVisual does not install alt text in your theme. Use asset naming for the handoff and complex diagrams for longer explanations.

A component-level example

A fictional card contains a lamp image and the visible product title. Ask the developer whether they form one link or two separate controls. If the image is the only named link, its alternative needs to identify the destination. If the combined control already has a clear title, review repetition and any additional useful visual information. Verify the actual accessible name in the draft implementation. This exercise cannot be completed from the JPEG alone, because the surrounding text and link structure determine what the image is doing.

Two simplified handoff examples use the same fictional destination. Image-only link: <a href="/products/luma"><img src="lamp.jpg" alt="Luma desk lamp"></a>. Combined link whose image only repeats the title: <a href="/products/luma"><img src="lamp.jpg" alt="">Luma desk lamp</a>. These are escaped examples for a developer, not live links or a tested store component. They assume no additional ARIA labeling overrides and no extra information conveyed by the picture.

WAI’s functional-image examples distinguish an image alone in a link from an image supplementing text inside the same link. A visible title in a separate neighboring link does not name the image-only link automatically. If two controls remain, verify both names and destinations; do not leave the first unnamed just to avoid repetition. If the image supplies a relevant finish or variant detail absent from the combined title, review that additional information instead of applying empty alt mechanically. Inspect the final accessible name and keyboard focus order in the actual implementation; the snippet alone proves neither.