Making Product Reviews and Star Ratings Accessible
Star ratings that announce as 'button button button', review forms that eat errors. How to make social proof usable by everyone.
Reviews persuade sighted shoppers at a glance: four and a half stars, two hundred ratings, a wall of five star comments. For a screen reader user, the same section often announces as a row of identical 'button' controls, a score with no text, and a form whose errors appear somewhere they will never find. The social proof is there. It is just not addressed to them.
Reviews sections are usually app rendered, which is why they escape theme level fixes. This guide covers what to check in a reviews widget, how ratings should be exposed as text, and how to make writing a review as accessible as reading one.
Stars are data, so expose them as data
A rating is a number with a denominator, and it should exist as text: 'Rated 4.6 out of 5, based on 212 reviews', announced once, near the product title and again at the reviews section. The star graphic then becomes decoration, marked as such, instead of the only carrier of the information. Shoppers comparing products by rating are making a decision on that number; it cannot live exclusively in an image.
Check how the rating input behaves in the review form, because that is where the famous failure lives: five star icons, each a button, none labeled. A keyboard user tabs through five identical stops. A screen reader user hears 'button, button, button' with no values. The accessible pattern labels each option, 'Rate 1 star' through 'Rate 5 stars', ideally as a proper radio group, because that is what it is.
Reading reviews: order, filters, and media
Sorting and filtering controls are the section's steering wheel. Sort menus, 'verified buyer' filters, and search within reviews all need labels, keyboard operation, and announced results: when a filter changes the list, the new count should be announced politely, or the change is invisible to the person who requested it. Pagination and load more buttons need names that say what loads, 'Show more reviews', not 'More'.
Customer photos and videos in reviews need the same treatment as your own media: alt text or a caption describing the image, and video with controls a keyboard can reach. A review photo with no description is a testimonial half the audience cannot read, attached to the product it was meant to sell.
Writing a review: the form is the barrier
Stores test reading reviews and forget the submission form, which is where the harder barriers sit. Required fields identified by color or an asterisk image alone. Error messages that appear as a red banner listing problems without naming the fields, unconnected to the inputs they describe. A photo upload control that is a styled div no keyboard can operate. Each one quietly selects who gets to leave reviews, and therefore whose experience the next shopper reads about.
Walk the form with a keyboard and submit it empty on purpose. Every error should be text, tied to its field, and reachable in a sensible order. Then submit it with one error at a time. If your own walkthrough is frustrating, that is the review your store is asking assistive technology users to write, and most will not.
Choosing and configuring the app
Since an app renders the section, the buying questions matter: does the vendor expose ratings as text, label the rating input, and announce filter changes? Can you test their demo store with a keyboard in ten minutes? Vendors who have done the work answer quickly and specifically. Vendors who have not say 'we are fully compliant', which is a sentence, not evidence.
Configuration within the app helps too: turn on text summaries where offered, avoid star only display modes, and keep the section's heading structure in order with the rest of the page. After install, add the reviews section to your standing checks. It changes when the vendor ships, like every app surface, and it carries an outsized share of the persuasion on the page.
Related reading
If this topic is useful, these earlier guides go deeper on connected questions: Accessible Store Locator Pages: Maps, Lists, and Directions, Accessible Preorders and Back in Stock Signups on Shopify, and Accessible Product Comparison Tables: Grids That Work Without a Mouse or Perfect Vision.
Frequently asked questions
How should a star rating be exposed to screen readers?
As text: the score, the scale, and the count, such as 'Rated 4.6 out of 5 based on 212 reviews'. The star graphic becomes decoration. Any shopper making a decision from the rating needs the number itself, not a picture of it, and the rating input in the review form should be a labeled radio style group.
Why does the review form matter as much as the display?
Because inaccessible forms decide who can contribute. Unlabeled rating inputs, errors not tied to fields, and keyboard unreachable upload controls block assistive technology users from leaving reviews at all, skewing the social proof every later shopper reads. Test the form empty and with deliberate errors, keyboard only.
What should we ask a reviews app vendor?
Whether ratings are exposed as text, whether the rating input is labeled per option, whether filter and sort changes are announced, and whether you can keyboard test their demo. Specific answers indicate real work. A blanket 'fully compliant' claim with no specifics indicates the opposite.
Our reviews are app rendered. Can we fix anything ourselves?
Yes: display settings that add text summaries, avoiding star only modes, heading order around the section, and your own QA and vendor pressure. Where the widget itself is the barrier, a documented vendor ticket and a timeline are the store's evidence of diligence, and a factor at renewal.