Accessibility Adjustments Help

Toggle High Contrast

This button will darken the page's background color to black while making all text white. This high contrast will make it easier to read the website's content.

Toggle Page Zoom

This button will increase the size of all elements on the page.

Toggle Focus State

This button adds a visible focus state to all interactive elements when using the keyboard. This allows the user to know exactly where they are on a site while tabbing through with a keyboard. Note: this will only affect sites that do not currently have visible focus states.

Toggle Link Highlights

This button will add an outline to all links and buttons on a page that a user can interact with.

Accessibility Checker Help

Check Images

This triggers a check of all images on a page for either an 'alt', 'title', or an 'aria-label' attribute. Images that are purely decorative or do not include any information to convey to the user do not need alt text. In these cases, the alt attribute should still be present but should be left empty. Our checker will still flag empty alts as an error just in case.

Check Color Contrast

This triggers a check of all text to ensure that it's color has a high enough contrast against the color of the background it is on. In some cases our checker will flag contrast errors for text that is on top of an image or when either the text or the background element has a position of 'absolute'. In these cases it is up to the site administrator's discretion to determine if the text is legible.

Check Links & Buttons

This triggers a check of all the page's links and buttons. Links and buttons without text or an aria-label describing what the link or button accomplishes will fail. Without text (including hidden screen reader only text) or an aria-label, assistive technology will not be able to determine the purpose of the link/button.

Check For Duplicate IDs

This triggers a search for all IDs on a page. Duplicate IDs will be flagged as an error. Duplicate ID errors are known to cause problems for assistive technologies when they are trying to interact with content. SVGs tend to be a major source of this failure. It's beneficial to remove all IDs from SVGs before placing them on a page.

e-QIP

About e-QIP

For decades U.S. Government agencies used the dreaded SF-86 form for granting security clearances. Users seeking clearance had, until 2019, to use a PDF form that spanned 127 pages. A government contractor, True Tandem, won the contract to re-create this form into an easy-to-use self-guided form that users could complete and submit online; they then hired us to do all the user experience testing, design the form, test it again, and make improvements.

Service:Development, Digital Strategy, Project Management
Industry:Government
Visit:e-qip.opm.gov/

Users have a friendly, easy-to-use form that does not overwhelm, and security clearance investigators have an online tool that provides user information in a quick and clear format.

Learning + Planning

The paper form, even if submitted online, was difficult, inflexible, and massive. Users have to gather a lot of information for the form (sometimes dating back decades, such as high school diplomas, previous addresses, and contact information for relatives). Finding your place on the form to fill in this information as you gathered it was onerous and frustrating. On the other end, the U.S. agencies and contractors who use this information to conduct the security clearance research have to manage folders of paper and flip through 127 pages to find one piece of information.

01/01

Design + Development

Our team designed the form, using the user testing information as well as ongoing testing. The result is a form style that is used as a model for other federal forms. Some of the mobile design features in this case were incorporated into the mobile U.S. Design Standards. Users now have a friendly, easy-to-use form that does not overwhelm, and security clearance investigators have an online tool that provides user information in a quick and clear format.