Accessibility Scanner: Ensure Your Website is Inclusive with JOSF
Ensuring your website meets accessibility standards is crucial for creating an inclusive digital experience. With the Accessibility Scanner in JOSF, you can easily detect and verify accessibility issues within your web application. This guide will walk you through how to create an Accessibility Test Case and verify compliance with accessibility standards such as WCAG 2.1.
Creating an Accessibility Test Case in JOSF
Follow these steps to set up an automated accessibility scan for your website:
1. Create a New Test Case
Start by creating a new test case in JOSF to house your accessibility validation steps.
2. Add a Web Navigation Action
- Drag in a Web Browser Action to navigate to the website you want to check.
- Set the URL to the webpage you want to analyze.
3. Open Accessibility Actions
- In the Step Drawer, locate the Accessibility Actions section.
4. Add an Accessibility Scan Action
- Drag in the Scan Accessibility action.
- Choose Scan Webpage to analyze the entire page.
- Alternatively, you can Scan a Specific Web Element to focus on a particular component.
5. Configuring Accessibility Scan Options
To fine-tune your scan, you can configure the following five options:
| Option | Description | Example |
|---|---|---|
| Include | Specify CSS selectors to include in the scan | .header, #main-content, .footer |
| Exclude | Specify CSS selectors to exclude from the scan | .advertisement, .popup |
| With Rules | Limit the scan to specific rules | "color-contrast", "image-alt" |
| With Tags | Restrict scan to specific accessibility tags | "wcag21aa", "best-practice" |
| Disable Rules | Exclude specific rules from execution | "color-contrast", "image-alt" |
- Adjust these settings based on your testing needs and execute the scan.
6. Viewing Accessibility Scan Results
- After executing the scan, the action result will display:
“The scan has been executed.” - However, to view detailed accessibility results, scroll to the test session at the bottom.
- Click the “View Accessibility” button to analyze your findings.
- If you have done multiple scans, you can scroll trough the report in chronological order of the execution.
Pro License Features: Advanced Accessibility Verification
For validation, a JOSF Pro License is required. With this, you can automate accessibility rule verification.
1. Add a Verify Accessibility Action
- Drag in a Verify Accessibility action after the scan step.
- Choose one of the three sub-actions:
2. Verification Options
| Sub-Action | Description |
|---|---|
| Verify No Accessibility Violations | Ensures no violations are present in the scan results. |
| Verify Accessibility Rule | Checks if a specific rule has been violated. |
| Verify Accessibility Impact Level | Validates issues based on severity level. |
3. Allowed Impact Levels And Rules
- “Critical”
- “Serious”
- “Moderate”
- “Minor”
To check all available accessibility rules, refer to axe-core rule descriptions.
Conclusion
The Accessibility Scanner in JOSF helps ensure your website is compliant with accessibility standards. Whether you need a quick scan or deep verification with impact level analysis, this feature provides a structured way to catch and resolve accessibility issues early.
Make your web applications more inclusive today with JOSF! 🚀