Section 508 CAPTCHA: Maximizing Section 508 Compliance of Forms Protected with BotDetect CAPTCHA

October 2013. by

After adding BotDetect Captcha protection to your web form (PHP, WordPress, CakePHP, CodeIgniter, Laravel, Symfony, ASP.NET WebForms, ASP.NET MVC, ASP Classic) to prevent automated submissions, you will be able to satisfy Section 508 Captcha accessibility requirements. However, Section 508 compliance won't be automatic, since it can only be evaluated for the form as a whole, and involves page elements which are not generated by BotDetect but are under your control. Also, since each form might have its own unique requirements, BotDetect should be configured to meet them. This checklist will guide you through the Captcha implementation steps needed to fully comply with Section 508 standards.

Access Board

Table of Contents

CAPTCHA Section 508 Compliance Checklist: Configure BotDetect Accessible CAPTCHA Audio

CAPTCHA Section 508 Compliance Checklist: Functional BotDetect CAPTCHA Audio

BotDetect provides out-of-the-box audio Captcha functionality engineered to be accessible and easily understandable, compatible with a wide range of client browsers and devices, and secure against automated analysis. BotDetect Captcha audio is enabled by default.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect sound icon is shown on the form next to the Captcha image (is Captcha audio enabled?)
  • Check that clicking the BotDetect Captcha sound icon starts sound playback, and finishes pronouncing the whole Captcha code (is Captcha audio functional / compatible with the client device?)
  • Check that the Captcha audio always contains the pronunciation of the exact same Captcha code as shown in the Captcha image (is Captcha audio synchronized with the image / is Session data being stored properly?)
  • Check that the Captcha challenge can be solved and the form successfully submitted using audio Captcha only (does Captcha audio allow full form functionality?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Sound Localization

Next, you should consider the target audience of your web form and localize BotDetect to match the language of the page itself – sound Captcha can only help visually impaired visitors complete the form if they can understand the pronunciation. Use the BotDetect localization guide for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect audio Captcha pronunciation is set to use a language that visitors can understand (does the Captcha locale match the form localization?)
  • Check that the required BotDetect localization sound package is downloaded and deployed with the component (are localized BotDetect audio resources available?)
  • Check that the BotDetect Captcha sound icon is not disabled (greyed out or hidden) when you change the Captcha locale (is the required BotDetect pronunciation package deployed in the right location and with correct permissions?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Sound Icon Text Alternative

The descriptive text alternative / tooltip for the Captcha sound icon should also be clear and descriptive enough to screen reader users, and written in the same language as the rest of the form. If you need to change the Captcha sound icon tooltip, you can use the BotDetect setting for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect sound icon tooltip is descriptive enough when read to blind visitors by screen readers such as JAWS (does the text alternative convey all information necessary to use Captcha audio?)
  • Check that the BotDetect sound icon tooltip is written in a language that visitors can understand (does the text alternative locale match the form localization?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Starting Audio Delay

Finally, the audio Captcha starting delay should be configured so the Captcha pronunciation does not overlap with screen reader pronunciation of the descriptive label associated with the Captcha code textbox. This should be tested in a screen reader such as JAWS. Use the BotDetect sound delay configuration guide for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect audio Captcha pronunciation doesn't overlap with any form element pronunciations read to blind visitors by screen readers such as JAWS (is Captcha audio comprehensible?)
  • Check that the Captcha challenge can be solved and the form successfully submitted using a screen reader such as JAWS (does Captcha audio allow full form functionality to the blind?)

CAPTCHA Section 508 Compliance Checklist: Browser Sound Playback Support Help

BotDetect audio is designed to work for the widest possible user base, gracefully degrading to match the abilities of the visitor's browser and device. However, it's impossible to guarantee automatic sound support for all clients. Some very old browsers might require that a separate sound player plugin is installed and properly configured (this is equivalent to how users have to install the Flash player plug-in to access Flash movies in their browsers). Note that blind users are unlikely to experience this issue, since they are most likely to have already ensured browser sound support.

Unfortunately, it is currently not possible to automatically detect whether the visitor's browser requires such a plugin (or other client/user settings prevent the audio from being played), and which one is appropriate – so BotDetect cannot do this out-of-the-box. If you want to maximize the accessibility of Captcha audio for users of older/incompatible browsers, you could add an appropriate explanation and links to common media plugins (such as QuickTime and Windows Media Player) below the Captcha challenge or as a part of the Captcha help page.

Testing BotDetect CAPTCHA Section 508 Compliance

  • When using the form from a version of Firefox older than 4.0 (which requires QuickTime to play web page sounds), does the user have a reasonable chance to figure out the plugin is missing and fix the problem?
  • When audio playback is disabled (e.g. in Internet Explorer: the Internet Options > Advanced > Multimedia > Play sounds in webpages setting is set to Off), does the user have a reasonable chance to figure out and fix the problem?

Section 508 Compliance Requirements Affecting BotDetect Audio CAPTCHA Implementation

A fully functional and accessible audio Captcha alternative as outlined above is necessary to meet the Section 508 technical standards for web-based applications §1194.22 (a) ("text equivalents for every non-text element"), §1194.22 (b) ("synchronized multimedia alternatives"), §1194.22 (m) ("linking to required plugins and applets"), §1194.22 (n) ("form accessibility to assistive technology"), as well as the Section 508 functional performance criteria §1194.31 (a) ("functional without vision") and §1194.31 (b) ("functional with low vision").

CAPTCHA Section 508 Compliance Checklist: Ensure BotDetect CAPTCHA Usability

CAPTCHA Section 508 Compliance Checklist: Easily Legible BotDetect CAPTCHA Images

BotDetect defaults for all Captcha settings that affect generated image legibility are set to maximize user-friendliness and allow easy reading.

However, BotDetect also allows users a high level of control over Captcha image generation: the image size (ASP.NET, Java, ASP Classic, PHP) and format (ASP.NET, Java, ASP Classic, PHP), Captcha code length (ASP.NET, Java, ASP Classic, PHP), character set (ASP.NET, Java, ASP Classic, PHP), image style / generation algorithm (ASP.NET, Java, ASP Classic, PHP) and the color scheme used (ASP.NET, Java, ASP Classic, PHP) can all be customized and randomized by the user. If you customize BotDetect settings which affect Captcha image generation, you should take care not to make the images too indecipherable to low-sighted visitors.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the Captcha images are large enough to be easily visible even to low-sighted visitors (is the Captcha image too small to be read comfortably?)
  • Check that the Captcha code length fits the Captcha image proportions: the closer the code length is to the image width:height ratio, the more legible the Captcha challenge (is the Captcha code length too large to fit into the image and remain easily readable?)
  • If you're using a custom Captcha character set, check that it doesn't contain any characters that can be confused for each other, such as "1", "l", "7", "I" etc. (does the Captcha image have a high chance of being visually ambiguous to low sighted visitors?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Image Text Alternative

The descriptive text alternative for the Captcha image should also be clear and descriptive enough to screen reader users (and possibly instruct them to use the audio Captcha alternative made specially for them instead), and written in the same language as the rest of the form. If you need to change the Captcha image alternative text, you can use the BotDetect setting for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Since wrapping the Captcha image inside the Captcha help link (when the help link mode is set to image) could unnecessarily extend the screen reader pronunciation of the Captcha image alternative text, setting the help link mode to text is recommended to maximize Section 508 compliance. You can configure it using the BotDetect setting for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect Captcha image alternative text is descriptive enough when read to blind visitors by screen readers such as JAWS (does the text alternative convey all information necessary to use understand what the Captcha image represents and what it is used for?)
  • Check that the BotDetect Captcha image alternative text is written in a language that visitors can understand (does the text alternative locale match the form localization?)
  • Check that the BotDetect help link text or title doesn't interfere with Captcha image alternative text pronunciation in screen readers such as JAWS (is the help link mode set to text?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Images Accessible to Color-Blind Visitors

All Captcha images generated by BotDetect should be easily legible by color-blind visitors. And even if Captcha parameter randomization necessary to achieve the required level of Captcha security occasionally generates an image which could be problematic to the color-blind, they will still be able to use the form by requesting a different Captcha image or using the audio Captcha alternative.

However, if you want to maximize Captcha accessibility to color-blind visitors, you could configure the color scheme used for Captcha image generation to e.g. black and white (in ASP.NET, Java, ASP Classic, or PHP), or instruct BotDetect to only use a subset of the available image styles which you confirm to meet your form accessibility requirements (in ASP.NET, Java, ASP Classic, or PHP).

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that Captcha images don't require the ability to fully distinguish colors (is the Captcha image legible even if some or all color information is lost?)

CAPTCHA Section 508 Compliance Checklist: Requesting a Different BotDetect CAPTCHA Challenge

The ability to request a different Captcha image when the current one is indecipherable is helpful for all visitors (since given a high level of randomization necessary for proper Captcha security, the result may be unpredictable enough to occasionally produce highly challenging images), but is particularly necessary for visitors with low vision. Since asynchronous Captcha image changing requires JavaScript, and BotDetect can not automatically degrade the Captcha changing script to reload your form and preserve user input of other fields when JavaScript is unavailable, you must consider and implement this use case yourself.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect reload icon is shown on the form next to the Captcha image when JavaScript is enabled (is Captcha reloading enabled?)
  • Check that clicking the BotDetect reload icon successfully changes the Captcha image when JavaScript is enabled (is Captcha reloading functional?)
  • Check that the Captcha challenge can be solved and the form successfully submitted after reloading the Captcha image (does Captcha reloading affect form functionality?)
  • Check that the BotDetect reload icon is not shown when JavaScript is disabled (does Captcha reloading degrade gracefully?)
  • Check that reloading the form to get a different Captcha challenge when JavaScript is disabled preserves user input of other form fields (can the visitor always request a new Captcha challenge without affecting other form fields?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Reload Icon Text Alternative

The descriptive text alternative / tooltip for the Captcha reload icon should also be clear and descriptive enough to screen reader users, and written in the same language as the rest of the form. If you need to change the Captcha reload icon tooltip, you can use the BotDetect setting for your core form technology: ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the BotDetect reload icon tooltip is descriptive enough when read to blind visitors by screen readers such as JAWS (does the text alternative convey all information necessary to use Captcha reloading?)
  • Check that the BotDetect reload icon tooltip is written in a language that visitors can understand (does the text alternative locale match the form localization?)

Section 508 Compliance Requirements Affecting BotDetect CAPTCHA Image Implementation

An easy to read, easy to change and generally accessible implementation of image Captcha functionality as outlined above is necessary to meet the Section 508 technical standards for web-based applications §1194.22 (a) ("text equivalents for every non-text element"), §1194.22 (c) ("use of color"), §1194.22 (l) ("accessibility of client-side dynamic content"), as well as the Section 508 functional performance criterion §1194.31 (b) ("functional with low vision").

CAPTCHA Section 508 Compliance Checklist: Tweak BotDetect CAPTCHA User Interaction

CAPTCHA Section 508 Compliance Checklist: Keyboard Navigation of BotDetect CAPTCHA Form Elements

Keyboard is the most widely supported input method, which can be used not only by visitors who have an actual hardware keyboard, but also with speech input, mouse- or touch-operated on-screen keyboards, and many other assistive technologies that can emulate it. BotDetect ensures that all interactive Captcha elements it generates can be used with keyboard only – but you have to incorporate them in your form so it can be properly keyboard-operated as a whole.

If you are manually controlling tabindex values for interactive elements on your form, you will need to configure the starting BotDetect Captcha tabindex value as well (in ASP.NET, Java, ASP Classic, or PHP).

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that the first Captcha element is selected when you navigate forward from the preceding form element using the keyboard (is the BotDetect starting tab index right?)
  • Check that following Captcha elements are selected in the right sequence when navigating from the first Captcha element using the keyboard (is the sequence of BotDetect interactive elements correct?)
  • Check that the Captcha code textbox is selected when you navigate forward from the last Captcha element using the keyboard (is the tab index of the Captcha code textbox right?)
  • Check that the whole Captcha-protected form can be navigated in the right sequence and successfully completed using only keyboard input (is the Captcha-protected form keyboard navigable?)

CAPTCHA Section 508 Compliance Checklist: Accessible BotDetect CAPTCHA Instructions, Help and Feedback Indications

While most users today are familiar with Captcha challenges and how to solve them, clear Captcha-related text is necessary to maximize Section 508 compliance.

Captcha instructions: Just before the Captcha challenge, appropriate Captcha interaction instructions (e.g. "Retype the characters from the picture") should be presented to visitors. They should be written in the same language as the rest of the form, and implemented as a <label> element associated with the Captcha code textbox using the for="..." attribute – this way, screen readers and other assistive technology will be able to adapt the user interaction to meet the needs of disabled visitors.

Captcha feedback: When the visitor form submission fails because they didn't solve the Captcha correctly or at all, textual feedback explaining that Captcha input is required or was incorrect will guide visitors to completing the form. This Captcha error text should be clear, and not depend solely on color or other sensory characteristics to convey the information. This will make it accessible to visitors using screen readers and the color-blind. If Captcha validation succeeds but validation of some other form fields fails, it's best to hide the Captcha since the visitor is already verified as human.

Captcha help: If detailed Captcha instructions are provided (longer than would fit the form), a separate Captcha help page can be embedded in the Captcha challenge using the BotDetect help link feature (ASP.NET, Java, ASP Classic, PHP). Ideally, this Captcha help page will be text-only and will explain the available Captcha accessibility features to accommodate screen reader users.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that Captcha solving instructions are shown on the form before the Captcha challenge, and are descriptive enough to screen reader users (do they convey all information necessary to solve the Captcha?)
  • Check that the BotDetect interaction instructions are written in a language that visitors can understand (does the text locale match the form localization?)
  • Check that clicking the Captcha instructions automatically focuses the Captcha code textbox (are they implemented as a Html <label> and correctly associated with the textbox?)
  • Check that Captcha input is indicated as required when the form is submitted without the Captcha code, with text accessible to screen reader users and the color-blind
  • Check that the user is instructed to re-try the Captcha challenge when the form is submitted with an incorrect Captcha code, using text accessible to screen reader users and the color-blind
  • Check that the Captcha challenge and all associated content is hidden when the visitor solves the Captcha but validation of another form field fails (are you using the BotDetect IsSolved property to minimize user hassle?)
  • Check that the Captcha challenge includes a Captcha help link with detailed instructions for Captcha interaction (is the BotDetect help link configured correctly?)

CAPTCHA Section 508 Compliance Checklist: BotDetect CAPTCHA Validation Without JavaScript and CSS

To make Captcha accessible to the widest possible user base of assistive technology, Captcha functionality should be fully usable by visitors even when JavaScript or CSS are not supported by the client browser. BotDetect has been engineered to degrade gracefully and adapt to the capabilities of the client device – while the visual appearance will suffer and some client-side enhancements will be unavailable, visitors will still be able to read, hear and solve the Captcha code. If you want to maximize Section 508 compliance of your form, you should test and ensure its compatibility in this use case.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that all Captcha elements are still visible on the form when CSS is disabled (the BotDetect sound and reload icons will be displayed below the Captcha image instead of next to it, and all links will have the default link borders)
  • Check that the whole form can be navigated and makes sense (the logical order of form elements is preserved) when CSS is disabled (do any form elements rely on CSS positioning to convey important information?)
  • Check that when JavaScript is disabled, Captcha sound can still be downloaded as a file (since it can't be played automatically in form background without JavaScript)
  • Check that when JavaScript is disabled, the BotDetect reload icon is not shown (since it can only be implemented using JavaScript)
  • Check that reloading the form to get a different Captcha challenge when JavaScript is disabled preserves user input of other form fields (can the visitor always request a new Captcha challenge without affecting other form fields?)
  • Check that Captcha validation displays an error when the Captcha code is missing or incorrect and JavaScript is disabled
  • Check that Captcha validation passes when the Captcha code user input is correct and JavaScript is disabled
  • Check that the whole form can be completed and successfully submitted when JavaScript is disabled

CAPTCHA Section 508 Compliance Checklist: Long Enough BotDetect CAPTCHA Interaction Window

Disabled visitors will often require significantly more time to complete a form than the average visitor. When implementing Captcha validation, it is important that they are given enough time to comprehend and solve the Captcha challenge. BotDetect defaults are designed to be accessible and generous with time, but only web form developers can know how much time does their form take to complete.

Session timeout: Since BotDetect stores Captcha codes in Session state by default, Captcha validation will fail even when the user enters the correct Captcha code if they submit the form after their Session expires. You should set the Session timeout of your website so it's long enough to comfortably complete the form even with significant disability-induced delays.

BotDetect code timeout: BotDetect allows users to limit the time during which validation of each Captcha code is possible (for security purposes: reducing the chances of Captcha reuse attacks). If you change this value, make sure it is not too short to allow disabled users to solve the Captcha challenge. BotDetect code timeout can be configured in ASP.NET, Java, ASP Classic, PHP.

BotDetect automatic reloading: When a Captcha code expires due to the timeout mentioned above, the Captcha image on the client should be automatically reloaded (otherwise, the visitor is interacting with an outdated Captcha challenge). Furthermore, automatic Captcha reloading before the Session expires acts as a "heartbeat" which keeps the visitors Session alive as long as they are interacting with the form. BotDetect automatic reloading is a usability improvement that is enabled by default, and can be configured in ASP.NET, Java, ASP Classic, PHP.

Testing BotDetect CAPTCHA Section 508 Compliance

  • Check that visitors using slower interaction means such as screen readers and voice navigation can comfortably complete the form before the Session expires (is the Session timeout long enough?)
  • Check that the Captcha is unlikely to expire while the user is still interacting with the form (is the Captcha code timeout long enough?)
  • Check that reloading the Captcha image prolongs the visitor's Session (can visitors manually prolong the Session or start a new Captcha timeout when they need it?)
  • Check that expired codes are automatically reloaded when they can no longer be solved and JavaScript is enabled (is automatic reloading of expired codes enabled and configured properly?)
  • Check that automatic reloading of expired Captcha codes prolongs the visitor's Session (is automatic reloading acting as a proper "heartbeat" while the user keeps the form open?)

Section 508 Compliance Requirements Affecting BotDetect CAPTCHA User Interaction Implementation

A usable and accessible implementation of the user Captcha interaction as outlined above is necessary to meet the Section 508 technical standards for web-based applications §1194.22 (c) ("use of color"), §1194.22 (d) ("readability without style sheets"), §1194.22 (l) ("accessibility of client-side dynamic content"), §1194.22 (n) ("form accessibility to assistive technology"), §1194.22 (p) ("timed response extension"), the Section 508 functional performance criteria §1194.31 (a) ("functional without vision"), §1194.31 (b) ("functional with low vision") and §1194.31 (a) ("functional with low motor ability"), as well as the Section 508 provisions in §1194.41 ("information, documentation, and support").

BotDetect CAPTCHA & Section 508: Conclusions & Further Reading

BotDetect Captcha has been engineered to meet as many Section 508 compliance requirements as possible, but web form developers are ultimately responsible for making their Captcha-protected forms comply with Section 508 accessibility standards. This checklist can guide you through the steps necessary to ensure and maximize Section 508 compliance of your web forms using BotDetect Captcha to prevent automated submission.

Strict Standards: CAPTCHA Accessibility