Get instant access to this builder accessibility guide.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Choose Your Builder
Menu

Label All Controls - Squarespace

Ensure every button, link, and form field clearly states what it does.
Control
Developed by DAPEN.org

Label All Controls in Squarespace

  1. Open your Squarespace site and navigate to the page containing the controls you want to label (form fields, buttons, icons, menu triggers, etc.).
  2. Hover over the section containing the control and click Edit.
  3. Select the first control on the page:
    • For form elements, click the form block to open its settings panel.
    • For buttons or links, click directly on the element to open its editing toolbar.
  4. For form fields:
    • In the form settings panel, click the field you want to label.
    • Enter a clear, descriptive Field Label (e.g., “Email Address”, “Full Name”).
    • Ensure the Placeholder text is optional and not used as the only label.
  5. For buttons:
    • Click the button text to edit it.
    • Rewrite the label to clearly indicate the action (e.g., “Submit Form”, “View Services”, “Start Checkout”).
  6. For image or icon buttons (e.g., social icons, hamburger menu icons):
    • Select the element → click Edit → open the Design or Content panel.
    • In the Accessibility Label or Alt Text field, enter a descriptive purpose-based label such as “Open Menu”, “Close Modal”, or “Visit Instagram Page”.
  7. For images used as links:
    • Select the image block → click Edit.
    • Open the Content tab and locate the Alt Text field.
    • If the image functions as navigation, describe the action (e.g., “Go to Portfolio”).
  8. Repeat steps 3–7 for all interactive controls on the page to ensure every action is clearly labeled and accessible.
  9. Switch to Mobile preview and check that mobile-only elements (hamburger menus, mobile buttons) also have proper labels using the same steps.
  10. Save your changes and preview the site. Use a screen reader or browser accessibility inspector to verify that each control is announced with the correct label.
Next
Enable Keyboard Access - Squarespace
Enable Keyboard Access - Squarespace