What are the best WCAG tools for form accessibility testing?

WCAG is a critically important standard for accessibility: both for the disabled community, but also for able-bodied users (the 50% of Americans who keep captions on, as an example). At present, only 3% of websites are considered accessible to the legal standards now expected in Canada and the US. It's estimated that 1 in 6 people (16.6%) of people have a disability. This means 97% percent of websites are not performing optimally for large numbers of users – some a minor inconvenience, some unable to use features at all. It's the technical, moral, and sometimes legal best practice to follow when developing websites.

The Web Content Accessibility Guidelines (WCAG) provide guidelines for web content developers and others who need a standard for web accessibility. The guidelines are structured around four principles: perceivable, operable, understandable, and robust, also called the POUR principles. WCAG ensures that digital products are usable by everyone, regardless of their abilities or disabilities

WCAG serves as a basis for many legal requirements and guidelines all around the world. Despite its widespread adoption, it's full of holes -aka gaps-. It is also evolving painfully slowly, especially compared to mobile revolution and now the AI revolution. Version 3 is expected to come around 2030! But despite all the shortcomings, it's the best weapon we have against inaccessibility!

WCAG steht für Web Content Accessibility Guidelines. Sie werden vom World Wide Web Consortium (W3C) bereitgestellt und stetig weiter entwickelt. Das W3C ist ein Zusammenschluss aus Organisationen, die solche Richtlinien, Webstandards und erklärende Informationen bereitstellen. Die WCAG ist in vier Prinzipien unterteilt: wahrnehmbar, bedienbar, verständlich und robust. Jedes Prinzip hat mehrere Erfolgskriterien, die getestet und verifiziert werden können. Wenn alle erfüllt sind, ist das getestete Produkt konform zur WCAG. Es gibt drei Level von Kriterien: A, AA und AAA. In Level A finden sich Anforderungen um die schwersten Barrieren zu vermeiden, die anderen bauen darauf auf. Um Level AAA zu erfüllen, muss man auch Level AA und A erfüllen.

WCAG is the most widely recognised set of guidelines for testing websites. They are commonly used as a set of standards for measuring how accessible a website or mobile application is. Currently in version 2.2, There are 3 levels of conformance; A, AA, and AAA with AAA conformance being the most challenging to meet, but providing an accessible experience for the most amount of users. While most in the industry accept that they could be improved in some ways, they remain the most comprehensive and well-thought-out set of guidance for inclusive content that we have today.

Forms are gateways to interact with the digital world. Everything, absolutely everything, starting from attending an exam, to booking a doctor's appointment, to creating an account on LinkedIn, even to writing this contribution is done with forms. Forms have the power to enable to disable people. Just by ensuring the accessibility of your forms, you can significantly improve the accessibility of your website, app, or document.

Formulare sind in der Regel die einzige Möglichkeit bestimmte Aktionen auszuführen. Zum Beispiel den Inhalt eines Warenkorbes bestellen. Dazu muss man in einem Formular angeben, wer kauft, wie bezahlt werden soll und wohin geliefert wird. Auch zum Stellen von Anträgen, z.B. auf ein neues Nummernschild oder finanzielle Unterstützung müssen Formulare ausgefüllt werden. Jedes Login ist ein einfaches Formular, das mindestens den Nutzernamen und ein Passwort abfragt. Wenn Formulare nicht zugänglich sind, können sehr viele Menschen an wesentlichen Bereichen des online Lebens nicht teilnehmen. Sie sind das Tor zu jedem Social Media Network, jedem Einkauf und jeder digitalisierten Dienstleistung.

Forms are the first frontier that people need to overcome in order to register interest of gain access to products or services on the web. It's very easy to create forms that aren't accessible to people with various access needs. Forms need to be tested to make sure that they can be accessed by people with various impairments. For example, people may not be able to see the screen or use a mouse or trackpad. Forms need to be thoroughly tested to make sure that they do not create an unnecessary access barrier. WCAG guidelines provide test information to help teams create accessible forms.

You can test forms for accessibility by filling them out with only a keyboard; this will tell if they are accessible to keyboard users. Additionally, you can utilize screen reader tools to hear how the screen reader reads the form content and instructions.

Einige einfache Dinge kann jeder selber ausprobieren: wenn man auf die Beschriftung eines Feldes klickt, sollte der Cursor in das Eingabefeld gesetzt werden. So weiß man, dass Beschriftung und Feld korrekt miteinander verknüpft sind. Das Feld mit dem Cursor ist nun fokussiert und sollte deutlich sichtbar hervorgehoben werden. Den Fokus kann man auch versetzen indem man die Tab-Taste drückt. Stimmt die Reihenfolge beim Durchtabben? Ist der Fokus immer gut sichtbar? Ist alles ohne Maus bedienbar? Dann sind wichtige Dinge schon mal erfüllt. Es gibt aber sehr detaillierte Anforderungen an die Zugänglichkeit von Formularen, die Sie von einem Fachmann und möglichst auch von echten Menschen mit Behinderungen testen lassen sollten.

WAVE (Web Accessibility Evaluation Tool) is a great Chrome plugin that allows you to quickly catch accessibility related errors with elements on your page. Chrome also has a lot of great built-in accessibility scanners and testing to catch some of the more obvious issues. However, the best testing is user testing – having someone who uses assistive technology go through your site will always be better than emulating their experience. There may be features that pass but that still interfere with their optimal experience.

Forms require a lot of manual testing. These include accessible names of form elements, visible labels, placeholders, form element's visual styling such as background colors and borders, focus order, focus styling, communicating states, capabilities to display errors, guiding users to fix the errors, communicating overall form states and -if required- communicating state changes via ARIA are the main topics to cover.

Manuelle Tests sind sehr aufwendig, bringen aber im Idealfall alle Fehler zutage. Allerdings ist dabei viel Fachwissen nötig. Daher können manuelle Tests nur von Experten durchgeführt werden. Sie gehören in die Qualitätssicherung eines jeden Produktes, denn barrierefreie Produkte sind bessere Produkte, die von allen Menschen besser genutzt werden können. So gibt es beispielsweise keinen einzigen Menschen auf der Welt, der einen kleinen Button schneller klicken kann als einen großen. Gerade weil manuelle Tests nur von ausgebildeten Personen durchgeführt werden können, erhält man als Rückmeldung in der Regel sehr detaillierte Fehlerbeschreibungen und Hinweise zur Reparatur. Zertifizierungen sind ausschließlich mit manuellen Tests möglich.

Automated testing is really useful if you have good experience of manual accessibility testing, and extremely hazardous if you don't. This is because: 1. it doesn't test every accessibility issue 2. it's not very smart 3. it makes mistakes So knowing what it does well and what it doesn't do well (or can't do at all), is crucial for being able to test websites effectively. Automated testing must always be used to assist in a manual testing process and should never be relied upon as a complete accessibility conformance test.

Actually, a lot of form testing can be done automatically. But people are endlessly creative in their implementation choices and that hinders the capability of automatic testing technologies. In the end, if you don't respect semantics and make a text field with a div, no automatic testing tool will catch you and that's why manual testing is a must. Here is an example: <div contenteditable="true">I'm Editable.</div>

Automatisierte Tests sind billig! Sie können ständig (z.B. jeden Tag oder sogar öfter) laufen und einzelne Seiten oder ganze Webauftritte mit allen Unterseiten überwachen. Allerdings können sie nur einen kleinen Teil der Anforderungen überwachen und übersehen oft etwas. Auch geben sie Fehler aus, die gar keine sind. Nicht zuletzt sind sie leicht zu überlisten. Daher muss das Ergebnis von Experten bewertet werden. Dennoch sind sie ein wichtiges Tool in einer Gesamtstrategie. Vor allem um die Arbeit von Entwicklern laufend zu überprüfen. Sofort gemeldete Fehler sind leicht zu beheben. Die Behebung von Fehlern, die erst später bei einem manuellen Test gefunden werden, kostet wesentlich mehr Zeit und damit Geld.

If you are dealing with a large number of forms, or forms generated by the same component library, automatic testing will be extremely helpful in dealing with quantity. But for the qualitative effect, you need to conduct a thorough manual test. If your forms are coming from a design system, a component library, or even a form generator, you stand a better chance of not encountering various unexpected errors. Likely, it will be the same repeating errors and fixing them in the source can take out a lot of those occurrences at the same time.