How to fix select name on Squarespace
Add a visible or programmatic label to every `<select>` dropdown so assistive technologies can announce its purpose to users.
Steps for Squarespace
- Squarespace controls most form and product option HTML; you have limited direct access. Navigate to Pages → the page containing the dropdown, then open the block/section editor.
- For Squarespace Form blocks: click the form block → Edit → click the dropdown field → ensure the 'Label' field is filled in. Squarespace renders this as a visible label linked to the field.
- For product option dropdowns (Commerce), go to Commerce → your product → click 'Options' and ensure each option has a descriptive name (e.g., 'Size', 'Color'). Squarespace uses these names to build accessible labels automatically in most templates.
- For any remaining unlabeled selects, use Settings → Advanced → Code Injection (available on Business plan and above) to inject a JavaScript snippet that adds `aria-label` to the specific `<select>` element by its class or position. Example: `document.querySelector('.your-select-class').setAttribute('aria-label', 'Sort by');`
- Alternatively, add a Custom CSS / Custom Code block via a Code Block widget with the JavaScript above, scoped to the relevant page.
- Re-test with the axe extension after publishing.
What is select name?
Every dropdown menu on your website (a `<select>` element — things like "Choose a size", "Select a country", or "Sort by") must have a text label that is programmatically linked to it. Without this link, a screen reader user who tabs to the dropdown hears nothing useful — just "combo box" with no context about what they're supposed to choose. A label can be a visible `<label>` tag, a hidden-but-accessible ARIA attribute, or a wrapping label element — but something must be there and connected.
Screen reader users — who include blind shoppers, people with motor disabilities, and many others — cannot use unlabeled dropdowns. This directly breaks the shopping experience: they cannot select a product size, filter results, choose a shipping country, or complete a checkout form. Beyond lost sales, missing form labels violate WCAG 2.1 Success Criterion 4.1.2, which is cited in accessibility laws in the US (ADA), EU (EAA), UK (PSBAR), and Canada (AODA). Accessibility lawsuits overwhelmingly target e-commerce sites, and missing form labels are among the most commonly cited violations. Fixing this removes legal risk and opens your store to a wider audience.
See the complete Select name guide for every platform and the full background.
Not sure if your Squarespace store has this?
Run a free SEOLZ scan — we’ll find select name and every other issue across your whole site.
Scan my site free