54
accessibility
also a11y
Keyboard, names, contrast, motion. If you cannot tab to it, it is not a button.
What is accessibility?
Accessibility is whether people can use the thing: screen readers, keyboards, low vision, vestibular motion. Labels, roles, focus, contrast, hit targets.
Why does accessibility matter when vibe coding?
Models emit pretty divs with click handlers and no button role. They skip labels on inputs. They animate everything. You will not see it. A keyboard user will.
How do you do accessibility?
Tab through the flow. Every control 44px on touch. `:focus-visible` rings. `prefers-reduced-motion`. No `outline: none` without a replacement. Ask for an axe scan on the slice.
How do you ask a model for accessibility?
This slice must be usable with a keyboard only. Real buttons, labelled inputs, visible focus, no outline:none. Hit targets 44px on small screens. Honour prefers-reduced-motion.
What goes wrong with accessibility?
`aria-label` on everything as perfume. Prefer visible text. ARIA is for when the text is not there.