Read Time: 3 minutes
Whether you’re a cybersecurity officer, developer, data analyst, or in almost any position at OIT, you likely play a part in ensuring digital products are 508 compliant. What this includes depends on your role but knowing the basics will help you prioritize accessibility and save time.
Follow these tips to get a head start on creating accessible digital products:
- Cybersecurity:
- Provide authentication methods that don’t rely solely on vision, hearing, or cognitive function.
- Ensure the authentication method’s purpose is described in text (e.g., “Identify the letters and numbers.”) and that images include alternative text.
- Allow users to choose among multiple biometric identifiers.
- Avoid using CAPTCHA whenever possible as screen reader technology may not recognize CAPTCHA software.
- Provide users a clear warning when a time limit is approaching (e.g., login) and a way to extend the time when possible. The warning should be accessible to screen readers.
- Use proper markup (e.g., use HTML to clearly indicate the structure and relationships of content on a web page) to allow password managers to fill in fields automatically. Websites should not block copy-and-paste functionality whenever possible.
- Applications and websites:
- Use semantic markup (e.g., elements like lists, block quotes, and tables) to develop keyboard- and screen reader-accessible webpages, which enables users to understand the page structure and meaning of content.
- Design user interfaces with consistent and predictable navigation.
- Maintain a logical tab order so that information reads as intended.
- Tab through webpages to test for and remediate keyboard traps (i.e., when a keyboard user is unable to navigate away from an element).
- Highlight active elements with a visible focus indicator.
- Ensure accessibility across devices.
- Use touch targets (e.g., buttons, icons) that are no less than 44 x 44 CSS pixels.
- Enable text to be zoomed to 200 percent without losing information or functionality. Content should not disappear, truncate, or become obscured.
- Fillable forms:
- Include instructions as well as visual, descriptive (e.g., Date: MM/DD/YYYY), and programmatic labels for interactive form fields. Programmatic labels should accurately describe the form element and be associated with the correct input.
- Use text to notify users of errors and how to resolve them (e.g., Enter the phone number in this format: XXX-XXX-XXXX).
- Notify users of unexpected changes that result from interacting with a form field (e.g., provide a notification that a new window launches when clicking a button).
- Data visualization:
- Keep it simple: Avoid the latest aesthetic trends and focus on communication goals.
- Provide a brief description of charts, graphs, and diagrams in the body of the text.
- Provide clear, descriptive labels for data and variables.
- Consider supplementing a graph with a table of information so that it can be read more easily by assistive technology.
- Use accessibility best practices for color, images, and multimedia.
Resources:
Learn more about accessibility guidelines with these resources:
- Section 508:
- Create Accessible Digital Products
- PlanetOIT:
- Developing an Accessibility-First Mindset: Practical Tips to Prioritize Accessibility Daily
- Building a More Accessible OIT: Colors and Images
- Color and Images Accessibility Checklist
- Building a More Accessible OIT: Written Communication
- Accessible Communication Checklist
- Getting Started with Microsoft Word Accessibility
- Getting Started with PDF Accessibility
- All Access: Making Authentication Work for Everyone
- OIT DEI Volume III: Accessibility