Jump to content

Squarespace Social Links are NOT Accessible

Recommended Posts

I checked my site's WCAG compliance using the WAVE Accessibility Tool and I am getting errors on every page for the social links in the Footer. The error is: "Empty Link: A link contains no text". I believe the code should identify the link as Twitter, Instagram, Mail, etc. so people with disabilities using screen readers know what they are clicking on. I was told by Squarespace Technical Support that there is not currently a solution in place for this. I was told I would need to upgrade my subscription and manually fix the code. I was surprised about this response. Social Links are a standard block tool and I imagine they are used quite a bit. 

Does anyone know if Squarespace is working on a solution to ensure that this block meets accessibility standards? Or is there a workaround that does not require upgrading my subscription? Thanks for the help. 

Edited by Caroline_D
Link to comment
  • 3 weeks later...

I am having this problem as well! I ended up individually downloading all the icons for social media sites and remaking the social links in my footer with a code block with alt text.  I had to add an inline css height attribute to make all the icons the same height and width. It looks more or less the same and it doesn't flag any errors for WAVE... but now you have to know HTML to edit it. Not a great trade off since  I'm may have to pass the website off to someone less HTML-literate at some point, but works for me for now. I used this kind of code:

<a href="twitter.com/isfsd"><img style="height: 3em;" alt="Twitter" src="https://images.squarespace-cdn.com/content/5e4467780f0455f95cff518/1585073685193-GKZBXZ9EXWCXL2URQS29/Twitter_Social_Icon_Square_White.png?content-type=image%2Fpng"></a>

Can you access Markdown blocks? I know lower-tier plans don't have code blocks, but I tested this code in a Markdown block and it worked there as well.

 

 

Link to comment
  • 1 month later...

Hey @glidinsk,

Still having issues with this? We developed a way to make the native social icon blocks fully accessible using aria-labels instead of alt text. Visually impaired users who rely on a screen reader hear them announced as "twitter," "facebook," etc. instead of the default "button" - that way there's enough context to help them understand the purpose of each link.

If you're interested in making your site fully accessible (including zero WAVE errors), I'd encourage you to check out our free accessibility audit. Our team at Square ADA specializes in making Squarespace sites ADA compliant, and we do all the heavy lifting so you don't have to worry about that "HTML literacy" you mentioned 🙂

Edited by tcp13

The above post may be outdated. I’m no longer active in the Squarespace ecosystem, so I won’t see your direct messages. For better resources about web accessibility, I’ve documented some of my thoughts on my forum profile.

Link to comment
  • 2 years later...

Its a while since this topic was discussed.

I think Squarespace have improved their web build to make it easier to be more WCAG compliant but they still fall short.

I want to add a button or widget like Wordpress have which lets users highlight some text content and a voice reads it out.

I also want to know exactly how to use the "skip to content" as it does not seem to work.I am on the latest squarespace version...7.1 but only as a individual not a business.

Is there anybody out there that is up to speed on Squarespace and WCAG compliancy?

 

Link to comment
  • 3 months later...
  • 1 year later...

Hi.  I checked my site with Nibbler, and found the same alert "empty text links" on all pages, because of the social icons in the footer.  When I asked squarespace about this they said:

SEO marketing tool reports about site errors are intended for use with custom-coded sites, not sites built on content management systems (CMS), like Squarespace, so they can return reports that don't apply to your site. We can provide some insight into understanding Google SEO emails and console errors, but we can’t investigate results from other third-party tools.

 

Is this right?  

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.