Shirtee.cloud Blog

Alt text for product images: Give every view a useful description

Useful alt text explains the relevant information in an image at that particular point on a product page. Do not describe every photograph with the same product name. A front view, a back design and a close-up answer different questions. Also distinguish what is visible, what the image does and which properties require verified product data.

Cover image: AI-generated illustration of three views of a fictional shirt with moon and mountain motifs. It shows an editorial example, not an available catalogue product or a real store interface.

Establish the image's purpose first

The W3C WAI guidance on informative images focuses on the information being conveyed. For a product gallery, the first question is therefore: What additional information does this photograph provide? Write the alt text from that purpose and the image actually shown.

Our original example is a fictional dark green shirt. A small light-coloured crescent moon appears on the front, with a larger mountain drawing on the back. A third image shows the mountain lines more closely. This example does not describe a Shirtee product variant; it compares three different image purposes.

Start by assigning a short purpose to each image: identify the front, assess the back motif, see the linework in detail. If you cannot explain a difference between two images, consider whether both are needed in that page context or whether they repeat the same information.

Three views need three descriptions

A working register connects each image file to its intended text. The following wording is original to the gallery described here:

View Original alt-text suggestion Deliberately not claimed
Front Dark green shirt with a small light-coloured crescent moon on the left chest. Material, fit or included items
Back Back of the dark green shirt with a large light-coloured mountain drawing. Exact print dimensions or printing method
Detail Close-up of the light-coloured mountain lines on dark green fabric. Durability, feel or certification

Here, “left” means the wearer's left chest. Directional descriptions should agree with the actual view. If direction is irrelevant to the information or cannot be confidently determined from the photograph, leave it out instead of inventing an exact position.

A close-up may show a line, but it does not establish wash durability. Similarly, the appearance of a fabric surface does not reliably identify its composition. Those facts belong in the visible product description, based on verified product data. This keeps alt text specific without turning it into hidden advertising copy.

Keep colour, view and language aligned

Record the corresponding variant for every actual image file. If a cream version is substituted later, its description must match. Changing an image while leaving its alt text untouched can introduce false information even when the text was correct for the previous photograph.

For a bilingual page, use a shared record containing image identifier, variant, purpose, German alt text and English alt text. The German version of our back-view description could be: “Rückseite des dunkelgrünen Shirts mit großer heller Bergzeichnung.” It describes the same view without introducing another property.

Translate the information in the image rather than blindly translating its filename. An identifier such as gallery_v4_back helps internal organisation but tells customers little. Keep the identifier in your working register and write the description in ordinary language.

When empty alt text can make sense

Not every image adds information. The W3C WAI guidance explains empty alternatives for purely decorative elements. Context determines the decision: Does the image communicate something otherwise missing, or does it serve only a visual decorative purpose?

Empty alt text is therefore a deliberate choice. A forgotten field is not a documented decision that an image is decorative. Record the reason in your image register. For an important back motif that is not described anywhere else, “decorative” would not be a convincing explanation in our example.

Images with a function need separate consideration too. When an image alone acts as a link or button, its text alternative should reflect the action's purpose, as explained in the W3C WAI guidance on functional images. Review the finished gallery and its controls, not just isolated image files.

Saved content still needs an output check

After adding the images to your store, inspect the real product page. Open the relevant language and select the variant concerned. Check which image actually appears and which alternative text reaches the rendered image or its accessible representation. A completed spreadsheet or CMS field does not prove that output.

Record the result for each image: correct file, matching language, matching variant and transferred text. If the output is absent or different, document the affected page and image identifier for technical investigation. Do not replace this content review with a general “upload successful” result.

The Google image guidance recommends useful, contextual descriptions and cautions against overloaded keyword lists. This does not establish a particular search ranking. The objective is to make the image's information understandable in words too.

The general guide to helpful product pages places imagery within the buying decision. An individual image register takes the process further: every view gets a clear purpose, an appropriate description and a check against the actual output.