Accessibility and Squarespace

All existing websites must be universally designed before January 1, 2021. It is the owner of the website who is responsible, not the supplier.

The owner can demand that the website is universally designed by the supplier through tenders and contracts, but the owner is ultimately responsible. Websites must meet 35 of the 61 success criteria in the Web Content Accessibility Guidelines (WCAG) 2.0 standard

If you use the new Squarespace 7.1, it is basically universally designed. For websites developed on Squarespace 7.0, it will not be possible to meet accessibility requirements without further ado, but we at Gasta have HTML libraries that we add to websites to ensure that they meet accessibility requirements.

Below you will find the 35 minimum accessibility requirements with our comments.

35 minimum requirements for universal design:

1.1.1 Non-textual content (front end and content)

  • All non-text content presented to the user has a text option that serves the same purpose, with the exception of the situations described here.

  • Gasta work with content:

    • Photo: In Squarespace, Alt text on a photo in Squarespace = image title. If you use Caption on a photo, it becomes Alt text.

    • Video: YouTube or Vimeo controls alt text.


1.2.1 Audio only and video only (content)

  • For pre-recorded content that is audio or video only, the following guidelines apply, except when the audio or video is a media alternative to text and is clearly labeled as such.

  • Gasta work with content:

    • Video must have text. This is the customer's responsibility

    • For videos without text, we add text under Caption that describes the content

1.2.2 Subtitling (content)

  • Offer subtitles for video with audio.

  • Access to subtitles is provided for all pre-recorded audio content in synchronized media, except when the media serves as media alternatives to text and is clearly marked as such.

  • Gasta work with content:

    • This responsibility lies with the customer or video producer.

1.3.1 Information and relationships (front end / back end)

  • Things should be coded as what they appear to be. Read more about this point at UU-tilsynet.

  • Gasta work with content:

    • Tables: Squarespace does not have a built-in table tool. When using tables, we use Squarewebsites tables, which generates tables according to WCAG 2.1. WCAG 2.1

    • Menu blocks can also be used for simpler tables, but this does not meet UU requirements.

    • Text, formatting: we follow this, using H1, H2, H3

    • Design and presentation/Foresize text: page must not collapse up to 200%. This works well in Squarespace with the right settings for responsive design

    • Form: UU requires descriptive prompts, labeling of required fields and clear error messages

    • All of this is supported in Squarespace's form tool, but we have to fill in.


1.3.2 Meaningful order (front end)

  • Present content in a meaningful order. Read more about this point at UUsynet.

  • Gasta work with content:

    • The user must have at least two methods to find the content on the website. These can be menu navigation, search, alphabetical list and/or site map.

    • In addition to menu navigation, we will always include search on our websites

1.3.3 Sensory properties (front end/content)

  • Instructions must not be solely dependent on shape, size, visual location, orientation or sound in order to be understood. Read more about this point at UUsynet.

  • Gasta work with content:

    • On forms, buttons and other elements, there must be an explanation of what is happening. For example, if we have a vertical line or arrow to scroll down, it must say Scroll down in connection with the element.


1.4.1 Use of color (front end/design/content)

  • 1.4.1a Linked text is distinguished from other text by more than just color.

  • 1.4.1b Information in graphical representations stands out with more than just color.

  • 1.4.1c Form elements and error messages are marked with more than just color.

  • Contrast less text: 4.5:1

  • Title text: 3:1

  • Best checked with WCAG Contrast checker


1.4.2 Control of sound (front end)

  • Give the user the option to stop or pause audio that starts automatically. Read more about this point at UUsynet.

  • Work with content:

    • Ability to control sound that starts automatically. Videos in Squarespace cannot be played automatically with sound, so this requirement has been met.

1.4.3 Contrast (design/content)

1.4.4 Changing text size (frond end/design)


1.4.5 Images of text (front end/content)

2.1.1 Keyboard (front end/ back end)

  • All functionality must be operable by keyboard only. Read more about this point at UUsynet.

  • Gasta has developed code libraries:

    • Focus marking: Missing in Squarespace. Must write CSS. All links and form elements must have CSS markup (focus). Gasta has an HTML library.

    • Tab-based navigation on the website. Gasta has an HTML library.

    • Reloading of the page. Squarespace functionality is ok.

  • Avoid keyboard traps.

  • Gasta Comment:

    • Focus is moved with a tab key. Squarespace has this functionality built in.


2.2.1 Adjustable speed (front end / back end)

  • Time limits must be adjustable by the user. Read more about this point at UUsynet.

  • Gasta Comment:

    • Persons with disabilities shall have sufficient time to read content or perform actions on the website. Not relevant on our websites.

2.2.2 Pause, stop, hide (front end/back end)

  • Allow the user to stop, pause or hide automatically changing content. Read more about this point at UUsynet.

  • Gasta work with content:

    • All video blocks have this ability to stop, pause and hide content.

    • GIF files or SVG must be possible to stop/pause.

2.3.1 Threshold value of maximum three glimpses (front end/content)

  • Content should not flash more than three times per second. Read more about this point at UUsynet.

  • Gasta Comment:

    • This applies to animations and CSS effects. Gasta has never developed content that flashes more than three times per second.


2.4.1 Skip blocks (front end)

2.4.2 Page titles (front end/content)

2.4.3 Order of focus (front end)

  • Gasta Comment:

    • If you navigate with a keyboard, there must be a logical order between elements

    • This is standard in Squarespace.

2.4.4 Purpose of link (in context) (front end/content)

  • The purpose and function of all links are clearly stated in the link text. Read more about this point at UUsynet.

  • Gasta work with content:

    • Do not use generic link texts such as Read more and Click here.

    • Not a good link: Click here to read more about the report

    • Better: Universal design of ICT, report 2019


2.4.5 Multiple ways (front end/design/back end)


2.4.6 Headings and prompts (front end/content)


2.4.7 Visible focus (front end/design)

  • Ensure that all content is in visual focus when navigating with a keyboard. Read more about this point at UUsynet.

  • Gasta has developed code libraries:

    • Focus marking: Missing in Squarespace. Must write CSS. All links and form elements must have CSS markup (focus). Gasta has an HTML library.

3.1.1 Language on the front end

  • Ensure that the language of the content of all web pages is specified in the code. Read more about this point at UUsynet.

  • Gasta work with content:

    • Software such as Google Translate or Bablic violate 3.1.1

    • Must have its own web pages. Defined as a tag in the HTML that Squarespace generates.

    • Must select the correct language in Squarespace - Settings - Region

3.1.2 Language of parts of content (front end/content)

  • Make sure that all parts of the content that are in a different language than the rest of the page are marked in the code. Read more about this point at UUsynet.

  • Gasta work with content:

    • Not possible by default in Squarespace

    • If a website has two languages, we must define the language with a language tag in Page Header injection under Settings on the page.

3.2.1 Focus (front end)

3.2.2 Input (front end)

  • Changing the value of a form field does not automatically result in significant changes to the page. Read more about this point at UU-tilsynet.

  • Gasta work with content:

    • In the standard Squarespace form, this is not relevant.

    • In 3-party tools such as CognitoForms, this may apply. There, this must be informed under field info in CognitoForms.

3.2.3 Consistent navigation (front end/design)


3.2.4 Consistent identification (front end/design)

  • Elements that have the same functionality across multiple pages are designed in the same way. Read more about this point at UU-tilsynet.

  • Gasta work with content:

    • Element as button should work the same on all pages

3.3.1 Identification of errors (front end/design)

  • For errors that are detected automatically, you must show where the error occurred and provide a text description of the error. Read more about this point at UU-tilsynet.

  • Gasta work with content:

    • Error message in standard Squarespace form should appear.

    • Error message in standard Squarespace form should be translated

3.3.2 Command prompts or instructions (front end/design)

3.3.3 Suggestions in case of errors (front end)

  • If errors are detected automatically, give the user a suggestion on how to correct the error. Read more about this point at UUsynet.

  • Gasta work with content:

    • For example, where fields are required and are empty, Squarespace gives the default error message in English.

    • Gasta has developed a language library and this will be implemented.

3.3.4 Prevention of errors (legal errors, financial errors, data errors) (front end)

  • For pages that entail legal obligations, it must be possible to undo, check or confirm the data submitted. Read more about this point at UUsynet.

  • Gasta Comment:

    • For example, on pages where customers order a product or service.

    • In online shopping, this is no problem.

    • If you use a Squarespace form for ordering, this is not possible.

    • CognitoForm's form has support for control and verification.

4.1.1 Parsing (front end/ back end)

4.1.2 Name, role, value (front end / back end)


Here is an overview of non-statutory requirements.

Our test guide for website accessibility:

  1. Keyboard navigation

  2. Magnification and responsive design

  3. Colors and contrast

  4. Headlines

  5. handlebars

  6. Images

  7. Form

  8. Search function

  9. Page titles

  10. Code validation

(Read more about accessibility testing here)

Want to know more about Squarespace and accessibility? Get in touch with Gasta