Ratings
Radio buttons underneath, dressed as stars. That way the arrow keys work, the value is announced, and the control submits with a form — none of which a row of clickable icons gives you.
Pick one
click, or tab to it and use the arrow keys
Several
a short survey
Showing a score
read only, so it is text and not a control
-
Ferrow Manufacturing
Pays in 21 days, never late in two years.
-
Northwind Trading
Reliable, occasionally a week over.
-
Kestrel Logistics
Slipped to 44 days on the last three.
Why radios
- The arrow keys move between the values, because that is what a radio group does. Nothing here implements that.
- A screen reader says “4 of 5, radio button, selected” — the star shapes are hidden from it entirely.
- It posts with the form under its own name, with no script at all.
- The focus ring is on the star, drawn from the real input's focus state with
peer-focus-visible.