Fast company logo
|
advertisement

Stark’s easy-to-use browser extension gives designers and web developers the tools they need to design an accessible website.

[Image: courtesy Stark]

BY Elissaveta M. Brandon4 minute read

According to 2020 Web Accessibility Annual Report, a staggering 98% of the internet is not accessible. In other words, tens of millions of websites are excluding people with learning disabilities or visual and hearing impairments, making it more difficult—or downright impossible—for them to read the news, order meds, deposit a check online, or learn a new skill. And companies with inaccessible websites are also missing out on a disability market that controls over $13 trillion in annual disposable income.

That’s why the software startup Stark has launched an audit tool that lets designers, web developers, and product managers analyze their website and see if it is compliant with the most popular digital accessibility standards, known as Web Content Accessibility Guidelines (WCAG). Crucially, the audit tool is part of a browser extension that Stark launched in the fall of 2022, so anyone, anywhere, can download the extension, run the audit on their website, and see, within seconds, how accessible it is. (The extension is compatible with all browsers except Firefox, which is launching in the coming weeks; paying customers can generate a downloadable report, but the actual audit is free.)

So what are the components of an accessible website, and what is it like to navigate one? According to the W3C Web Accessibility Initiative, which maintains WCAG guidelines, every component of a website—including images, pop-ups, forms, icons, buttons, and links—needs to be perceivable, operable, understandable, and robust. “But WCAG is the floor, not the target, ” says Stark CEO Cat Noone, whose team has built a set of tools that enable designers and companies to go beyond that floor and elevate their website to something that is both inclusive and aligned with their own design systems. “In the same way you have wheelchair ramps in public space or elevators, people with disabilities have the right to independently, easily, and delightfully access every digital space the internet offers,” she says.

A screenshot of an audit generated by the Stark extension. The example website (a fictional direct-to-consumer-houseplant company) has scored 92% with 19 violations, 16 potential issues, and 200 elements that passed inspection. One of the violations is displayed and reads "There is no "lang" attribute defined on the "html" element." Below there is a button to generate a full report.
[Image: courtesy Stark]

The audit feature gives you a complete list of website elements, sorted into “Violations,” “Passed,” and “Potential.” The first category breaks down the number of elements that don’t meet WCAG guidelines, the second references the elements that do, and the third lists the number of elements that could be considered as a potential violation, but need further investigation. Each element comes with a plain text description of the result, a link to the exact code line, and a link to the corresponding WCAG guideline so you can find out more. The audit also gives you a total score, which Noone says isn’t always representative of the overall state of the website but can be useful when comparing to other industry standards.

A designer by trade and training, Noone launched Stark in 2020, after noticing a need for tools that designers could use to ensure their products were accessible. She says the first version was baked into the design software Sketch—”because at the time, Sketch was all the rage.” Then came plug-ins for Adobe and Figma, and now the browser extension. “What we try our best to do is make it so that whatever platform you use, the experience is the same, and it’s catered to the role of that platform,” says Noone.

Even before the WCAG audit feature launched, the browser extension enabled designers to check for elements like font size, color contrast, and alt text in images. For every problem it identifies, Stark provides a suggestion, like changing the font size, or fixing the contrast ratio with a better color pairing. It also lets you run a “vision simulator” that was designed to let you experience the website as a colorblind person, or see what it looks like for people with blurred vision. “It’s a compassion-building tool,” says Noone. “If you were to choose that typeface, sure, it’s beautiful but [the tool shows you] it’s terrible for individuals with low vision because of the shape, because of the roundness, or because of the low x-height.”

According to Noone, most common mistakes revolve around color ratios and font sizes. Alt-text is another big oversight, as is the ability to navigate a website with a keyboard. For Noone, the biggest obstacle to a more accessible web is that companies simply don’t know where to start. “We’ve built up the internet for decades, and now it’s a matter of fixing what’s already there and also making sure that new projects that are being worked on are accessible from the ground up,” she says. “And it got this way because there was never any solution for it in the first place.”

For now, the browser extension focuses on physical disabilities, but the team is also working on a prototype that takes into consideration people with cognitive disabilities, including dyslexia. The ultimate goal is for all of the web to be accessible, so that anybody can navigate a website, regardless of their physical or cognitive ability. “There’s no such thing as 100% accessibility,” says Noone. “But there is such a thing as continual integration of accessibility, and that’s what we aim for.”

Recognize your brand’s excellence by applying to this year’s Brands That Matter Awards before the early-rate deadline, May 3.


ABOUT THE AUTHOR

Elissaveta is a design writer based in Brooklyn. Her writing has appeared in The Atlantic, Wired, CityLab, Conde Nast Traveler, and many others More


Explore Topics