Webflow Inc. is an American software-as-a-service (SaaS) brand that debuted in 2013. This company aims to empower designers to design, build, and launch highly responsive websites using a visual editor. In January 2021, Webflow reached a $2.1 billion market valuation and now serves over two million users. Webflow is leading the no-code revolution with amazing innovation. Without typing a single line of code, web designers can create professional, custom websites. Not only websites but also the massive ambition are to build apps and software by designing instead of coding it. Brilliant as it sounds, there is a high probability that websites built with this platform fall short of accessibility standards. This article chart an accessibility pathway you may adopt to improve your Webflow website’s web accessibility.
Webflow e-commerce
Before Webflow, owning an e-commerce store used to be a difficult wish. People had to pay programmers thousands of dollars to write code lines that would translate into an e-commerce store. That restrictive narrative has undergone a dramatic transformation.
Webflow e-commerce lets clients build online stores that are unique to their brands. Users reserve the privilege to choose their store’s entire look — from the homepage to checkout; they are in control. In addition to that, users even get to customize their cart. Also, Webflow e-commerce easily integrates with several payment gateways. Webflow is hosted on Amazon web services which equally powers other top brands such as Airbnb, Netflix, Pinterest, Slack, Adobe, etc.
Could your Webflow site be inaccessible?
There are both opportunities and threats in breaking barriers to web design and e-commerce development like Webflow is doing. While an obvious advantage is that anyone can bring their dreams to fruition by creating their website at the snap of a finger, the threat is equally massive. Anyone, anywhere, can create greater inequality with their little knowledge of accessibility or failure to adhere to it.
If you ask Webflow to what extent are websites and e-commerce stores made on its platform accessible, you may not get a bold, positive response. Since its inception, Webflow has focused more on making web design more accessible for creators. Unfortunately, this does not mean equal attention for end-users. Instead, it is much easier for creators to build inaccessible sites than otherwise. Here are some likely accessibility rules your Webflow site could be flouting:
- Low contrast, which used to be the default
- Components are not accessible by default
- Keyboard navigation not easy to come by
- Accessibility scan is only possible post-launch and on third party tool, e.g., WAVE
What has Webflow done to make websites more accessible?
Having observed critical web accessibility gaps in its framework, Webflow took a bold step to correct these lapses. This is a laudable step considering that few web designing platforms take accessibility as a priority. Some of the effort made by Webflow include:
- Making the alt text field more prominent and adding it to the asset manager; thus, programming it to generate alt attributes by default
- Adding captions to make it easier for web designers to tag elements and sections on the site
- Configuring background images (which do not support alt attributes) to suit accessibility standards
- Creating layouts that conform to accessibility standards out-of-the-box. These layouts feature page hierarchy which guides content creators to break content into headings and subheadings properly. They also support keyboard navigation and accessible page structure.
We have taken a look at different web accessibility solutions and which web accessibility solution would work good on your Webflow website. We have come to the conclusion that UserWay offers great tools and features that easily can be implemented to your Webflow website. Let’s continue where we will explain more about this web accessibility solution.
UserWay Web Accessibility for Webflow sites
Compared to other software-as-a-service brands, Webflow is doing so much to create equal access for everyone. In addition to its previous and present efforts at making websites designed through its platform accessible by default, the company has clear plans for the future — commendable effort, but not enough.
If we understand a single thing about accessibility, it will be that accessibility is a moving target. Keeping a usable website is not a one-off effort, though baking accessibility into the site make-up is a good idea. For anyone looking to maintain their website accessibility, we recommend checking out UserWay accessibility for Webflow sites.
UserWay is an outstanding accessibility solution that uses both AI and human effort to achieve compliance with the World Content Accessibility Guidelines (WCAG) and the American Disabilities Acts (ADA). Here are some great components of UserWay that are worth considering:
1. UserWay Accessibility Scanner
Running a website that accommodates all visitors regardless of their disabilities is similar to embarking on a journey. The first step you must take in your journey toward accessibility is an “accessibility audit.”
An accessibility audit lets you understand your website’s present state to understand the next step to take and in which direction. UserWay Accessibility Scanner will run an automatic scan on your Webflow site to unravel different accessibility loopholes. Upon completion, a detailed report will be generated to give you an idea of issues to fix. To make things easier, UserWay includes remediation solutions for each of these accessibility issues. Finally, the report prioritizes issues according to the severity level so that you can get started with the most critical errors on your site.
2. UserWay Accessibility Monitoring
How does it feel waking up to a lawsuit after going to bed with a “fully” compliant website? Devastating, right? Exactly. It is ridiculously easy for a site to fall out of compliance even if you have used many resources. This is why accessibility monitoring is crucial to ongoing compliance.
UserWay’s accessibility scanning and monitoring help you keep track of your compliance status through real-time monitoring. This is especially important for websites where contents are periodically produced. Through a sophisticated AI dashboard, the content monitoring system gives instant notification of violations as soon as they occur on your site and their exact location. These alerts also come with actionable insights for your internal team to implement.
3. UserWay Accessibility Widget
This tool is perhaps the most important part of the accessibility package, particularly for end-users. It gives users all the necessary resources to control their experience. UserWay accessibility widget supports HTML, CSS, JS websites, and all kinds of content management systems. It works perfectly with sites created through Webflow.
UserWay aims for its accessibility widget to empower users to tailor web content to their needs or preferences at the tap of a button. For this reason, the widget has several tools. Some of these tools are:
Screen reader
Individuals with visual impairment sometimes depend on screen readers to make sense of web content. However, there are times when they encounter challenges accessing the information on the internet, even with assistive technology. The blind plaintiff in the Domino’s pizza court case reportedly could not complete his orde despite using screen reading software.
In a bid to prevent this and to grant blind people access to whatever information on the internet, UserWay has configured its widget to render any page into voice just with a tap. This means that blind people do not have to worry about using any software to access your Webflow site as long as you install the UserWay Accessibility Widget.
Contrast
Contrast affects content readability in profound ways, especially for people with one type of visual impairment or the other. By installing the UserWay widget, users do not have any issues with your website since they can activate four different contrast effects by tapping the contrast button.
Pause animation
An accessible website is not the only one accessible to the visually impaired. Animations and flashes unsettle some individuals. For this category of people, the pause animation feature on UserWay Accessibility Widget comes in handy.
Bigger texts
The extent to which people can access content on a given site depends on the font type and size. Due to the small font size, some users have to strain their eyes. People who have a permanent disability (such as low vision) or situational disability (someone who lost his glasses) may find it difficult to read this kind of text. It is also against the WCAG requirements.
To solve the problem of the small font on your Webflow site, UserWay Accessibility Widget features text magnifying functionality, which lets users increase text size as much as they find comfortable.
How much does UserWay Accessibility cost for Webflow sites?
In addition to providing reliable accessibility services, UserWay has great pricing for its services. There are free services as well as paid premium ones.
As for UserWay’s accessibility scanning and monitoring, you can enjoy a one-page scan of your Webflow site for free. Of course, you know that a single-page scan will not retrofit your site to compliance. It will only give you a taste of the whole package. For a full-page scan and real-time monitoring, UserWay charges $49/month for a pro scan and continuous monitoring of your Webflow site. The pricing rule is, the higher the number of pages, the higher it costs to scan and monitor.
Similarly, the Accessibility Widget comes in free and premium versions. With the free version, you have access to basic features on the toolkit. However, to enjoy the full feature, you must make some financial commitment worth the cost.
Conclusion
Website accessibility is a complex process. Although Webflow is doing a lot to reduce web accessibility issues on sites built with its tool, the reality remains that only little can be done. The best way to win the fight against inaccessibility on your Webflow site is by trusting a solution like UserWay.
