Reviewed October 23, 2026

Making Size Guides and Fit Tools Accessible

Size charts hidden in image popups lock out the shoppers who need them most. How to publish fit information everyone can actually use.

The image chart problem

The classic size guide is a photograph of a chart, opened in a popup, unreadable by screen readers, unzoomable without blurring, and gone the moment a keyboard user tries to reach it. It is also the single most decision critical document on an apparel product page, which makes its inaccessibility a conversion problem as well as an access problem.

Republishing the same numbers as a real HTML table fixes most of it in one move. Tables are navigable by screen readers, searchable, translatable, and zoomable without quality loss. The image can stay for sighted shoppers if the table exists alongside it.

Popups that everyone can open and close

The size guide link itself must be a real button or link reachable by keyboard, labeled with its purpose rather than an icon alone. When the dialog opens, focus should move into it, stay inside it while it is open, and return to the guide link when it closes with Escape or the close button.

Those focus behaviors sound technical, but shoppers feel them directly. A screen reader user whose focus is dumped at the top of the page every time they close a size chart will simply stop checking sizes, and unchecked sizes become returns.

Measurements in more than one form

Give measurements in inches and centimeters, and say what body measurement or garment measurement each number represents. A chest number that might be the body or might be the shirt is a guessing game that disabled and non disabled shoppers lose equally.

Fit notes in plain language carry real weight: runs small, relaxed through the waist, size up between sizes. Written by a human who has handled the garment, these sentences do more for confident ordering than a precision chart nobody trusts.

Fit finder tools and quizzes

Size recommendation quizzes must work without drag interactions, must not rely on color alone to show selections, and must give their recommendation as text a screen reader announces, not only as a highlighted box on a model image.

If your fit tool is a third party widget, test it with a keyboard and a screen reader before renewal, and put its accessibility in writing with the vendor. A tool that decides sizes for a large share of orders cannot be the least accessible element on the page.

Related reading

If this topic is useful, these earlier guides go deeper on connected questions: Alt text for product bundles and gift sets without the clutter, Accessible store locators: maps that work without a mouse, and Captions for product videos: making demos usable for everyone.

Frequently asked questions

Why is an image of a size chart not accessible?

Screen readers cannot read numbers inside an image, and the image blurs when enlarged for low vision shoppers. Publishing the same data as an HTML table makes it available to every tool shoppers use.

Should the size guide open in a popup or on the page?

Either can work. An inline expandable section is simpler to make accessible. A popup needs correct focus handling, an Escape close, and focus returning to the link that opened it.

Do I need both inches and centimeters?

Yes for any store with international shoppers, and it costs nothing to provide. Label clearly whether numbers are body measurements or garment measurements, because mixing the two is the main source of size errors.

How do I test my fit quiz for accessibility?

Complete it using only a keyboard, then with a screen reader, checking that every question, selection, and the final recommendation is announced in text. Any step that needs a mouse is a step some shoppers cannot take.