Which website builder ranks best in accessibility?

 

Which website builder ranks best in accessibility?

We tested your go-to web design platforms so you don't have to. Get the full report to see how they compare.

 
 

Which website builder ranks best in accessibility?

To build a website is to create a welcoming space where visitors can engage with our brand. You'd likely keep in mind a few things: design, function, and ease of use. This way, anyone can enter and feel that their needs are catered to within your digital presence.

But not all needs are created equal. There are people with disabilities who require specific accommodations so they too can fully interact with the websites we create. Do we also make space for them in our web designs?

Certainly you'd want to serve as many users as possible, regardless of their ability. This is what we call accessibility, a principle that starts with choosing the right tools to prioritize usability.

We know you're committed to building inclusive websites that provide a meaningful experience to people of all abilities. That's why we decided to evaluate how popular website builders—Shopify, Showit, Squarespace, Webflow, and Wix—perform in terms of accessibility.

Why is accessibility important?

The World Health Organization (WHO) estimates that around 16% of the world's population—around 1.3 billion people—live with significant disability. In the US alone, that's more than 1 in 4 adults who need assistance in terms of cognition, mobility, hearing, vision, self-care, or independent living.

Amber Hinds, founder of accessibility-driven Equalize Digital, advocates strongly for their inclusion in digital spaces as in physical spaces.

"Accessibility at a baseline is about ensuring everybody can use the web and anyone can become a customer of your business or reader of your web content," she emphasizes in our interview.

A Venn diagram showing three overlapping circles labeled 'Accessibility', 'SEO', and 'Website Performance
 

From an entrepreneurial perspective, accessibility standards seem to fade in the background of more pressing concerns such as operations, marketing, or sales. But Amber believes that accessibility has broader implications that align with business goals. For one, merely ensuring that website elements like images and headers are properly tagged will also be beneficial to SEO. And besides, would clients want to miss out on a relatively sizable chunk of target customers?

She still finds, though, that the best way to widespread adoption of accessibility is to ensure they're already baked into the website builders we use:

"Having a builder or a toolset that you use when you're building websites for your clients that supports accessibility is good because you may be building this website and potentially handing it off to someone who [may be] good at using Microsoft Word, but that's about it." —Amber Hinds

This is ultimately what pushed Equalize Digital to assess the performance of WordPress builders—and inspired me to conduct a similar test on other platforms.

What were the considerations for this accessibility test?

Some aspects of accessibility rely on the platform or structure, others on the content or design. Since this is a comparability study of website builders, it was not feasible to test each template or every component. We also can't account for other factors like font pairings, color palette, or custom code, which depend on input and may be prone to user error.

Instead, Amber wants to focus on how platforms are providing guardrails with baseline features: "In what areas are certain builders stepping up and guiding users a little bit more?" You'd be surprised to hear that not all options consider accessibility by design, if at all.

A scorecard titled 'Accessibility of Popular Website Builders (Nov. 2024)' showing accessibility ratings from highest to lowest: Shopify (82%), Squarespace (72%), Webflow (63%), Wix (58%), and Showit (28%)
 

We built test sites using the documentation and best practices of website builders to figure out what accessibility features they have by default. Even then, we know that these may not offer enough information to set up inclusive websites for non-technical users.

A keyboard and multiple screen readers (e.g. Mac VoiceOver, Windows Narrator) simulate common use cases for mobility and vision issues, among others.

"This is a snapshot. I think it's a really good snapshot," Amber remarks. "I think it shows a lot of variety, provides some really good patterns."

We focused on Website Code Architecture

Our study focused on the code architecture of the platforms. While content quality, assigning header tags, color contrast, and visual design are crucial for accessibility, these can be mostly controlled by the website creators.

Hence, our test focused on areas where platforms have most control — how their ready-made components are built and how their platform generates the underlying code structure.
For example, the DOM order, ARIA labels, and semantic structure are built into the platform's base architecture and gaps in these aspects persist regardless of how carefully a website creator follows content creation best practices and accessibility guidelines.

Amber thoroughly spent approximately 2-3 hours per platform to complete the accessibility audit matrix. You may view this along with her accessibility test videos.

What accessibility categories are we looking into?

Our accessibility study evaluates each website builder based on a rigorous set of criteria — it can get a pass, fail, concern, or not applicable (N/A) for every item. Their overall accessibility score reflects the percentage passed among the applicable measures.

We're generally testing the functionality and code architecture of ready-made components in five broad categories:

Headers

Starting from the top, we'd want to make a great first impression for visitors landing on our website. Can we use our keyboard to navigate through the menu? This could indicate that the focus feature is available for people who cannot use a mouse or trackpad. If there are issues, it might be helpful to inspect the code to see whether the items are properly tagged.

Users shouldn't be forced to tab through every dropdown item; in fact, we're looking for a hidden function called skip links which gives us an option to jump to the main content.

Text

Written content has to be indexed with a page language and flow smoothly without overlapping with other elements, even when zoomed in. Another crucial issue that gets overlooked most of the time? Underlined links—Amber stresses this as an easy fix to benefit users who may be color-blind.

Media

This time we're paying attention to images and videos on the platform. Does the website allow you to zoom in on pictures to see the details? How easy would it be for you to set up alt text? It's useful for screen readers and search engines alike.

Videos also have to function with proper keyboard navigation, regardless if they are directly hosted or embedded. There needs to be an easy way to pause any clip that's on autoplay.

Carousels & accordions

These two components need to be handled with care in terms of keyboard navigation.

Like videos, carousels must have a pause button for autoplay—or better yet, autoplay can be turned off by default. Your tab key has to be able to flip through the slides, with screen readers being able to glean content from each one.

As for accordions, we'd want to check if we can tab through the sections and expand them using the return (enter) or space key.

Forms

If there's one other crucial feature you need to look out for, it's your website's default form. Correct field grouping and labeling can allow for efficient autocompletion (e.g. name, address, email). Required fields must be marked prominently so people can't miss them. It's also better to use clear and concise descriptions for user input rather than inserting placeholder text.

Any screen reader should be able to read out comprehensive error or success messages after every form submission, so even those with impaired vision can get helpful feedback.

So which platforms performed well in accessibility?

No website builder is perfect, but some options are still better than others. Here's how a handful of popular platforms fared in a series of independent accessibility checks:

We're generally testing the functionality of default templates in five broad categories:

1. Shopify

The platform's default Dawn Theme shines in its emphasis on multi-national benchmarks for e-commerce websites. It's an undeniable well-rounder in our spreadsheets with the highest spikes in carousels and accordions, text, and media components. No wonder it's one of the most widely used base templates by expert designers and developers; even my Esencia theme in Standout Shopify is no exception.

"It makes sense that Shopify is putting a lot of effort into accessibility because a lot of the laws… [are] very focused on e-commerce," Amber explains. She does, however, think that they can still improve in terms of error descriptions and success messages for their forms.

2. Squarespace

The major 7.1 update to the platform furnishes all new websites with the same base template, so we can safely place the recent Fluid Engine in second rank. Squarespace did well with accordions just like Shopify, and it particularly excelled in its default forms. However, there are a few concerns in navigating carousels, zoom, and focus indicators via keyboard.

Squarespace remains to be a well-performing choice for accessibility, especially for service-based businesses that do not need the commercial bells and whistles of Shopify.

3. Webflow

This website builder is known for its relatively steep learning curve, and the same can be said of its settings for accessibility. Even we had to dig deeper into its documentation to look for setting up the site for success, with mixed results.

A lot of these functions are left to the expert developer's discretion which can quickly get overwhelming for beginners. The extensive customization does make it possible to facilitate an accessible Webflow site—so long as you know what you're aiming for, at least.

4. Wix

Following closely behind is another user-friendly favorite that places accessibility front and center among its infrastructure fundamentals. This drag-and-drop builder is more forgiving to its first-time users than Webflow, but its open-ended approach to inclusive design can make accessibility seem like an add-on rather than a requirement. Users would still need to make manual adjustments to accommodate disabled audiences.

5. Showit

Out of all builders we surveyed, this may be the one that shocked us the most. Showit seems to have relegated accessibility to the back burner, with Amber noting the disjointed keyboard navigation as its fatal flaw.

Not only do the components fail to work as expected; some of these features, such as skip links or logical tab sequences, are missing altogether. "You'd go from the logo to the right side of the navigation menu and work backwards, and dropdown menus wouldn't appear in the expected order," Amber reports in astonishment. "This kind of implementation can cause users to simply leave the website."

The issues identified - such as reversed DOM order, improper semantic structure, and fundamental navigation problems - stem from core architectural decisions in how the platform generates and structures its code. This means that even experienced developers may find it challenging to implement accessibility improvements even through custom code solutions.

A spider/radar chart comparing accessibility features across five website builders: Shopify, Squarespace, Webflow, Wix, and Showit.

How do you convince clients to prioritize website accessibility?

For some clients, design standards that uphold accessibility may come across as unnecessary constraints to their creative freedom. It may not be enough to simply remind them of existing laws and possible repercussions for non-compliance.

Amber takes one approach that works best for her: showing clients a few examples of renowned websites that are both accessible and aspirational.

"I like to try and find [enterprises] or larger companies in the same industry, because while it is common to have template-based builds to have a lot of animations in them… you can show [your clients] that [companies] don't do this," she elaborates.

Gently guiding them towards these best practices can help handle pushback against smaller design details, like underlining links or toning down saturation.

Can I use accessibility overlays instead?

You may have heard of accessibility overlays, third-party extensions that offer overarching solutions for technical gaps in accessibility. For a monthly subscription of $50 or more depending on page views, they appear to single-handedly shoulder the responsibility of complying with website regulations and shield you from potential lawsuits.

If it sounds too good to be true, that's because it is. "I have seen some instances where overlays have improved something," Amber concedes, before adding, "But I have also seen a lot of instances where they can add problems."

Overlays just end up sweeping your website's accessibility issues under the rug rather than addressing them on a structural level. They even add another layer of JavaScript code to the browser, which could significantly slow down website speed.

Take it from the page visitors who are most impacted by these problems:

"A lot of people with disabilities do not like overlays, particularly people who are blind, because if an overlay recognizes that they are using a screen reader, it will modify the website in a way that is not helpful." —Amber Hinds

At the end of the day, it pays more to invest on a holistic accessibility audit from the very beginning—an initial fix that can last indefinitely—rather than spend on a subscription that turns into an expensive mistake in the long run.

How could I best approach web accessibility?

Whichever platform you choose, adopting a proactive stance in accessibility during design and development can help launch your website without a hitch.

Amber recommends web designers to conduct an initial round of automated testing. It's perfectly alright to use third-party tools (e.g. WAVE, Headings Map, taba11y, Landmark Navigation, Google Lighthouse) to flag any possible issues you might miss; just keep in mind that this is merely a precursor to your subsequent manual checks.

After addressing the glaring issues, engage in user testing with disabled individuals when possible. This is the single best way to gather and implement feedback more effectively: by communicating with people who will benefit from these accommodations.

Of course, accessibility is a constant work in progress. We must continue to monitor the overall user experience and educate ourselves on the topic. The Web Content Accessibility Guidelines (WCAG) and A11Y Collective provide a good starting point for actionable advice. Not to mention, Equalize Digital hosts a bimonthly WordPress Accessibility Meetup to discuss platform-agnostic concepts; feel free to join their Facebook group here.

If you ever find an issue that you can't solve on your own, you can report whatever needs fixing in the website builder. Then again, Amber admits this isn't always an effective course of action. "The reality is, sometimes you just have to change your tool," she concludes.

How does WordPress compare in terms of accessibility?

The accessibility of a WordPress site highly depends on the page builder being used. In fact, this comparative study of website builders was inspired by Amber Hinds' comprehensive analysis of WordPress page builders' accessibility, which revealed significant variations in accessibility compliance between different WordPress page builders.

For more detailed information about WordPress page builders' accessibility performance, we recommend checking out Amber's in-depth video and analysis at her blog.

Previous
Previous

The Hidden Font Hack to get the Editorial Look in Squarespace

Next
Next

Meet Copyspark: Your AI-powered website content assistant