Accessibility test digest
Synopsis
Page: U.S. Web Design System
URL: https://designsystem.digital.gov/documentation/accessibility/
Score: 250
Tested by: Testaro, procedure tp12
Scored by: Testilo, procedure sp12a
Digested by: Testilo, procedure dp12a
Introduction
The Testaro application used its tp12 testing procedure to test the accessibility (barrier-free design and coding) of the U.S. Web Design System web page at https://designsystem.digital.gov/documentation/accessibility/ on 2022/07/06. The procedure performed 808 tests. Of these, 16 are custom tests defined by Testaro, and the others belong to these six other packages (programs that perform collections of tests):
- Alfa by Siteimprove
- Axe-core by Deque
- HTML CodeSniffer by Squiz Labs
- Equal Access by IBM
- Tenon by Level Access
- WAVE by WebAIM
Testaro produced a report enumerating the test results.
Testilo processed the report and used the sp12a scoring procedure to compute partial and total scores for the page. The total score is 250 (where 0 is the best possible score). The scored report is appended below.
Finally, Testilo used procedure dp12a to produce this digest, briefly explaining how sp12a computed the scores.
Score summary
| total | 250 |
|---|---|
| contrastAAA | 56 |
| leadingClipsText | 46 |
| linkIndication | 44 |
| noLeading | 14 |
| inconsistentStyles | 10 |
| linkTextsSame | 8 |
| invisibleLabel | 7 |
| contrastAA | 7 |
| targetSize | 6 |
| zIndexNotZero | 5 |
| contrastRisk | 5 |
| linkVague | 5 |
| linkForcesNewWindow | 5 |
| roleBad | 4 |
| pseudoLinkRisk | 4 |
| visibleBulk | 3 |
| hoverSurprise | 3 |
| allCaps | 3 |
| ariaBadAttribute | 3 |
| hiddenContentRisk | 3 |
| pseudoNavListRisk | 3 |
| scrollRisk | 3 |
| videoCaptionRisk | 3 |
Issue summary
Special issues
No special issues contributed to the score.
Classified issues
contrastAAA: Score 56. Issues reported by tests in this category:
- Package
alfa, testr66, score 1 (Text contrast less than AAA requires) - Package
axe, testcolor-contrast-enhanced, score 49 (Element has insufficient color contrast (Level AAA)) - Package
tenon, test95, score 11 (Element has insufficient color contrast (Level AAA))
leadingClipsText: Score 46. Issues reported by tests in this category:
- Package
tenon, test144, score 44 (Line height is insufficent to properly display the computed font size)
linkIndication: Score 44. Issues reported by tests in this category:
- Package
testaro, testlinkUl, score 42 (Non-underlined adjacent links)
noLeading: Score 14. Issues reported by tests in this category:
- Package
alfa, testr73, score 12 (Paragraph of text has insufficient line height)
inconsistentStyles: Score 10. Issues reported by tests in this category:
- Package
testaro, teststyleDiff, score 8 (Heading, link, and button style inconsistencies)
linkTextsSame: Score 8. Issues reported by tests in this category:
- Package
tenon, test98, score 6 (Links have the same text but different destinations)
invisibleLabel: Score 7. Issues reported by tests in this category:
- Package
alfa, testr14, score 3 (Visible label is not in the accessible name) - Package
axe, testlabel-content-name-mismatch, score 2 (Element visible text is not part of its accessible name) - Package
htmlcs, testw:AA.2_5_3.F96, score 2 (Visible label is not in the accessible name)
contrastAA: Score 7. Issues reported by tests in this category:
- Package
axe, testcolor-contrast, score 5 (Element has insufficient color contrast)
targetSize: Score 6. Issues reported by tests in this category:
- Package
tenon, test152, score 4 (Actionable element is smaller than the minimum required size)
zIndexNotZero: Score 5. Issues reported by tests in this category:
- Package
testaro, testzIndex, score 3 (Layering with nondefault z-index values)
contrastRisk: Score 5. Issues reported by tests in this category:
- Package
htmlcs, testw:AA.1_4_3.G145.Alpha, score 1 (Contrast between the text and its background may be less than 3:1, given the transparency) - Package
htmlcs, testw:AA.1_4_3.G18.Alpha, score 2 (Contrast between the text and its background may be less than 4.5:1, given the transparency)
linkVague: Score 5. Issues reported by tests in this category:
- Package
tenon, test73, score 3 (Link text is too generic to communicate the purpose or destination)
linkForcesNewWindow: Score 5. Issues reported by tests in this category:
- Package
tenon, test218, score 3 (Link opens in a new window without user control)
roleBad: Score 4. Issues reported by tests in this category:
- Package
testaro, testrole, score 2 (Nonexistent or implicit-overriding role)
pseudoLinkRisk: Score 4. Issues reported by tests in this category:
- Package
wave, testa:underline, score 1 (CSS underline on text that is not a link) - Package
tenon, test129, score 2 (CSS underline on text that is not a link)
visibleBulk: Score 3. Issues reported by tests in this category:
- Package
testaro, testbulk, score 1 (Page contains many visible elements)
hoverSurprise: Score 3. Issues reported by tests in this category:
- Package
testaro, testhover, score 1 (Content changes caused by hovering)
allCaps: Score 3. Issues reported by tests in this category:
- Package
alfa, testr72, score 1 (Paragraph text is uppercased)
ariaBadAttribute: Score 3. Issues reported by tests in this category:
- Package
axe, testaria-allowed-attr, score 1 (ARIA attribute is invalid for the role of its element)
hiddenContentRisk: Score 3. Issues reported by tests in this category:
- Package
axe, testhidden-content, score 1 (Some content is hidden and therefore may not be testable for accessibility)
pseudoNavListRisk: Score 3. Issues reported by tests in this category:
- Package
htmlcs, testw:AA.1_3_1.H48, score 1 (Navigation links are not coded as a list)
scrollRisk: Score 3. Issues reported by tests in this category:
- Package
htmlcs, testw:AA.1_4_10.C32,C31,C33,C38,SCR34,G206, score 1 (Fixed-position element may force bidirectional scrolling)
videoCaptionRisk: Score 3. Issues reported by tests in this category:
- Package
wave, testa:youtube_video, score 1 (YouTube video may have no or incorrect captions)
Discussion
Although there are widely accepted accessibility standards, there is no unanimity about how to define, test, and quantify accessibility. The failures reported in this digest merit investigation as potential opportunities for improved accessibility. Investigation may lead you to conclude that some of the reported failures do not actually harm accessibility. Conversely, some substantial accessibility faults can escape detection by any of these tests. You may question the attempt to assign an accessibility score to a web page, or you may prefer weightings and formulas different from those used by sp12a. You can modify and extend Testaro and Testilo to fit other theories and priorities.
Here, in brief, is how sp12a computes a score for a page.
- It finds all the defects and warnings (let’s call them
issues
) recorded in the report. - It classifies them according to type. For example, a link that looks like the text around it is one issue category, while a video that has no captions is another issue category.
- It also classifies the issues according to severity. For example, an issue that prevents a transaction is more severe than an issue that only complicates the transaction, and a warning about a possible issue is less severe than a definite finding of an issue. (Some packages rate the severity of each issue; for the other packages,
sp12aassigns a severity weight to the issue type and uses that weight.) - It assigns quality ratings to particular tests that are judged abnormally reliable or unreliable.
- It assigns a score to each issue reported by each test of each package.
- It aggregates the issue scores, weighting them by severity, test quality, and redundancy. Redundancy occurs, and causes downweighting, when two or more packages contain tests that are designed to discover the same or mostly the same issues. So the score for a category is not simply the sum of the scores of the tests in that category.
- It assigns a score for issues in the page logged by the browser.
- It assigns an estimated score each time the page prevents one of the packages or one of the Testaro tests from being run on the page.
- It adds the scores together to obtain a total score.
The precise rules of sp12a are found in the code itself.
Report
{
"id": "3zjtz-uswds",
"host": {
"id": "uswds",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "U.S. Web Design System"
},
"log": [
{
"event": "startTime",
"value": "2022-07-06T00:58:10"
},
{
"event": "endTime",
"value": "2022-07-06T01:00:13"
}
],
"script": {
"id": "tp12",
"what": "Alfa, Axe, HTML CodeSniffer, IBM, Tenon, WAVE, and 16 custom tests",
"strict": true,
"commands": [
{
"type": "launch",
"which": "webkit",
"what": "Webkit browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "U.S. Web Design System"
},
{
"type": "tenonRequest",
"id": "a",
"withNewContent": true,
"what": "Tenon API version 2 test request"
},
{
"type": "test",
"which": "motion",
"what": "spontaneous change of content; requires webkit",
"delay": 2500,
"interval": 2500,
"count": 5
},
{
"type": "launch",
"which": "chromium",
"what": "Chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "U.S. Web Design System"
},
{
"type": "test",
"which": "bulk",
"what": "count of visible elements"
},
{
"type": "test",
"which": "embAc",
"withItems": true,
"what": "active elements incorrectly embedded in each other"
},
{
"type": "test",
"which": "focAll",
"what": "Tab-focusability"
},
{
"type": "test",
"which": "focInd",
"revealAll": false,
"allowedDelay": 250,
"withItems": true,
"what": "focus indicators"
},
{
"type": "test",
"which": "focOp",
"withItems": true,
"what": "focusability and operability of elements"
},
{
"type": "test",
"which": "hover",
"headSize": 20,
"headSampleSize": 20,
"tailSampleSize": 15,
"withItems": true,
"what": "hover impacts"
},
{
"type": "test",
"which": "labClash",
"withItems": true,
"what": "unlabeled and mislabeled form controls"
},
{
"type": "test",
"which": "linkUl",
"withItems": true,
"what": "underlining of inline links"
},
{
"type": "test",
"which": "menuNav",
"withItems": true,
"what": "keyboard navigation within true-focus menus"
},
{
"type": "test",
"which": "radioSet",
"withItems": true,
"what": "grouping of radio buttons in fieldsets"
},
{
"type": "test",
"which": "role",
"what": "validity and necessity of role assignments"
},
{
"type": "test",
"which": "styleDiff",
"withItems": true,
"what": "style consistency of headings, buttons, and links"
},
{
"type": "test",
"which": "tabNav",
"withItems": true,
"what": "keyboard navigation within tab lists"
},
{
"type": "test",
"which": "zIndex",
"withItems": true,
"what": "elements with non-auto z indexes"
},
{
"type": "test",
"which": "alfa",
"what": "Siteimprove alfa"
},
{
"type": "test",
"which": "axe",
"detailLevel": 2,
"rules": [],
"what": "Axe core, all rules"
},
{
"type": "test",
"which": "htmlcs",
"what": "HTML CodeSniffer"
},
{
"type": "test",
"which": "ibm",
"withItems": true,
"what": "IBM Accessibility Checker, with page content and again with URL"
},
{
"type": "test",
"which": "wave",
"reportType": 4,
"what": "WAVE, report-type 4"
},
{
"type": "test",
"which": "tenon",
"id": "a",
"what": "Tenon API version 2 result retrieval"
}
]
},
"acts": [
{
"type": "launch",
"which": "webkit",
"what": "Webkit browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "U.S. Web Design System",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "tenonRequest",
"id": "a",
"withNewContent": true,
"what": "Tenon API version 2 test request",
"url": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "motion",
"what": "motion",
"delay": 2500,
"interval": 2500,
"count": 5,
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"bytes": [
169912,
169912,
169912,
169912,
169912
],
"localRatios": [
1,
1,
1,
1
],
"meanLocalRatio": 1,
"maxLocalRatio": 1,
"globalRatio": 1,
"pixelChanges": [
0,
0,
0,
0
],
"meanPixelChange": 0,
"maxPixelChange": 0,
"changeFrequency": 0
}
},
{
"type": "launch",
"which": "chromium",
"what": "Chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "U.S. Web Design System",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "bulk",
"what": "count of visible elements",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"visibleElements": 367
}
},
{
"type": "test",
"which": "embAc",
"withItems": true,
"what": "active elements embedded in links or buttons",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"links": 0,
"buttons": 0,
"inputs": 0,
"selects": 0
},
"items": []
}
},
{
"type": "test",
"which": "focAll",
"what": "focusable and Tab-focused elements",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"tabFocusables": 86,
"tabFocused": 86,
"discrepancy": 0
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "focInd",
"revealAll": false,
"allowedDelay": 250,
"withItems": true,
"what": "focus indicators",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"total": 86,
"types": {
"indicatorMissing": {
"total": 0,
"tagNames": {}
},
"nonOutlinePresent": {
"total": 0,
"tagNames": {}
},
"outlinePresent": {
"total": 86,
"meanDelay": 7,
"tagNames": {
"A": 83,
"BUTTON": 2,
"INPUT": 1
}
}
}
},
"items": {
"indicatorMissing": [],
"nonOutlinePresent": [],
"outlinePresent": [
{
"tagName": "A",
"text": "Skip to main content",
"delay": 104
},
{
"tagName": "BUTTON",
"text": "Here’s how you know",
"delay": 0
},
{
"tagName": "A",
"text": "USWDS U.S. Web Design System (USWDS)",
"delay": 0
},
{
"tagName": "INPUT",
"text": "",
"delay": 0
},
{
"tagName": "BUTTON",
"text": "",
"delay": 0
},
{
"tagName": "A",
"text": "Read website standards",
"delay": 0
},
{
"tagName": "A",
"text": "Download v3.0.2",
"delay": 0
},
{
"tagName": "A",
"text": "Github logo View on GitHub",
"delay": 0
},
{
"tagName": "A",
"text": "How to use USWDS",
"delay": 0
},
{
"tagName": "A",
"text": "Design principles",
"delay": 0
},
{
"tagName": "A",
"text": "Components",
"delay": 0
},
{
"tagName": "A",
"text": "Design tokens",
"delay": 0
},
{
"tagName": "A",
"text": "Utilities",
"delay": 0
},
{
"tagName": "A",
"text": "Templates",
"delay": 0
},
{
"tagName": "A",
"text": "About",
"delay": 0
},
{
"tagName": "A",
"text": "How to use USWDS",
"delay": 0
},
{
"tagName": "A",
"text": "Getting started for developers",
"delay": 0
},
{
"tagName": "A",
"text": "Getting started for designers",
"delay": 0
},
{
"tagName": "A",
"text": "Documentation",
"delay": 0
},
{
"tagName": "A",
"text": "Settings",
"delay": 0
},
{
"tagName": "A",
"text": "USWDS maturity model",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility",
"delay": 0
},
{
"tagName": "A",
"text": "Common patterns USWDS addresses",
"delay": 0
},
{
"tagName": "A",
"text": "What the design system does",
"delay": 0
},
{
"tagName": "A",
"text": "What project teams should do",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility resources",
"delay": 0
},
{
"tagName": "A",
"text": "Performance guidelines",
"delay": 0
},
{
"tagName": "A",
"text": "Code guidelines",
"delay": 0
},
{
"tagName": "A",
"text": "Migrating to USWDS 3.0",
"delay": 0
},
{
"tagName": "A",
"text": "Migrating to USWDS 2.0",
"delay": 0
},
{
"tagName": "A",
"text": "Video tutorials",
"delay": 0
},
{
"tagName": "A",
"text": "Implementations",
"delay": 0
},
{
"tagName": "A",
"text": "Showcase",
"delay": 0
},
{
"tagName": "A",
"text": "Sample contract language for 21st Century IDEA",
"delay": 0
},
{
"tagName": "A",
"text": "Website standards",
"delay": 0
},
{
"tagName": "A",
"text": "contribute to the community",
"delay": 0
},
{
"tagName": "A",
"text": "Usability testing on Digital.gov",
"delay": 0
},
{
"tagName": "A",
"text": "Getting started with usability testing",
"delay": 0
},
{
"tagName": "A",
"text": "Testing for plain-language usability",
"delay": 0
},
{
"tagName": "A",
"text": "18F’s collection of human-centered design tools",
"delay": 0
},
{
"tagName": "A",
"text": "The Section 508 accessibility program",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility for Teams guide",
"delay": 0
},
{
"tagName": "A",
"text": "Find your Section 508 Coordinator",
"delay": 0
},
{
"tagName": "A",
"text": "Section 508 ICT Testing Baseline",
"delay": 0
},
{
"tagName": "A",
"text": "Learn about writing in plain language",
"delay": 0
},
{
"tagName": "A",
"text": "Plain language resources",
"delay": 0
},
{
"tagName": "A",
"text": "18F’s accessibility guide",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility Requirements Tool (ART) for contracting",
"delay": 0
},
{
"tagName": "A",
"text": "Understanding universal design",
"delay": 0
},
{
"tagName": "A",
"text": "Web Accessibility Perspectives Videos",
"delay": 0
},
{
"tagName": "A",
"text": "Inclusive design principles",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility fundamentals with Rob Dodson",
"delay": 0
},
{
"tagName": "A",
"text": "Microsoft’s inclusive design manual",
"delay": 0
},
{
"tagName": "A",
"text": "Inclusive components by Heydon Pickering",
"delay": 0
},
{
"tagName": "A",
"text": "Humane by design",
"delay": 0
},
{
"tagName": "A",
"text": "your agency’s accessibility team",
"delay": 0
},
{
"tagName": "A",
"text": "how people with disabilities use the web",
"delay": 0
},
{
"tagName": "A",
"text": "Revised 508 Standards",
"delay": 0
},
{
"tagName": "A",
"text": "WCAG 2.0",
"delay": 0
},
{
"tagName": "A",
"text": "Section508.gov",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility for Teams",
"delay": 0
},
{
"tagName": "A",
"text": "18F Accessibility Guide",
"delay": 0
},
{
"tagName": "A",
"text": "inclusive design",
"delay": 0
},
{
"tagName": "A",
"text": "plain language",
"delay": 0
},
{
"tagName": "A",
"text": "headings",
"delay": 0
},
{
"tagName": "A",
"text": "images",
"delay": 0
},
{
"tagName": "A",
"text": "links",
"delay": 0
},
{
"tagName": "A",
"text": "Trusted Tester and ICT Testing Baseline",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility Requirements Tool",
"delay": 0
},
{
"tagName": "A",
"text": "languages other than English",
"delay": 0
},
{
"tagName": "A",
"text": "Was this page helpful?",
"delay": 0
},
{
"tagName": "A",
"text": "Reach out in GitHub",
"delay": 0
},
{
"tagName": "A",
"text": "Find a channel that works for you",
"delay": 0
},
{
"tagName": "A",
"text": "Sign up for USWDS updates",
"delay": 0
},
{
"tagName": "A",
"text": "Email the USWDS team",
"delay": 0
},
{
"tagName": "A",
"text": "Visit v1.designsystem.digital.gov",
"delay": 0
},
{
"tagName": "A",
"text": "",
"delay": 0
},
{
"tagName": "A",
"text": "General Services Administration",
"delay": 0
},
{
"tagName": "A",
"text": "About GSA",
"delay": 0
},
{
"tagName": "A",
"text": "Accessibility support",
"delay": 0
},
{
"tagName": "A",
"text": "FOIA requests",
"delay": 0
},
{
"tagName": "A",
"text": "No FEAR Act data",
"delay": 0
},
{
"tagName": "A",
"text": "Office of the Inspector General",
"delay": 0
},
{
"tagName": "A",
"text": "Performance reports",
"delay": 0
},
{
"tagName": "A",
"text": "Privacy policy",
"delay": 0
},
{
"tagName": "A",
"text": "Visit USA.gov",
"delay": 0
}
]
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "focOp",
"withItems": true,
"what": "focusability and operability",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"total": 213,
"types": {
"onlyFocusable": {
"total": 0,
"tagNames": {}
},
"onlyOperable": {
"total": 0,
"tagNames": {}
},
"focusableAndOperable": {
"total": 213,
"tagNames": {
"A": 196,
"BUTTON": 11,
"INPUT": 6
}
}
}
},
"items": {
"onlyFocusable": [],
"onlyOperable": [],
"focusableAndOperable": [
{
"tagName": "A",
"id": "",
"text": "Skip to main content",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Here’s how you know",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "USWDS U.S. Web Design System (USWDS)",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Menu",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "",
"text": "<input name=\"utf8\" type=\"hidden\" value=\"✓\">",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "affiliate",
"text": "<input type=\"hidden\" name=\"affiliate\" id=\"affiliate\" value=\"uswds\">",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "query",
"text": "<input id=\"query\" class=\"usa-input usagov-search-autocomplete\" name=\"query\" type",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "BUTTON",
"id": "",
"text": "<button class=\"usa-button\" type=\"submit\" name=\"commit\" style=\"cursor: default;\">",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Read website standards",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Download v3.0.2",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Github logo View on GitHub",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "How to use USWDS",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Design principles",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Components",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Design tokens",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Utilities",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Templates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "About",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "<button class=\"usa-nav__close\"> <img src=\"/assets/img/usa-icons/close.svg\" role=",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "",
"text": "<input name=\"utf8\" type=\"hidden\" value=\"✓\">",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "affiliate-mobile",
"text": "<input type=\"hidden\" name=\"affiliate\" id=\"affiliate-mobile\" value=\"uswds\">",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "INPUT",
"id": "query-mobile",
"text": "<input id=\"query-mobile\" class=\"usa-input usagov-search-autocomplete\" name=\"quer",
"byTag": true,
"byOnClick": false,
"byPointer": false
},
{
"tagName": "BUTTON",
"id": "",
"text": "<button class=\"usa-button margin-top-0\" type=\"submit\" name=\"commit\" style=\"curso",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "How to use USWDS",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "How to use USWDS",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Getting started for developers",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Getting started for designers",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Documentation",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Settings",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "USWDS maturity model",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Common patterns USWDS addresses",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "What the design system does",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "What project teams should do",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility resources",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Performance guidelines",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Code guidelines",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Migrating to USWDS 3.0",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Migrating to USWDS 2.0",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Video tutorials",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Implementations",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Showcase",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Sample contract language for 21st Century IDEA",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Website standards",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Design principles",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Components",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Components",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accordion",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Alert",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Banner",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Breadcrumb",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Button",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Button group",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Card",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Character count",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Checkbox",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Collection",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Combo box",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Data visualizations",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Date picker",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Date range picker",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "File input",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Footer",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Form",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Grid",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Header",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Icon",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Icon list",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Identifier",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Input prefix or suffix",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Link",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "List",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Memorable date",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Modal",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Pagination",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Process list",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Prose",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Radio buttons",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Range slider",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Search",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Select",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Side navigation",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Site alert",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Step indicator",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Summary box",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Table",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Tag",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Text input",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Time picker",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Tooltip",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Typography",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Validation",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Design tokens",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Design tokens",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Color",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Typesetting",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Flex",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Opacity",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Order",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Shadow",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Spacing units",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Z-index",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Utilities",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Utilities",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Layout grid",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Color",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Height and width",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Margin and padding",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Border",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Outline",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Font size and family",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Text styles",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Paragraph styles",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Display",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Flex",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Shadow",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Float",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Clearfix",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "List reset",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "Templates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Templates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "404 page",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Documentation page",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Landing page",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Authentication pages",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Form templates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "BUTTON",
"id": "",
"text": "About",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "About",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Key benefits",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Product values",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Contribute",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Community",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "What’s new",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Release notes",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "News and updates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Product roadmap",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Research",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Security",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Website policies and notices",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Read website standards",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Download v3.0.2",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Github logo View on GitHub",
"byTag": true,
"byOnClick": true,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "How to use USWDS",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Getting started for developers",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Getting started for designers",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Documentation",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Settings",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "USWDS maturity model",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Common patterns USWDS addresses",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "What the design system does",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "What project teams should do",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility resources",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Performance guidelines",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Code guidelines",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Migrating to USWDS 3.0",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Migrating to USWDS 2.0",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Video tutorials",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Implementations",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Showcase",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Sample contract language for 21st Century IDEA",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Website standards",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "contribute to the community",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Usability testing on Digital.gov",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Getting started with usability testing",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Testing for plain-language usability",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "18F’s collection of human-centered design tools",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "The Section 508 accessibility program",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility for Teams guide",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Find your Section 508 Coordinator",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Section 508 ICT Testing Baseline",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Learn about writing in plain language",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Plain language resources",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "18F’s accessibility guide",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility Requirements Tool (ART) for contracting",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Understanding universal design",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Web Accessibility Perspectives Videos",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Inclusive design principles",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility fundamentals with Rob Dodson",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Microsoft’s inclusive design manual",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Inclusive components by Heydon Pickering",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Humane by design",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "your agency’s accessibility team",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "how people with disabilities use the web",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Revised 508 Standards",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "WCAG 2.0",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Section508.gov",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility for Teams",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "18F Accessibility Guide",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "inclusive design",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "plain language",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "headings",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "images",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "links",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Trusted Tester and ICT Testing Baseline",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility Requirements Tool",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "languages other than English",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Was this page helpful?",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Reach out in GitHub",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Find a channel that works for you",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Sign up for USWDS updates",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Email the USWDS team",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Visit v1.designsystem.digital.gov",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "<a href=\"javascript:void(0);\" class=\"usa-identifier__logo\" style=\"cursor: defaul",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "General Services Administration",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "About GSA",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Accessibility support",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "FOIA requests",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "No FEAR Act data",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Office of the Inspector General",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Performance reports",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Privacy policy",
"byTag": true,
"byOnClick": false,
"byPointer": true
},
{
"tagName": "A",
"id": "",
"text": "Visit USA.gov",
"byTag": true,
"byOnClick": false,
"byPointer": true
}
]
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "hover",
"headSize": 20,
"headSampleSize": 20,
"tailSampleSize": 15,
"withItems": true,
"what": "hover-caused content changes",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"triggers": 207,
"headTriggers": 20,
"tailTriggers": 187,
"impactTriggers": 0,
"additions": 0,
"removals": 0,
"opacityChanges": 0,
"opacityImpact": 0,
"unhoverables": 1
},
"items": {
"head": {
"impactTriggers": [],
"unhoverables": [
{
"tagName": "A",
"id": "",
"text": "Skiptomaincontent"
}
]
},
"tail": {
"impactTriggers": [],
"unhoverables": []
}
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "labClash",
"withItems": true,
"what": "labeling inconsistencies",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"mislabeled": 0,
"unlabeled": 3,
"wellLabeled": 10
},
"items": {
"mislabeled": [],
"unlabeled": [
{
"index": 3,
"tagName": "BUTTON",
"type": "submit",
"content": "{<button class=\"usa-button\" type=\"submit\" name=\"commit\"> <img src=\"/assets/img/usa-icons-bg/search--white.svg\" class=\"usa-search__submit-icon\" alt=\"Search\"> </button>}"
},
{
"index": 4,
"tagName": "BUTTON",
"type": "submit",
"content": "{<button class=\"usa-nav__close\"> <img src=\"/assets/img/usa-icons/close.svg\" role=\"img\" alt=\"Close\"> </button>}"
},
{
"index": 6,
"tagName": "BUTTON",
"type": "submit",
"content": "{<button class=\"usa-button margin-top-0\" type=\"submit\" name=\"commit\"> <img src=\"/assets/img/usa-icons-bg/search--white.svg\" class=\"usa-search__submit-icon\" alt=\"Search\"> </button>}"
}
],
"wellLabeled": [
{
"index": 0,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Here’s how you know"
}
},
{
"index": 1,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Menu"
}
},
{
"index": 2,
"tagName": "INPUT",
"type": "search",
"labelType": "label",
"texts": {
"label": [
"Search"
]
}
},
{
"index": 5,
"tagName": "INPUT",
"type": "search",
"labelType": "label",
"texts": {
"label": [
"Search"
]
}
},
{
"index": 7,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "How to use USWDS"
}
},
{
"index": 8,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Components"
}
},
{
"index": 9,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Design tokens"
}
},
{
"index": 10,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Utilities"
}
},
{
"index": 11,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "Templates"
}
},
{
"index": 12,
"tagName": "BUTTON",
"type": "submit",
"texts": {
"content": "About"
}
}
]
}
}
},
{
"type": "test",
"which": "linkUl",
"withItems": true,
"what": "adjacent-link underlining",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"links": 196,
"adjacent": {
"total": 85,
"underlined": 43,
"underlinedPercent": 50
}
},
"items": {
"underlined": [
"Skip to main content",
"contribute to the community",
"Usability testing on Digital.gov",
"Getting started with usability testing",
"Testing for plain-language usability",
"18F’s collection of human-centered design tools",
"The Section 508 accessibility program",
"Accessibility for Teams guide",
"Find your Section 508 Coordinator",
"Section 508 ICT Testing Baseline",
"Learn about writing in plain language",
"Plain language resources",
"18F’s accessibility guide",
"Accessibility Requirements Tool (ART) for contracting",
"Understanding universal design",
"Web Accessibility Perspectives Videos",
"Inclusive design principles",
"Accessibility fundamentals with Rob Dodson",
"Microsoft’s inclusive design manual",
"Inclusive components by Heydon Pickering",
"Humane by design",
"your agency’s accessibility team",
"how people with disabilities use the web",
"Revised 508 Standards",
"WCAG 2.0",
"Section508.gov",
"Accessibility for Teams",
"18F Accessibility Guide",
"inclusive design",
"plain language",
"headings",
"images",
"links",
"Trusted Tester and ICT Testing Baseline",
"Accessibility Requirements Tool",
"languages other than English",
"Reach out in GitHub",
"Find a channel that works for you",
"Sign up for USWDS updates",
"Email the USWDS team",
"Visit v1.designsystem.digital.gov",
"General Services Administration",
"Visit USA.gov"
],
"notUnderlined": [
"USWDS U.S. Web Design System (USWDS)",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Accessibility",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"Design principles",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Accessibility",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"Was this page helpful?",
""
]
}
}
},
{
"type": "test",
"which": "menuNav",
"withItems": true,
"what": "keyboard navigation between focusable menu items",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"navigations": {
"all": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"specific": {
"tab": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"left": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"right": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"up": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"down": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"home": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"end": {
"total": 0,
"correct": 0,
"incorrect": 0
}
}
},
"menuItems": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"menus": {
"total": 0,
"correct": 0,
"incorrect": 0
}
},
"menuItems": {
"incorrect": [],
"correct": []
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "radioSet",
"withItems": true,
"what": "fieldset grouping of radio buttons",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"total": 0,
"inSet": 0,
"percent": "N.A."
},
"items": {
"inSet": [],
"notInSet": []
}
}
},
{
"type": "test",
"which": "role",
"what": "roles",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"roleElements": 14,
"badRoleElements": 3,
"tagNames": {
"HEADER": {
"banner": 1
},
"NAV": {
"navigation": 1
},
"SECTION": {
"complementary": 1
}
}
}
},
{
"type": "test",
"which": "styleDiff",
"withItems": true,
"what": "style inconsistencies",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"mainStyles": [
"fontStyle",
"fontWeight",
"opacity",
"textDecorationLine",
"textDecorationStyle",
"textDecorationThickness"
],
"buttonStyles": [
"borderStyle",
"borderWidth",
"height",
"lineHeight",
"maxHeight",
"maxWidth",
"minHeight",
"minWidth",
"outlineOffset",
"outlineStyle",
"outlineWidth"
],
"headingStyles": [
"color",
"fontSize"
],
"listLinkStyles": [
"color",
"fontSize",
"lineHeight"
],
"totals": {
"button": {
"total": 11,
"subtotals": [
6,
1,
1,
1,
1,
1
]
},
"adjacentLink": {
"total": 85,
"subtotals": [
40,
32,
10,
3
]
},
"listLink": {
"total": 111,
"subtotals": [
93,
7,
6,
4,
1
]
},
"h1": {
"total": 1
},
"h2": {
"total": 5
},
"h3": {
"total": 19,
"subtotals": [
15,
4
]
}
},
"items": {
"button": {
"fontWeight": {
"400": [
"Here’s how you know",
"Menu",
""
],
"700": [
"",
"",
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
]
},
"textDecorationLine": {
"none": [
"Here’s how you know",
"Menu",
"",
"",
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
],
"underline": [
""
]
},
"height": {
"14.3984px": [
"Here’s how you know"
],
"48px": [
"Menu",
""
],
"39px": [
""
],
"32px": [
""
],
"auto": [
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
]
},
"lineHeight": {
"14.4px": [
"Here’s how you know"
],
"14.904px": [
"Menu"
],
"15.264px": [
"",
""
],
"18.4px": [
""
],
"17.856px": [
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
]
},
"minHeight": {
"auto": [
"Here’s how you know",
""
],
"0px": [
"Menu",
"",
"",
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
]
},
"minWidth": {
"auto": [
"Here’s how you know"
],
"0px": [
"Menu",
"",
"How to use USWDS",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
],
"48px": [
"",
""
]
}
},
"adjacentLink": {
"fontWeight": {
"400": [
"Skip to main content",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Accessibility",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"contribute to the community",
"Usability testing on Digital.gov",
"Getting started with usability testing",
"Testing for plain-language usability",
"18F’s collection of human-centered design tools",
"The Section 508 accessibility program",
"Accessibility for Teams guide",
"Find your Section 508 Coordinator",
"Section 508 ICT Testing Baseline",
"Learn about writing in plain language",
"Plain language resources",
"18F’s accessibility guide",
"Accessibility Requirements Tool (ART) for contracting",
"Understanding universal design",
"Web Accessibility Perspectives Videos",
"Inclusive design principles",
"Accessibility fundamentals with Rob Dodson",
"Microsoft’s inclusive design manual",
"Inclusive components by Heydon Pickering",
"Humane by design",
"your agency’s accessibility team",
"how people with disabilities use the web",
"Revised 508 Standards",
"WCAG 2.0",
"Section508.gov",
"Accessibility for Teams",
"18F Accessibility Guide",
"inclusive design",
"plain language",
"headings",
"images",
"links",
"Trusted Tester and ICT Testing Baseline",
"Accessibility Requirements Tool",
"languages other than English",
"Reach out in GitHub",
"Find a channel that works for you",
"Sign up for USWDS updates",
"Email the USWDS team",
""
],
"700": [
"USWDS U.S. Web Design System (USWDS)",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"Design principles",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"Accessibility",
"Was this page helpful?",
"Visit v1.designsystem.digital.gov",
"General Services Administration",
"Visit USA.gov"
]
},
"textDecorationLine": {
"underline": [
"Skip to main content",
"contribute to the community",
"Usability testing on Digital.gov",
"Getting started with usability testing",
"Testing for plain-language usability",
"18F’s collection of human-centered design tools",
"The Section 508 accessibility program",
"Accessibility for Teams guide",
"Find your Section 508 Coordinator",
"Section 508 ICT Testing Baseline",
"Learn about writing in plain language",
"Plain language resources",
"18F’s accessibility guide",
"Accessibility Requirements Tool (ART) for contracting",
"Understanding universal design",
"Web Accessibility Perspectives Videos",
"Inclusive design principles",
"Accessibility fundamentals with Rob Dodson",
"Microsoft’s inclusive design manual",
"Inclusive components by Heydon Pickering",
"Humane by design",
"your agency’s accessibility team",
"how people with disabilities use the web",
"Revised 508 Standards",
"WCAG 2.0",
"Section508.gov",
"Accessibility for Teams",
"18F Accessibility Guide",
"inclusive design",
"plain language",
"headings",
"images",
"links",
"Trusted Tester and ICT Testing Baseline",
"Accessibility Requirements Tool",
"languages other than English",
"Reach out in GitHub",
"Find a channel that works for you",
"Sign up for USWDS updates",
"Email the USWDS team",
"Visit v1.designsystem.digital.gov",
"General Services Administration",
"Visit USA.gov"
],
"none": [
"USWDS U.S. Web Design System (USWDS)",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Accessibility",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"Design principles",
"Read website standards",
"Download v3.0.2",
"Github logo View on GitHub",
"How to use USWDS",
"Getting started for developers",
"Getting started for designers",
"Documentation",
"Settings",
"USWDS maturity model",
"Accessibility",
"Performance guidelines",
"Code guidelines",
"Migrating to USWDS 3.0",
"Migrating to USWDS 2.0",
"Video tutorials",
"Implementations",
"Showcase",
"Sample contract language for 21st Century IDEA",
"Website standards",
"Was this page helpful?",
""
]
}
},
"listLink": {
"fontWeight": {
"400": [
"Design principles",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About",
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"Components",
"Accordion",
"Alert",
"Banner",
"Breadcrumb",
"Button",
"Button group",
"Card",
"Character count",
"Checkbox",
"Collection",
"Combo box",
"Data visualizations",
"Date picker",
"Date range picker",
"File input",
"Footer",
"Form",
"Grid",
"Header",
"Icon",
"Icon list",
"Identifier",
"Input prefix or suffix",
"Link",
"List",
"Memorable date",
"Modal",
"Pagination",
"Process list",
"Prose",
"Radio buttons",
"Range slider",
"Search",
"Select",
"Side navigation",
"Site alert",
"Step indicator",
"Summary box",
"Table",
"Tag",
"Text input",
"Time picker",
"Tooltip",
"Typography",
"Validation",
"Design tokens",
"Color",
"Typesetting",
"Flex",
"Opacity",
"Order",
"Shadow",
"Spacing units",
"Z-index",
"Utilities",
"Layout grid",
"Color",
"Height and width",
"Margin and padding",
"Border",
"Outline",
"Font size and family",
"Text styles",
"Paragraph styles",
"Display",
"Flex",
"Shadow",
"Float",
"Clearfix",
"List reset",
"Templates",
"404 page",
"Documentation page",
"Landing page",
"Authentication pages",
"Form templates",
"About",
"Key benefits",
"Product values",
"Contribute",
"Community",
"What’s new",
"Release notes",
"News and updates",
"Product roadmap",
"Research",
"Security",
"Website policies and notices",
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"About GSA",
"Accessibility support",
"FOIA requests",
"No FEAR Act data",
"Office of the Inspector General",
"Performance reports",
"Privacy policy"
],
"700": [
"How to use USWDS"
]
},
"textDecorationLine": {
"none": [
"How to use USWDS",
"Design principles",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About",
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"Components",
"Accordion",
"Alert",
"Banner",
"Breadcrumb",
"Button",
"Button group",
"Card",
"Character count",
"Checkbox",
"Collection",
"Combo box",
"Data visualizations",
"Date picker",
"Date range picker",
"File input",
"Footer",
"Form",
"Grid",
"Header",
"Icon",
"Icon list",
"Identifier",
"Input prefix or suffix",
"Link",
"List",
"Memorable date",
"Modal",
"Pagination",
"Process list",
"Prose",
"Radio buttons",
"Range slider",
"Search",
"Select",
"Side navigation",
"Site alert",
"Step indicator",
"Summary box",
"Table",
"Tag",
"Text input",
"Time picker",
"Tooltip",
"Typography",
"Validation",
"Design tokens",
"Color",
"Typesetting",
"Flex",
"Opacity",
"Order",
"Shadow",
"Spacing units",
"Z-index",
"Utilities",
"Layout grid",
"Color",
"Height and width",
"Margin and padding",
"Border",
"Outline",
"Font size and family",
"Text styles",
"Paragraph styles",
"Display",
"Flex",
"Shadow",
"Float",
"Clearfix",
"List reset",
"Templates",
"404 page",
"Documentation page",
"Landing page",
"Authentication pages",
"Form templates",
"About",
"Key benefits",
"Product values",
"Contribute",
"Community",
"What’s new",
"Release notes",
"News and updates",
"Product roadmap",
"Research",
"Security",
"Website policies and notices",
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources"
],
"underline": [
"About GSA",
"Accessibility support",
"FOIA requests",
"No FEAR Act data",
"Office of the Inspector General",
"Performance reports",
"Privacy policy"
]
},
"color": {
"rgba(0, 0, 0, 0.8)": [
"How to use USWDS"
],
"rgb(117, 117, 117)": [
"Design principles",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
],
"rgb(255, 255, 255)": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"Components",
"Accordion",
"Alert",
"Banner",
"Breadcrumb",
"Button",
"Button group",
"Card",
"Character count",
"Checkbox",
"Collection",
"Combo box",
"Data visualizations",
"Date picker",
"Date range picker",
"File input",
"Footer",
"Form",
"Grid",
"Header",
"Icon",
"Icon list",
"Identifier",
"Input prefix or suffix",
"Link",
"List",
"Memorable date",
"Modal",
"Pagination",
"Process list",
"Prose",
"Radio buttons",
"Range slider",
"Search",
"Select",
"Side navigation",
"Site alert",
"Step indicator",
"Summary box",
"Table",
"Tag",
"Text input",
"Time picker",
"Tooltip",
"Typography",
"Validation",
"Design tokens",
"Color",
"Typesetting",
"Flex",
"Opacity",
"Order",
"Shadow",
"Spacing units",
"Z-index",
"Utilities",
"Layout grid",
"Color",
"Height and width",
"Margin and padding",
"Border",
"Outline",
"Font size and family",
"Text styles",
"Paragraph styles",
"Display",
"Flex",
"Shadow",
"Float",
"Clearfix",
"List reset",
"Templates",
"404 page",
"Documentation page",
"Landing page",
"Authentication pages",
"Form templates",
"About",
"Key benefits",
"Product values",
"Contribute",
"Community",
"What’s new",
"Release notes",
"News and updates",
"Product roadmap",
"Research",
"Security",
"Website policies and notices"
],
"rgb(92, 92, 92)": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources"
],
"rgb(173, 173, 173)": [
"About GSA",
"Accessibility support",
"FOIA requests",
"No FEAR Act data",
"Office of the Inspector General",
"Performance reports",
"Privacy policy"
]
},
"fontSize": {
"15.04px": [
"How to use USWDS",
"Design principles",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About",
"About GSA",
"Accessibility support",
"FOIA requests",
"No FEAR Act data",
"Office of the Inspector General",
"Performance reports",
"Privacy policy"
],
"14.08px": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"Components",
"Accordion",
"Alert",
"Banner",
"Breadcrumb",
"Button",
"Button group",
"Card",
"Character count",
"Checkbox",
"Collection",
"Combo box",
"Data visualizations",
"Date picker",
"Date range picker",
"File input",
"Footer",
"Form",
"Grid",
"Header",
"Icon",
"Icon list",
"Identifier",
"Input prefix or suffix",
"Link",
"List",
"Memorable date",
"Modal",
"Pagination",
"Process list",
"Prose",
"Radio buttons",
"Range slider",
"Search",
"Select",
"Side navigation",
"Site alert",
"Step indicator",
"Summary box",
"Table",
"Tag",
"Text input",
"Time picker",
"Tooltip",
"Typography",
"Validation",
"Design tokens",
"Color",
"Typesetting",
"Flex",
"Opacity",
"Order",
"Shadow",
"Spacing units",
"Z-index",
"Utilities",
"Layout grid",
"Color",
"Height and width",
"Margin and padding",
"Border",
"Outline",
"Font size and family",
"Text styles",
"Paragraph styles",
"Display",
"Flex",
"Shadow",
"Float",
"Clearfix",
"List reset",
"Templates",
"404 page",
"Documentation page",
"Landing page",
"Authentication pages",
"Form templates",
"About",
"Key benefits",
"Product values",
"Contribute",
"Community",
"What’s new",
"Release notes",
"News and updates",
"Product roadmap",
"Research",
"Security",
"Website policies and notices"
],
"12.96px": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources"
]
},
"lineHeight": {
"15.04px": [
"How to use USWDS",
"Design principles",
"Components",
"Design tokens",
"Utilities",
"Templates",
"About"
],
"18.304px": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources",
"Components",
"Accordion",
"Alert",
"Banner",
"Breadcrumb",
"Button",
"Button group",
"Card",
"Character count",
"Checkbox",
"Collection",
"Combo box",
"Data visualizations",
"Date picker",
"Date range picker",
"File input",
"Footer",
"Form",
"Grid",
"Header",
"Icon",
"Icon list",
"Identifier",
"Input prefix or suffix",
"Link",
"List",
"Memorable date",
"Modal",
"Pagination",
"Process list",
"Prose",
"Radio buttons",
"Range slider",
"Search",
"Select",
"Side navigation",
"Site alert",
"Step indicator",
"Summary box",
"Table",
"Tag",
"Text input",
"Time picker",
"Tooltip",
"Typography",
"Validation",
"Design tokens",
"Color",
"Typesetting",
"Flex",
"Opacity",
"Order",
"Shadow",
"Spacing units",
"Z-index",
"Utilities",
"Layout grid",
"Color",
"Height and width",
"Margin and padding",
"Border",
"Outline",
"Font size and family",
"Text styles",
"Paragraph styles",
"Display",
"Flex",
"Shadow",
"Float",
"Clearfix",
"List reset",
"Templates",
"404 page",
"Documentation page",
"Landing page",
"Authentication pages",
"Form templates",
"About",
"Key benefits",
"Product values",
"Contribute",
"Community",
"What’s new",
"Release notes",
"News and updates",
"Product roadmap",
"Research",
"Security",
"Website policies and notices"
],
"18.144px": [
"Common patterns USWDS addresses",
"What the design system does",
"What project teams should do",
"Accessibility resources"
],
"21.056px": [
"About GSA",
"Accessibility support",
"FOIA requests",
"No FEAR Act data",
"Office of the Inspector General",
"Performance reports",
"Privacy policy"
]
}
},
"h3": {
"fontSize": {
"20px": [
"Blind users",
"Limited-vision users",
"Deaf users",
"Limited-mobility users",
"Sensory-sensitive users",
"Deliver accessible components",
"Provide guidance on how to implement our components accessibly",
"Include accessibility-focused tools to build new functionality",
"Feature context-aware settings that allow accessible customization with minimal custom code",
"Make accessibility one of our core design principles",
"Government usability testing resources",
"Government accessibility resources",
"Non-government accessibility resources",
"Practical actions",
"Key accessibility considerations"
],
"14.08px": [
"Have an idea or an issue?",
"Engage with the community",
"Subscribe to our newsletter",
"Get support"
]
}
}
}
}
},
{
"type": "test",
"which": "tabNav",
"withItems": true,
"what": "keyboard navigation between tab elements",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"navigations": {
"all": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"specific": {
"tab": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"left": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"right": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"up": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"down": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"home": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"end": {
"total": 0,
"correct": 0,
"incorrect": 0
}
}
},
"tabElements": {
"total": 0,
"correct": 0,
"incorrect": 0
},
"tabLists": {
"total": 0,
"correct": 0,
"incorrect": 0
}
},
"tabElements": {
"incorrect": [],
"correct": []
}
}
},
{
"type": "test",
"which": "zIndex",
"withItems": true,
"what": "z indexes",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"total": 11,
"tagNames": {
"A": 1,
"HEADER": 1,
"NAV": 1,
"DIV": 1,
"UL": 7
}
},
"items": [
{
"tagName": "A",
"id": "",
"text": "Skip to main content"
},
{
"tagName": "HEADER",
"id": "",
"text": "USWDS U.S. Web Design System (USWDS) Menu Search Read website standards Download v3.0.2 Github logo "
},
{
"tagName": "NAV",
"id": "",
"text": "How to use USWDS Design principles Components Design tokens Utilities Templates About"
},
{
"tagName": "DIV",
"id": "",
"text": ""
},
{
"tagName": "UL",
"id": "nav-how-to-use-uswds",
"text": "How to use USWDS Getting started for developers Getting started for designers Documentation Settings"
},
{
"tagName": "UL",
"id": "",
"text": "Common patterns USWDS addresses What the design system does What project teams should do Accessibili"
},
{
"tagName": "UL",
"id": "nav-components",
"text": "Components Accordion Alert Banner Breadcrumb Button Button group Card Character count Checkbox Colle"
},
{
"tagName": "UL",
"id": "nav-design-tokens",
"text": "Design tokens Color Typesetting Flex Opacity Order Shadow Spacing units Z-index"
},
{
"tagName": "UL",
"id": "nav-utilities",
"text": "Utilities Layout grid Color Height and width Margin and padding Border Outline Font size and family "
},
{
"tagName": "UL",
"id": "nav-templates",
"text": "Templates 404 page Documentation page Landing page Authentication pages Form templates"
},
{
"tagName": "UL",
"id": "nav-about",
"text": "About Key benefits Product values Contribute Community What’s new Release notes News and updates Pro"
}
]
}
},
{
"type": "test",
"which": "alfa",
"what": "alfa",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"failures": 7,
"warnings": 0
},
"items": [
{
"index": 89,
"verdict": "failed",
"rule": {
"ruleID": "r14",
"ruleSummary": "Visible labels are included in accessible names",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r14",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#label-in-name",
"chapter": "2.5.3",
"title": "Label in Name"
},
{
"uri": "https://www.w3.org/WAI/WCAG21/Techniques/general/G208",
"name": "G208",
"title": "Including the text of the visible label as part of the accessible name"
}
]
},
"target": {
"type": "element",
"tagName": "a",
"path": "/html[1]/body[1]/section[2]/a[1]",
"codeLines": [
"<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-...",
" Was this page helpful?",
"</a>"
]
}
},
{
"index": 1056,
"verdict": "failed",
"rule": {
"ruleID": "r66",
"ruleSummary": "Text outside widget has enhanced contrast",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r66",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#contrast-enhanced",
"chapter": "1.4.6",
"title": "Contrast (Enhanced)"
}
]
},
"target": {
"type": "text",
"tagName": "",
"path": "/html[1]/body[1]/div[2]/main[1]/div[1]/header[1]/p[1]/text()[1]",
"codeLines": [
"How to use USWDS"
]
}
},
{
"index": 1431,
"verdict": "failed",
"rule": {
"ruleID": "r72",
"ruleSummary": "Paragraphs of text are not all uppercase",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r72",
"requirements": []
},
"target": {
"type": "element",
"tagName": "p",
"path": "/html[1]/body[1]/div[2]/main[1]/div[1]/header[1]/p[1]",
"codeLines": [
"<p class=\"site-subheading\">",
" How to use USWDS",
"</p>"
]
}
},
{
"index": 1446,
"verdict": "failed",
"rule": {
"ruleID": "r73",
"ruleSummary": "Paragraphs of text have sufficient line height",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r73",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#visual-presentation",
"chapter": "1.4.8",
"title": "Visual Presentation"
}
]
},
"target": {
"type": "element",
"tagName": "p",
"path": "/html[1]/body[1]/section[1]/div[1]/header[1]/div[1]/div[2]/p[1]",
"codeLines": [
"<p class=\"usa-banner__header-text\">",
" An official website of the United States government",
"</p>"
]
}
},
{
"index": 1447,
"verdict": "failed",
"rule": {
"ruleID": "r73",
"ruleSummary": "Paragraphs of text have sufficient line height",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r73",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#visual-presentation",
"chapter": "1.4.8",
"title": "Visual Presentation"
}
]
},
"target": {
"type": "element",
"tagName": "p",
"path": "/html[1]/body[1]/div[2]/main[1]/div[1]/header[1]/p[1]",
"codeLines": [
"<p class=\"site-subheading\">",
" How to use USWDS",
"</p>"
]
}
},
{
"index": 1460,
"verdict": "failed",
"rule": {
"ruleID": "r73",
"ruleSummary": "Paragraphs of text have sufficient line height",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r73",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#visual-presentation",
"chapter": "1.4.8",
"title": "Visual Presentation"
}
]
},
"target": {
"type": "element",
"tagName": "p",
"path": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[2]/p[1]",
"codeLines": [
"<p class=\"usa-identifier__identity-domain\">",
" designsystem.digital.gov",
"</p>"
]
}
},
{
"index": 1461,
"verdict": "failed",
"rule": {
"ruleID": "r73",
"ruleSummary": "Paragraphs of text have sufficient line height",
"scope": "component",
"uri": "https://alfa.siteimprove.com/rules/sia-r73",
"requirements": [
{
"uri": "https://www.w3.org/TR/WCAG/#visual-presentation",
"chapter": "1.4.8",
"title": "Visual Presentation"
}
]
},
"target": {
"type": "element",
"tagName": "p",
"path": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[2]/p[2]",
"codeLines": [
"<p class=\"usa-identifier__identity-disclaimer\">",
" An official website of the",
" <a href=\"https://gsa.gov\">",
" General Services Administration",
" </a>",
"</p>"
]
}
}
]
}
},
{
"type": "test",
"which": "axe",
"detailLevel": 2,
"rules": [],
"what": "Axe",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"totals": {
"rulesNA": 47,
"rulesPassed": 49,
"rulesWarned": 4,
"rulesViolated": 2,
"warnings": {
"minor": 11,
"moderate": 0,
"serious": 13,
"critical": 0
},
"violations": {
"minor": 0,
"moderate": 0,
"serious": 64,
"critical": 0
}
},
"details": {
"testEngine": {
"name": "axe-core",
"version": "4.4.2"
},
"testRunner": {
"name": "axe"
},
"testEnvironment": {
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/102.0.5005.40 Safari/537.36",
"windowWidth": 1280,
"windowHeight": 720,
"orientationAngle": 90,
"orientationType": "landscape-primary"
},
"timestamp": "2022-07-06T00:59:49.628Z",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"toolOptions": {
"resultTypes": [
"violations",
"incomplete"
],
"runOnly": {
"type": "tag",
"values": [
"experimental",
"best-practice",
"wcag2a",
"wcag2aa",
"wcag2aaa",
"wcag21a",
"wcag21aa",
"wcag21aaa"
]
},
"reporter": "v1"
},
"incomplete": [
{
"id": "aria-allowed-attr",
"impact": "serious",
"tags": [
"cat.aria",
"wcag2a",
"wcag412"
],
"description": "Ensures ARIA attributes are allowed for an element's role",
"help": "Elements must only use allowed ARIA attributes",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/aria-allowed-attr?application=axeAPI",
"nodes": [
{
"any": [],
"all": [],
"none": [
{
"id": "aria-prohibited-attr",
"data": {
"role": null,
"nodeName": "div",
"messageKey": "noRoleSingular",
"prohibited": [
"aria-label"
]
},
"relatedNodes": [],
"impact": "serious",
"message": "aria-label attribute is not well supported on a div with no valid role attribute."
}
],
"impact": "serious",
"html": "<div class=\"usa-identifier__identity\" aria-label=\"Agency description\">",
"target": [
".usa-identifier__identity"
],
"failureSummary": "Fix all of the following:\n aria-label attribute is not well supported on a div with no valid role attribute."
}
]
},
{
"id": "color-contrast-enhanced",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aaa",
"wcag146"
],
"description": "Ensures the contrast between foreground and background colors meets WCAG 2 AAA contrast ratio thresholds",
"help": "Elements must have sufficient color contrast",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/color-contrast-enhanced?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://methods.18f.gov/\">18F’s collection of human-centered design tools</a> [18f.gov]</li>",
"target": [
"ul:nth-child(38) > li:nth-child(4)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.section508.gov/\">The Section 508 accessibility program</a> [section508.gov]</li>",
"target": [
"ul:nth-child(41) > li:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.section508.gov/buy/accessibility-requirements-tool\">Accessibility Requirements Tool (ART) for contracting</a> [section508.gov]</li>",
"target": [
"ul:nth-child(41) > li:nth-child(8)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.w3.org/WAI/perspective-videos/\">Web Accessibility Perspectives Videos</a> [w3.org]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.youtube.com/watch?v=z8xUCzToff8\">Accessibility fundamentals with Rob Dodson</a> [youtube.com]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(3)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "7:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://inclusive-components.design/\">Inclusive components by Heydon Pickering</a> [inclusive-components.design]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(5)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
}
]
},
{
"id": "color-contrast",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aa",
"wcag143"
],
"description": "Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds",
"help": "Elements must have sufficient color contrast",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/color-contrast?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://methods.18f.gov/\">18F’s collection of human-centered design tools</a> [18f.gov]</li>",
"target": [
"ul:nth-child(38) > li:nth-child(4)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.section508.gov/\">The Section 508 accessibility program</a> [section508.gov]</li>",
"target": [
"ul:nth-child(41) > li:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.section508.gov/buy/accessibility-requirements-tool\">Accessibility Requirements Tool (ART) for contracting</a> [section508.gov]</li>",
"target": [
"ul:nth-child(41) > li:nth-child(8)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.w3.org/WAI/perspective-videos/\">Web Accessibility Perspectives Videos</a> [w3.org]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(1)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://www.youtube.com/watch?v=z8xUCzToff8\">Accessibility fundamentals with Rob Dodson</a> [youtube.com]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(3)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
},
{
"any": [
{
"id": "color-contrast",
"data": {
"contrastRatio": 0,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": "bgOverlap",
"expectedContrastRatio": "4.5:1"
},
"relatedNodes": [],
"impact": "serious",
"message": "Element's background color could not be determined because it is overlapped by another element"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<li><a href=\"https://inclusive-components.design/\">Inclusive components by Heydon Pickering</a> [inclusive-components.design]</li>",
"target": [
"ul:nth-child(43) > li:nth-child(5)"
],
"failureSummary": "Fix any of the following:\n Element's background color could not be determined because it is overlapped by another element"
}
]
},
{
"id": "hidden-content",
"impact": "minor",
"tags": [
"cat.structure",
"experimental",
"review-item",
"best-practice"
],
"description": "Informs users about hidden content.",
"help": "Hidden content on the page should be analyzed",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/hidden-content?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<p class=\"usa-banner__header-action\" aria-hidden=\"true\">Here’s how you know</p>",
"target": [
".usa-banner__header-action"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<div class=\"usa-banner__content usa-accordion__content\" id=\"gov-banner\" hidden=\"\">",
"target": [
"#gov-banner"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<span aria-hidden=\"true\" class=\"site-title-short\">USWDS</span>",
"target": [
".site-title-short"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<button class=\"usa-menu-btn\">Menu</button>",
"target": [
".usa-menu-btn"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<nav role=\"navigation\" class=\"usa-nav site-nav sidenav-mobile\">",
"target": [
".usa-nav"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<button class=\"usa-nav__close\">\n <img src=\"/assets/img/usa-icons/close.svg\" role=\"img\" alt=\"Close\">\n </button>",
"target": [
".usa-nav__close"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<ul id=\"nav-components\" class=\"usa-nav__submenu\" hidden=\"\">",
"target": [
"#nav-components"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<ul id=\"nav-design-tokens\" class=\"usa-nav__submenu\" hidden=\"\">",
"target": [
"#nav-design-tokens"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<ul id=\"nav-utilities\" class=\"usa-nav__submenu\" hidden=\"\">",
"target": [
"#nav-utilities"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<ul id=\"nav-templates\" class=\"usa-nav__submenu\" hidden=\"\">",
"target": [
"#nav-templates"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
},
{
"any": [
{
"id": "hidden-content",
"data": null,
"relatedNodes": [],
"impact": "minor",
"message": "There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
],
"all": [],
"none": [],
"impact": "minor",
"html": "<ul id=\"nav-about\" class=\"usa-nav__submenu\" hidden=\"\">",
"target": [
"#nav-about"
],
"failureSummary": "Fix any of the following:\n There is hidden content on the page that was not analyzed. You will need to trigger the display of this content in order to analyze it."
}
]
}
],
"violations": [
{
"id": "color-contrast-enhanced",
"impact": "serious",
"tags": [
"cat.color",
"wcag2aaa",
"wcag146"
],
"description": "Ensures the contrast between foreground and background colors meets WCAG 2 AAA contrast ratio thresholds",
"help": "Elements must have sufficient color contrast",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/color-contrast-enhanced?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#e5a000",
"bgColor": "#252f3e",
"contrastRatio": 6.01,
"fontSize": "12.0pt (16px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"usa-navbar site-header-navbar\">",
"target": [
".usa-navbar"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.01 (foreground color: #e5a000, background color: #252f3e, font size: 12.0pt (16px), font weight: bold). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a class=\"usa-button site-button-outline-secondary site-button-standards margin-x-0 desktop:margin-right-1 padding-x-05 desktop:padding-left-1 desktop:padding-right-05 desktop-lg:padding-left-205 desktop-lg:padding-right-2 font-lang-sm\" href=\"/website-standards/\" onclick=\"ga('send', 'event', 'Read website standards', 'Clicked Read website standards from inside site');\">",
"target": [
".navbar--container > .buttons > .site-button-standards.padding-x-05.site-button-outline-secondary"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.01 (foreground color: #e5a000, background color: #252f3e, font size: 12.0pt (16px), font weight: bold). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n Design principles\n </span>",
"target": [
".usa-nav__submenu-item:nth-child(2) > a[href$=\"design-principles/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n Components\n </span>",
"target": [
".usa-nav__submenu-item:nth-child(3) > a[href$=\"components/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n Design tokens\n </span>",
"target": [
".usa-nav__submenu-item:nth-child(4) > a[href$=\"design-tokens/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n Utilities\n </span>",
"target": [
".usa-nav__submenu-item:nth-child(5) > a[href$=\"utilities/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n Templates\n </span>",
"target": [
".site-nav-secondary > ul > .usa-nav__submenu-item:nth-child(6) > a[href$=\"templates/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#757575",
"bgColor": "#ffffff",
"contrastRatio": 4.6,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<nav class=\"site-nav-secondary sticky\">",
"target": [
".site-nav-secondary"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<span>\n About\n </span>",
"target": [
".usa-nav__submenu-item:nth-child(7) > a[href$=\"about/\"] > span"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 4.6 (foreground color: #757575, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/how-to-use-uswds/\">\n \n How to use USWDS\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(1) > a[href$=\"how-to-use-uswds/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/getting-started-for-developers/\">\n \n Getting started for developers\n \n</a>",
"target": [
".site-sidenav > .usa-sidenav__item:nth-child(2) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/getting-started-for-designers/\">\n \n Getting started for designers\n \n</a>",
"target": [
".site-sidenav > .usa-sidenav__item:nth-child(3) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/developers/\">\n \n Documentation\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(4) > a[href$=\"developers/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/settings/\">\n \n Settings\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(5) > a[href$=\"settings/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/maturity-model/\">\n \n USWDS maturity model\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(6) > a[href$=\"maturity-model/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#fcfcfc",
"contrastRatio": 6.51,
"fontSize": "9.7pt (12.96px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<li class=\"usa-sidenav__item is-current\">",
"target": [
".site-sidenav > .is-current.usa-sidenav__item"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#common-patterns-uswds-addresses\">Common patterns USWDS addresses</a>",
"target": [
".is-current.usa-sidenav__item:nth-child(1) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#fcfcfc",
"contrastRatio": 6.51,
"fontSize": "9.7pt (12.96px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<li class=\"usa-sidenav__item is-current\">",
"target": [
".site-sidenav > .is-current.usa-sidenav__item"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#what-the-design-system-does\">What the design system does</a>",
"target": [
".is-current.usa-sidenav__item:nth-child(2) > a[href=\"#what-the-design-system-does\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#fcfcfc",
"contrastRatio": 6.51,
"fontSize": "9.7pt (12.96px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<li class=\"usa-sidenav__item is-current\">",
"target": [
".site-sidenav > .is-current.usa-sidenav__item"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#what-project-teams-should-do\">What project teams should do</a>",
"target": [
".is-current.usa-sidenav__item:nth-child(3) > a[href=\"#what-project-teams-should-do\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#fcfcfc",
"contrastRatio": 6.51,
"fontSize": "9.7pt (12.96px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<li class=\"usa-sidenav__item is-current\">",
"target": [
".site-sidenav > .is-current.usa-sidenav__item"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"#accessibility-resources\">Accessibility resources</a>",
"target": [
".is-current.usa-sidenav__item:nth-child(4) > a[href$=\"#accessibility-resources\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.51 (foreground color: #5c5c5c, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/performance/\">\n \n Performance guidelines\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(8) > a[href$=\"performance/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/code-guidelines/\">\n \n Code guidelines\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(9) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/migration/\">\n \n Migrating to USWDS 3.0\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(10) > a[href$=\"migration/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/migration-v2/\">\n \n Migrating to USWDS 2.0\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(11) > a[href$=\"migration-v2/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/video-tutorials/\">\n \n Video tutorials\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(12) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/implementations/\">\n \n Implementations\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(13) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/showcase/\">\n \n Showcase\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(14) > a[href$=\"showcase/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/documentation/sample-contract-language/\">\n \n Sample contract language for 21st Century IDEA\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(15) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#5c5c5c",
"bgColor": "#ffffff",
"contrastRatio": 6.68,
"fontSize": "11.3pt (15.04px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<ul class=\"site-sidenav usa-sidenav\">",
"target": [
".site-sidenav"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/website-standards/\">\n \n Website standards\n \n</a>",
"target": [
".usa-sidenav__item:nth-child(16) > a[href$=\"website-standards/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.68 (foreground color: #5c5c5c, background color: #ffffff, font size: 11.3pt (15.04px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#656565",
"bgColor": "#fcfcfc",
"contrastRatio": 5.69,
"fontSize": "9.7pt (12.96px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 5.69 (foreground color: #656565, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<p class=\"site-subheading\">How to use USWDS</p>",
"target": [
".site-subheading"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 5.69 (foreground color: #656565, background color: #fcfcfc, font size: 9.7pt (12.96px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"/about/community\">contribute to the community</a>",
"target": [
"a[href$=\"community\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://digital.gov/topics/usability-testing/\">Usability testing on Digital.gov</a>",
"target": [
"ul:nth-child(38) > li:nth-child(1) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://digital.gov/2015/03/19/getting-started-with-usability-testing/\">Getting started with usability testing</a>",
"target": [
"ul:nth-child(38) > li:nth-child(2) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.plainlanguage.gov/guidelines/test/usability-testing/\">Testing for plain-language usability</a>",
"target": [
"ul:nth-child(38) > li:nth-child(3) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://methods.18f.gov/\">18F’s collection of human-centered design tools</a>",
"target": [
"a[href$=\"methods.18f.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/\">The Section 508 accessibility program</a>",
"target": [
"li:nth-child(1) > a[href$=\"section508.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.digital.gov/\">Accessibility for Teams guide</a>",
"target": [
"ul:nth-child(41) > li:nth-child(2) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/tools/coordinator-listing\">Find your Section 508 Coordinator</a>",
"target": [
"ul:nth-child(41) > li:nth-child(3) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://section508coordinators.github.io/ICTTestingBaseline/\">Section 508 ICT Testing Baseline</a>",
"target": [
"ul:nth-child(41) > li:nth-child(4) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.plainlanguage.gov/\">Learn about writing in plain language</a>",
"target": [
"li:nth-child(5) > a[href$=\"plainlanguage.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.plainlanguage.gov/resources/\">Plain language resources</a>",
"target": [
"ul:nth-child(41) > li:nth-child(6) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.18f.gov/\">18F’s accessibility guide</a>",
"target": [
"li:nth-child(7) > a[href$=\"accessibility.18f.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/buy/accessibility-requirements-tool\">Accessibility Requirements Tool (ART) for contracting</a>",
"target": [
"ul:nth-child(41) > li:nth-child(8) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/blog/Universal-Design-What-is-it\">Understanding universal design</a>",
"target": [
"ul:nth-child(41) > li:nth-child(9) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.w3.org/WAI/perspective-videos/\">Web Accessibility Perspectives Videos</a>",
"target": [
"ul:nth-child(43) > li:nth-child(1) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://inclusivedesignprinciples.org/\">Inclusive design principles</a>",
"target": [
"ul:nth-child(43) > li:nth-child(2) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.youtube.com/watch?v=z8xUCzToff8\">Accessibility fundamentals with Rob Dodson</a>",
"target": [
"ul:nth-child(43) > li:nth-child(3) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.microsoft.com/design/inclusive/\">Microsoft’s inclusive design manual</a>",
"target": [
"ul:nth-child(43) > li:nth-child(4) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://inclusive-components.design/\">Inclusive components by Heydon Pickering</a>",
"target": [
"ul:nth-child(43) > li:nth-child(5) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://humanebydesign.com/\">Humane by design</a>",
"target": [
"a[href$=\"humanebydesign.com/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/tools/coordinator-listing\">your agency’s accessibility team</a>",
"target": [
"ul:nth-child(45) > li:nth-child(2) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.w3.org/WAI/people-use-web/\">how people with disabilities use the web</a>",
"target": [
"ul:nth-child(45) > li:nth-child(3) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.access-board.gov/guidelines-and-standards/communications-and-it/about-the-ict-refresh\">Revised 508 Standards</a>",
"target": [
"li:nth-child(4) > a:nth-child(2)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.w3.org/TR/WCAG20/\">WCAG 2.0</a>",
"target": [
"a[href$=\"WCAG20/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/\">Section508.gov</a>",
"target": [
"li:nth-child(5) > a[href$=\"section508.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.digital.gov/\">Accessibility for Teams</a>",
"target": [
"li:nth-child(5) > a:nth-child(3)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.18f.gov/\">18F Accessibility Guide</a>",
"target": [
"li:nth-child(5) > a[href$=\"accessibility.18f.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"http://inclusivedesignprinciples.org/\">inclusive design</a>",
"target": [
"ul:nth-child(45) > li:nth-child(6) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.plainlanguage.gov/\">plain language</a>",
"target": [
"li:nth-child(8) > a[href$=\"plainlanguage.gov/\"]"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.18f.gov/headings/\">headings</a>",
"target": [
"li:nth-child(8) > a:nth-child(3)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.18f.gov/images/\">images</a>",
"target": [
"li:nth-child(8) > a:nth-child(4)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://accessibility.18f.gov/links/\">links</a>",
"target": [
"a:nth-child(5)"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/test/trusted-tester\">Trusted Tester and ICT Testing Baseline</a>",
"target": [
"ul:nth-child(45) > li:nth-child(10) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://www.section508.gov/buy/accessibility-requirements-tool\">Accessibility Requirements Tool</a>",
"target": [
"ul:nth-child(45) > li:nth-child(12) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.0pt (16px)",
"fontWeight": "normal",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<div class=\"default-container\">",
"target": [
".default-container"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://digital.gov/resources/improving-access-to-services-for-people-with-limited-english-proficiency-e-o-13166/\">languages other than English</a>",
"target": [
"ul:nth-child(47) > li:nth-child(11) > a"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 7:1"
},
{
"any": [
{
"id": "color-contrast-enhanced",
"data": {
"fgColor": "#005ea2",
"bgColor": "#fcfcfc",
"contrastRatio": 6.55,
"fontSize": "12.7pt (16.96px)",
"fontWeight": "bold",
"messageKey": null,
"expectedContrastRatio": "7:1"
},
"relatedNodes": [
{
"html": "<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-button usa-button--outline\" aria-label=\"Provide feedback about this page\">Was this page helpful?</a>",
"target": [
".usa-button--outline"
]
}
],
"impact": "serious",
"message": "Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.7pt (16.96px), font weight: bold). Expected contrast ratio of 7:1"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-button usa-button--outline\" aria-label=\"Provide feedback about this page\">Was this page helpful?</a>",
"target": [
".usa-button--outline"
],
"failureSummary": "Fix any of the following:\n Element has insufficient color contrast of 6.55 (foreground color: #005ea2, background color: #fcfcfc, font size: 12.7pt (16.96px), font weight: bold). Expected contrast ratio of 7:1"
}
]
},
{
"id": "label-content-name-mismatch",
"impact": "serious",
"tags": [
"cat.semantics",
"wcag21a",
"wcag253",
"experimental"
],
"description": "Ensures that elements labelled through their content must have their visible text as part of their accessible name",
"help": "Elements must have their visible text as part of their accessible name",
"helpUrl": "https://dequeuniversity.com/rules/axe/4.4/label-content-name-mismatch?application=axeAPI",
"nodes": [
{
"any": [
{
"id": "label-content-name-mismatch",
"data": null,
"relatedNodes": [],
"impact": "serious",
"message": "Text inside the element is not included in the accessible name"
}
],
"all": [],
"none": [],
"impact": "serious",
"html": "<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-button usa-button--outline\" aria-label=\"Provide feedback about this page\">Was this page helpful?</a>",
"target": [
".usa-button--outline"
],
"failureSummary": "Fix any of the following:\n Text inside the element is not included in the accessible name"
}
]
}
]
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "htmlcs",
"what": "HTML CodeSniffer WCAG 2.1 AA ruleset",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"Error": {},
"Warning": {
"AA.1_3_1.H48": {
"If this element contains a navigation section, it is recommended that it be marked up as a list.": [
{
"tagName": "div",
"id": "",
"code": "<div class=\"buttons\">...</div>"
}
]
},
"AA.1_4_10.C32,C31,C33,C38,SCR34,G206": {
"This element has \"position: fixed\". This may require scrolling in two dimensions, which is considered a failure of this Success Criterion.": [
{
"tagName": "div",
"id": "",
"code": "<div class=\"usa-overlay\">...</div>"
}
]
},
"AA.1_4_3.G145.Alpha": {
"This element's text or background contains transparency. Ensure the contrast ratio between the text and background are at least 3:1.": [
{
"tagName": "h1",
"id": "#accessibility",
"code": "<h1 id=\"accessibility\" class=\"site-page-title\">...</h1>"
}
]
},
"AA.1_4_3.G18.Alpha": {
"This element's text or background contains transparency. Ensure the contrast ratio between the text and background are at least 4.5:1.": [
{
"tagName": "a",
"id": "",
"code": "<a class=\"usa-button site-button-outline-secondary site-button-download margin-x-0 desktop:margin-right-1 desktop:padding-left-1 desktop:padding-right-05 desktop-lg:padding-left-205 desktop-lg:padding-right-2 font-lang-sm\" href=\"/download/\" onclick=\"ga('send', 'event', 'Downloaded code and design files', 'Clicked Download code and design files from inside site');\">...</a>"
},
{
"tagName": "li",
"id": "",
"code": "<li>...</li>"
},
{
"tagName": "p",
"id": "",
"code": "<p class=\"site-subheading\">...</p>"
},
{
"tagName": "p",
"id": "",
"code": "<p class=\"site-text-intro\">...</p>"
},
{
"tagName": "p",
"id": "",
"code": "<p>...</p>"
},
{
"tagName": "span",
"id": "",
"code": "<span class=\"version desktop:display-none desktop-lg:display-inline\">...</span>"
},
{
"tagName": "span",
"id": "",
"code": "<span>...</span>"
},
{
"tagName": "strong",
"id": "",
"code": "<strong>...</strong>"
}
]
},
"AA.2_5_3.F96": {
"Accessible name for this element does not contain the visible label text. Check that for user interface components with labels that include text or images of text, the name contains the text that is presented visually.": [
{
"tagName": "a",
"id": "",
"code": "<a class=\"margin-right-05\" href=\"/\" title=\"Home\" aria-label=\"U.S. Web Design System (USWDS) home\">...</a>"
},
{
"tagName": "a",
"id": "",
"code": "<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-button usa-button--outline\" aria-label=\"Provide feedback about this page\">...</a>"
}
]
}
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "ibm",
"withItems": true,
"what": "IBM Accessibility Checker",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"content": {
"totals": {
"violation": 12,
"recommendation": 6,
"ignored": 0
},
"items": [
{
"ruleId": "WCAG21_Label_Accessible",
"path": {
"dom": "/html[1]/body[1]/section[2]/a[1]",
"aria": "/document[1]/complementary[2]/link[1]"
},
"message": "Accessible name does not match or contain the visible label text",
"bounds": {
"left": 8,
"top": 5373,
"height": 18,
"width": 145
},
"snippet": "<a aria-label=\"Provide feedback about this page\" class=\"usa-button usa-button--outline\" target=\"_blank\" href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\">",
"level": "violation"
},
{
"ruleId": "WCAG21_Label_Accessible",
"path": {
"dom": "/html[1]/body[1]/header[1]/div[1]/div[1]/em[1]/a[1]",
"aria": "/document[1]/banner[1]/link[1]"
},
"message": "Accessible name does not match or contain the visible label text",
"bounds": {
"left": 8,
"top": 152,
"height": 18,
"width": 280
},
"snippet": "<a aria-label=\"U.S. Web Design System (USWDS) home\" title=\"Home\" href=\"/\" class=\"margin-right-05\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_OrphanedContent_Native_Host_Sematics",
"path": {
"dom": "/html[1]/body[1]/a[1]",
"aria": "/document[1]/link[1]"
},
"message": "Content is not within a landmark element",
"bounds": {
"left": 8,
"top": 8,
"height": 18,
"width": 133
},
"snippet": "<a href=\"#main-content\" class=\"usa-skipnav\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_MultipleSearchLandmarks",
"path": {
"dom": "/html[1]/body[1]/nav[2]/form[1]/div[1]",
"aria": "/document[1]/navigation[2]/search[1]"
},
"message": "Multiple elements with \"search\" role do not have unique labels",
"bounds": {
"left": 8,
"top": 433,
"height": 22,
"width": 784
},
"snippet": "<div role=\"search\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_MultipleSearchLandmarks",
"path": {
"dom": "/html[1]/body[1]/header[1]/div[1]/div[2]/form[1]/div[1]",
"aria": "/document[1]/banner[1]/search[1]"
},
"message": "Multiple elements with \"search\" role do not have unique labels",
"bounds": {
"left": 8,
"top": 192,
"height": 22,
"width": 784
},
"snippet": "<div role=\"search\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_MultipleNavigationLandmarks_Implicit",
"path": {
"dom": "/html[1]/body[1]/nav[2]",
"aria": "/document[1]/navigation[2]"
},
"message": "Multiple elements with \"navigation\" role do not have unique labels",
"bounds": {
"left": 8,
"top": 411,
"height": 630,
"width": 784
},
"snippet": "<nav class=\"usa-nav site-nav sidenav-mobile\" role=\"navigation\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_MultipleNavigationLandmarks_Implicit",
"path": {
"dom": "/html[1]/body[1]/nav[1]",
"aria": "/document[1]/navigation[1]"
},
"message": "Multiple elements with \"navigation\" role do not have unique labels",
"bounds": {
"left": 8,
"top": 266,
"height": 130,
"width": 784
},
"snippet": "<nav class=\"site-nav-secondary sticky\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_MultipleComplementaryLandmarks_Implicit",
"path": {
"dom": "/html[1]/body[1]/div[2]/aside[1]",
"aria": "/document[1]/complementary[1]"
},
"message": "Multiple elements with \"complementary\" role do not have unique labels",
"bounds": {
"left": 8,
"top": 1057,
"height": 370,
"width": 784
},
"snippet": "<aside id=\"page-side-navigation\" class=\"sidenav\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_ComplementaryRequiredLabel_Implicit",
"path": {
"dom": "/html[1]/body[1]/div[2]/aside[1]",
"aria": "/document[1]/complementary[1]"
},
"message": "The element with \"complementary\" role does not have a label",
"bounds": {
"left": 8,
"top": 1057,
"height": 370,
"width": 784
},
"snippet": "<aside id=\"page-side-navigation\" class=\"sidenav\">",
"level": "violation"
},
{
"ruleId": "landmark_name_unique",
"path": {
"dom": "/html[1]/body[1]/nav[2]",
"aria": "/document[1]/navigation[2]"
},
"message": "Multiple \"navigation\" landmarks with the same parent region are not distinguished from one another because they have the same \"\" label",
"bounds": {
"left": 8,
"top": 411,
"height": 630,
"width": 784
},
"snippet": "<nav class=\"usa-nav site-nav sidenav-mobile\" role=\"navigation\">",
"level": "violation"
},
{
"ruleId": "landmark_name_unique",
"path": {
"dom": "/html[1]/body[1]/nav[1]",
"aria": "/document[1]/navigation[1]"
},
"message": "Multiple \"navigation\" landmarks with the same parent region are not distinguished from one another because they have the same \"\" label",
"bounds": {
"left": 8,
"top": 266,
"height": 130,
"width": 784
},
"snippet": "<nav class=\"site-nav-secondary sticky\">",
"level": "violation"
},
{
"ruleId": "HAAC_Aria_ImgAlt",
"path": {
"dom": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[1]/a[1]/img[1]",
"aria": "/document[1]/region[2]/link[1]/img[1]"
},
"message": "Element with \"img\" role has no label or an empty label",
"bounds": {
"left": 8,
"top": 6456,
"height": 19,
"width": 80
},
"snippet": "<img role=\"img\" alt=\"GSA logo\" src=\"/img/gsa-logo.svg\" class=\"usa-identifier__logo-img\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_ComplementaryLandmarkLabel_Implicit",
"path": {
"dom": "/html[1]/body[1]/section[2]",
"aria": "/document[1]/complementary[2]"
},
"message": "The element with \"complementary\" role does not have a visible label",
"bounds": {
"left": 8,
"top": 5373,
"height": 19,
"width": 784
},
"snippet": "<section aria-label=\"Page feedback\" role=\"complementary\" class=\"touchpoints__container\">",
"level": "recommendation"
},
{
"ruleId": "element_attribute_deprecated",
"path": {
"dom": "/html[1]/head[1]/meta[2]",
"aria": "/document[1]"
},
"message": "The HTML attribute(s) \"http-equiv\" is deprecated for the <meta> element in HTML 5",
"bounds": {
"left": 0,
"top": 0,
"height": 0,
"width": 0
},
"snippet": "<meta content=\"IE=edge\" http-equiv=\"X-UA-Compatible\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/nav[2]/button[1]/img[1]",
"aria": "/document[1]/navigation[2]/button[1]"
},
"message": "The explicitly-assigned ARIA role \"img\" is redundant with the implicit role of the element <img>",
"bounds": {
"left": 16,
"top": 414,
"height": 16,
"width": 51
},
"snippet": "<img alt=\"Close\" role=\"img\" src=\"/assets/img/usa-icons/close.svg\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/nav[2]",
"aria": "/document[1]/navigation[2]"
},
"message": "The explicitly-assigned ARIA role \"navigation\" is redundant with the implicit role of the element <nav>",
"bounds": {
"left": 8,
"top": 411,
"height": 630,
"width": 784
},
"snippet": "<nav class=\"usa-nav site-nav sidenav-mobile\" role=\"navigation\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/header[1]",
"aria": "/document[1]/banner[1]"
},
"message": "The explicitly-assigned ARIA role \"banner\" is redundant with the implicit role of the element <header>",
"bounds": {
"left": 8,
"top": 152,
"height": 98,
"width": 784
},
"snippet": "<header role=\"banner\" class=\"usa-header site-header site-header-dark\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[1]/a[1]/img[1]",
"aria": "/document[1]/region[2]/link[1]/img[1]"
},
"message": "The explicitly-assigned ARIA role \"img\" is redundant with the implicit role of the element <img>",
"bounds": {
"left": 8,
"top": 6456,
"height": 19,
"width": 80
},
"snippet": "<img role=\"img\" alt=\"GSA logo\" src=\"/img/gsa-logo.svg\" class=\"usa-identifier__logo-img\">",
"level": "recommendation"
}
]
},
"url": {
"totals": {
"violation": 3,
"recommendation": 4,
"ignored": 0
},
"items": [
{
"ruleId": "WCAG21_Label_Accessible",
"path": {
"dom": "/html[1]/body[1]/section[2]/a[1]",
"aria": "/document[1]/complementary[2]/link[1]"
},
"message": "Accessible name does not match or contain the visible label text",
"bounds": {
"left": 16,
"top": 6588,
"height": 40,
"width": 201
},
"snippet": "<a aria-label=\"Provide feedback about this page\" class=\"usa-button usa-button--outline\" target=\"_blank\" href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_OrphanedContent_Native_Host_Sematics",
"path": {
"dom": "/html[1]/body[1]/a[1]",
"aria": "/document[1]/link[1]"
},
"message": "Content is not within a landmark element",
"bounds": {
"left": 0,
"top": -60,
"height": 42,
"width": 179
},
"snippet": "<a href=\"#main-content\" class=\"usa-skipnav\">",
"level": "violation"
},
{
"ruleId": "HAAC_Aria_ImgAlt",
"path": {
"dom": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[1]/a[1]/img[1]",
"aria": "/document[1]/region[2]/link[1]/img[1]"
},
"message": "Element with \"img\" role has no label or an empty label",
"bounds": {
"left": 16,
"top": 7001,
"height": 48,
"width": 48
},
"snippet": "<img role=\"img\" alt=\"GSA logo\" src=\"/img/gsa-logo.svg\" class=\"usa-identifier__logo-img\">",
"level": "violation"
},
{
"ruleId": "Rpt_Aria_ComplementaryLandmarkLabel_Implicit",
"path": {
"dom": "/html[1]/body[1]/section[2]",
"aria": "/document[1]/complementary[2]"
},
"message": "The element with \"complementary\" role does not have a visible label",
"bounds": {
"left": 0,
"top": 6588,
"height": 56,
"width": 800
},
"snippet": "<section aria-label=\"Page feedback\" role=\"complementary\" class=\"touchpoints__container\">",
"level": "recommendation"
},
{
"ruleId": "element_attribute_deprecated",
"path": {
"dom": "/html[1]/head[1]/meta[2]",
"aria": "/document[1]"
},
"message": "The HTML attribute(s) \"http-equiv\" is deprecated for the <meta> element in HTML 5",
"bounds": {
"left": 0,
"top": 0,
"height": 0,
"width": 0
},
"snippet": "<meta content=\"IE=edge\" http-equiv=\"X-UA-Compatible\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/header[1]",
"aria": "/document[1]/banner[1]"
},
"message": "The explicitly-assigned ARIA role \"banner\" is redundant with the implicit role of the element <header>",
"bounds": {
"left": 0,
"top": 23,
"height": 48,
"width": 800
},
"snippet": "<header role=\"banner\" class=\"usa-header site-header site-header-dark\">",
"level": "recommendation"
},
{
"ruleId": "aria_role_redundant",
"path": {
"dom": "/html[1]/body[1]/div[3]/section[1]/div[1]/div[1]/a[1]/img[1]",
"aria": "/document[1]/region[2]/link[1]/img[1]"
},
"message": "The explicitly-assigned ARIA role \"img\" is redundant with the implicit role of the element <img>",
"bounds": {
"left": 16,
"top": 7001,
"height": 48,
"width": 48
},
"snippet": "<img role=\"img\" alt=\"GSA logo\" src=\"/img/gsa-logo.svg\" class=\"usa-identifier__logo-img\">",
"level": "recommendation"
}
]
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "wave",
"reportType": 4,
"what": "WAVE",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"status": {
"success": true,
"httpstatuscode": 200
},
"statistics": {
"pagetitle": "Accessibility | U.S. Web Design System (USWDS)",
"pageurl": "https://designsystem.digital.gov/documentation/accessibility/",
"time": 4.46,
"creditsremaining": 444,
"allitemcount": 113,
"totalelements": 804,
"waveurl": "http://wave.webaim.org/report?url=https://designsystem.digital.gov/documentation/accessibility/"
},
"categories": {
"error": {
"description": "Errors",
"count": 0,
"items": []
},
"contrast": {
"description": "Contrast Errors",
"count": 0,
"items": []
},
"alert": {
"description": "Alerts",
"count": 3,
"items": {
"underline": {
"id": "underline",
"description": "Underlined text",
"count": 2,
"selectors": [
"HTML > HEAD:first-child + BODY > A:first-child + SECTION > DIV:first-child > HEADER:first-child > DIV:first-child > DIV:first-child + DIV > P:first-child + P",
"HTML > HEAD:first-child + BODY > A:first-child + SECTION > DIV:first-child > HEADER:first-child > DIV:first-child > DIV:first-child + DIV + BUTTON > SPAN:first-child"
],
"wcag": []
},
"youtube_video": {
"id": "youtube_video",
"description": "YouTube video",
"count": 1,
"selectors": [
"HTML > HEAD:first-child + BODY > A:first-child + SECTION + HEADER + NAV + DIV + NAV + DIV > MAIN#main-content > DIV:first-child > HEADER:first-child + P + P + P + P + UL + H2 + P + P + H3 + UL + H3 + UL + H3 + UL + H3 + UL + H3 + UL + H2 + P + H3 + UL + H3 + UL + H3 + UL + H3 + UL + H3 + UL + P + H2 + P + P + P + H3 + UL + H2 + H3 + UL + H3 + UL > LI:first-child + LI + LI > A:first-child"
],
"wcag": [
{
"name": "1.2.1 Prerecorded Audio-only and Video-only (Level A)",
"link": "https://webaim.org/standards/wcag/checklist#sc1.2.1"
},
{
"name": "1.2.2 Captions (Prerecorded) (Level A)",
"link": "https://webaim.org/standards/wcag/checklist#sc1.2.2"
},
{
"name": "1.2.3 Audio Description or Media Alternative (Prerecorded) (Level A)",
"link": "https://webaim.org/standards/wcag/checklist#sc1.2.3"
}
]
}
}
}
}
}
},
{
"type": "launch",
"which": "chromium",
"what": "chromium browser"
},
{
"type": "url",
"which": "https://designsystem.digital.gov/documentation/accessibility/",
"what": "URL",
"result": "https://designsystem.digital.gov/documentation/accessibility/"
},
{
"type": "test",
"which": "tenon",
"id": "a",
"what": "Tenon",
"url": "https://designsystem.digital.gov/documentation/accessibility/",
"result": {
"status": 200,
"message": "OK",
"code": "success",
"info": "Success",
"moreInfo": "https://tenon.io/documentation/apiv2/response-codes#success",
"responseExecTime": "0.073",
"responseTime": "2022-07-06T01:00:12.977Z",
"data": {
"apiErrors": [],
"documentSize": 1020405,
"metadata": null,
"resultSummary": {
"tests": {
"total": 180,
"passing": 173,
"failing": 7
},
"issues": {
"totalErrors": 31,
"totalWarnings": 0,
"totalIssues": 31
},
"issuesByLevel": {
"A": {
"count": 8,
"pct": 25.81
},
"AA": {
"count": 4,
"pct": 12.9
},
"AAA": {
"count": 31,
"pct": 100
}
},
"density": {
"errorDensity": 3,
"warningDensity": 0,
"allDensity": 3
}
},
"projectID": "E4B12DC9-2F67-8DB7-26C9-E50C8490",
"responseID": "9b0c7330-7c65-4d05-a252-afaaa0c260eb",
"docID": "82078574-d497-40b1-9d3c-4653c5418b76",
"sourceHash": "1922e25ec53ffd9e788f20c688c7b9ec",
"urlHttpCode": 200,
"clientScriptErrors": [],
"remainingApiCalls": {
"planCalls": 0,
"boosts": 19
},
"globalStats": {
"errorDensity": "N/A",
"warningDensity": "N/A",
"allDensity": "N/A",
"stdDev": "N/A"
},
"resultUrl": "http://ngnix/history.php?responseID=9b0c7330-7c65-4d05-a252-afaaa0c260eb",
"resultSet": [
{
"tID": 73,
"bpID": 106,
"priority": 100,
"level": [
"A",
"AAA"
],
"certainty": 100,
"errorTitle": "This link text is uninformative.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 2.4.4 Link Purpose (In Context)",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.4.9 Link Purpose (Link Only)"
],
"resultTitle": "Make sure that link text (and the alternate text for any images that are used as links) describes the destination or purpose of the link.",
"errorDescription": "The text in this link is too generic to be helpful for users. Users will be unable to discern the purpose or destination of the link without reading the text that surrounds it. Change the text in this link to something that is unique and informative so that the user can understand what content or actions can be found at the link's destination.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": -16,
"y": -16
},
"height": -16,
"width": -16
},
"position": {
"line": 5873,
"column": 0
},
"errorSnippet": "<a href=\"/components/link/\"> <span> Link </span>\n</a>",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[3]/ul[1]/li[25]/a[1]",
"issueID": "8c6866ddbada052da8e6777e112bed39",
"signature": "68926b40bab1bca140311f72f75e64b6",
"ref": "https://tenon.io/bestpractice.php?bpID=106&tID=73&issueID=8c6866ddbada052da8e6777e112bed39"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 21
},
"height": 21,
"width": 172
},
"position": {
"line": 8495,
"column": 1
},
"errorSnippet": "<a href=\"/how-to-use-uswds/\"> How to use USWDS </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[1]/a[1]",
"issueID": "f45d96e023a32d5f61e82724fb42a323",
"signature": "16e8c1558fbfc452df34e4e8a15616b2",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=f45d96e023a32d5f61e82724fb42a323"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 42
},
"height": 42,
"width": 172
},
"position": {
"line": 8511,
"column": 1
},
"errorSnippet": "<a href=\"/documentation/getting-started-for-developers/\"> Getting started for developers </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[2]/a[1]",
"issueID": "08305fe9b9e7de073227b2b3081d921c",
"signature": "b56b9d0cf421ab0fd83cfadb7000e846",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=08305fe9b9e7de073227b2b3081d921c"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 42
},
"height": 42,
"width": 172
},
"position": {
"line": 8527,
"column": 1
},
"errorSnippet": "<a href=\"/documentation/getting-started-for-designers/\"> Getting started for designers </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[3]/a[1]",
"issueID": "a0027a2376a64a072174b2edabeacd6b",
"signature": "4a296ca519919669ba2cfac496e51448",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=a0027a2376a64a072174b2edabeacd6b"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 21
},
"height": 21,
"width": 172
},
"position": {
"line": 8543,
"column": 1
},
"errorSnippet": "<a href=\"/documentation/developers/\"> Documentation </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[4]/a[1]",
"issueID": "98dda5220f6de43b39f11f615be1fd37",
"signature": "db7a750479513bf0dc050ba266c8968c",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=98dda5220f6de43b39f11f615be1fd37"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 21
},
"height": 21,
"width": 172
},
"position": {
"line": 8559,
"column": 1
},
"errorSnippet": "<a href=\"/documentation/settings/\"> Settings </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[5]/a[1]",
"issueID": "0f0e21eef5efcd7d60b7a449ebd1726e",
"signature": "1adfdd9cc8887a7ca863e681b4be5348",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=0f0e21eef5efcd7d60b7a449ebd1726e"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 21
},
"height": 21,
"width": 172
},
"position": {
"line": 8575,
"column": 1
},
"errorSnippet": "<a href=\"/maturity-model/\"> USWDS maturity model </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[6]/a[1]",
"issueID": "5c66c59bb2e481cfd8b3d8b7a7bd92ef",
"signature": "7d21aed47913dd349f59b8cef0a5c301",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=5c66c59bb2e481cfd8b3d8b7a7bd92ef"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 36
},
"height": 36,
"width": 172
},
"position": {
"line": 8607,
"column": 1
},
"errorSnippet": "<a href=\"#common-patterns-uswds-addresses\">Common patterns USWDS addresses</a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[7]/ul[1]/li[1]/a[1]",
"issueID": "21ac752d1ae140ca4fe408c9794963f3",
"signature": "678783020dc405c6ab6202953585b3d7",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=21ac752d1ae140ca4fe408c9794963f3"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 36
},
"height": 36,
"width": 172
},
"position": {
"line": 8623,
"column": 1
},
"errorSnippet": "<a href=\"#what-the-design-system-does\">What the design system does</a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[7]/ul[1]/li[2]/a[1]",
"issueID": "22b528597a6afb954f146248c10bc511",
"signature": "88c90544f8041779222aeac94992940f",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=22b528597a6afb954f146248c10bc511"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 36
},
"height": 36,
"width": 172
},
"position": {
"line": 8639,
"column": 1
},
"errorSnippet": "<a href=\"#what-project-teams-should-do\">What project teams should do</a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[7]/ul[1]/li[3]/a[1]",
"issueID": "db4e892e816174c17304133c236b6528",
"signature": "9ad3097e212a6151893161a1f446391b",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=db4e892e816174c17304133c236b6528"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 18
},
"height": 18,
"width": 172
},
"position": {
"line": 8655,
"column": 1
},
"errorSnippet": "<a href=\"#accessibility-resources\">Accessibility resources</a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[7]/ul[1]/li[4]/a[1]",
"issueID": "06d2cfce05993777d17f643efcdabbf2",
"signature": "538fae8dd78cb56ef29a2e377d48e858",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=06d2cfce05993777d17f643efcdabbf2"
},
{
"tID": 95,
"bpID": 181,
"priority": 95,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This element has insufficient color contrast (Level AAA).",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.6 Contrast (Enhanced)"
],
"resultTitle": "Avoid using color as the only visual means of conveying information",
"errorDescription": "This element has insufficient contrast between the foreground color (the text) and the background color when measured against the WCAG 2.0 Level AAA requirements. Sufficient color contrast is important for users who have low-vision or are color-blind, because text with a low contrast ratio may be difficult or impossible for such users to see. Increase the contrast of this content. This can be done by adjusting the color(s) used by either the foreground content or background content – or both.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 172,
"y": 21
},
"height": 21,
"width": 172
},
"position": {
"line": 8671,
"column": 1
},
"errorSnippet": "<a href=\"/performance/\"> Performance guidelines </a>",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[8]/a[1]",
"issueID": "0c012f5feab3d412f0d783db91680967",
"signature": "d5837c10387bf070f04aab82d1aabdba",
"ref": "https://tenon.io/bestpractice.php?bpID=181&tID=95&issueID=0c012f5feab3d412f0d783db91680967"
},
{
"tID": 98,
"bpID": 105,
"priority": 100,
"level": [
"A",
"AAA"
],
"certainty": 100,
"errorTitle": "These links have the same text but different destinations.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 2.4.4 Link Purpose (In Context)",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.4.9 Link Purpose (Link Only)"
],
"resultTitle": "Don't reuse the same link text for links that have different destinations",
"errorDescription": "This link has the same text as another link that goes to a different place. Using the same text for multiple links which point to different pages is ambiguous and may be confusing for assistive technology users, or for users who have a cognitive disability. Link text should tell the user where they will go if they follow the link. If two links on a page go to two different destinations, use different link text that accurately and concisely describes their destination.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": -16,
"y": -16
},
"height": -16,
"width": -16
},
"position": {
"line": 7896,
"column": 1
},
"errorSnippet": "<a href=\"/utilities/color/\"> <span> Color </span>\n</a>",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[5]/ul[1]/li[3]/a[1]",
"issueID": "e6e3607df789c8947e7f6b0727a5ca64",
"signature": "95d5070d1716d586c52a9483150d76d7",
"ref": "https://tenon.io/bestpractice.php?bpID=105&tID=98&issueID=e6e3607df789c8947e7f6b0727a5ca64"
},
{
"tID": 98,
"bpID": 105,
"priority": 100,
"level": [
"A",
"AAA"
],
"certainty": 100,
"errorTitle": "These links have the same text but different destinations.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 2.4.4 Link Purpose (In Context)",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.4.9 Link Purpose (Link Only)"
],
"resultTitle": "Don't reuse the same link text for links that have different destinations",
"errorDescription": "This link has the same text as another link that goes to a different place. Using the same text for multiple links which point to different pages is ambiguous and may be confusing for assistive technology users, or for users who have a cognitive disability. Link text should tell the user where they will go if they follow the link. If two links on a page go to two different destinations, use different link text that accurately and concisely describes their destination.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": -16,
"y": -16
},
"height": -16,
"width": -16
},
"position": {
"line": 8077,
"column": 1
},
"errorSnippet": "<a href=\"/utilities/flex/\"> <span> Flex </span>\n</a>",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[5]/ul[1]/li[12]/a[1]",
"issueID": "4a2d68baccb4fe038a4f8cfa1cee9aa3",
"signature": "b0c1f8cc10ec8d07772d059be3ab300e",
"ref": "https://tenon.io/bestpractice.php?bpID=105&tID=98&issueID=4a2d68baccb4fe038a4f8cfa1cee9aa3"
},
{
"tID": 98,
"bpID": 105,
"priority": 100,
"level": [
"A",
"AAA"
],
"certainty": 100,
"errorTitle": "These links have the same text but different destinations.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 2.4.4 Link Purpose (In Context)",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.4.9 Link Purpose (Link Only)"
],
"resultTitle": "Don't reuse the same link text for links that have different destinations",
"errorDescription": "This link has the same text as another link that goes to a different place. Using the same text for multiple links which point to different pages is ambiguous and may be confusing for assistive technology users, or for users who have a cognitive disability. Link text should tell the user where they will go if they follow the link. If two links on a page go to two different destinations, use different link text that accurately and concisely describes their destination.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": -16,
"y": -16
},
"height": -16,
"width": -16
},
"position": {
"line": 8093,
"column": 1
},
"errorSnippet": "<a href=\"/utilities/shadow/\"> <span> Shadow </span>\n</a>",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[5]/ul[1]/li[13]/a[1]",
"issueID": "08f3497624cd3bea9c535c9abcca39c8",
"signature": "27ac74fe6506db2524b23b554c1c50a5",
"ref": "https://tenon.io/bestpractice.php?bpID=105&tID=98&issueID=08f3497624cd3bea9c535c9abcca39c8"
},
{
"tID": 129,
"bpID": 211,
"priority": 85,
"level": [
"A",
"AA",
"AAA"
],
"certainty": 100,
"errorTitle": "CSS underline on text has been detected that is not a link.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 1.3.1 Info and Relationships",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.5 Images of Text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 3.2.4 Consistent Identification",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.4 Resize text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.5.5 Target Size"
],
"resultTitle": "Ensure content is legible.",
"errorDescription": "The text in this passage has been styled to display underlined but it is not a link. Underlined text on the web or on apps is universally accepted as signifying that the relevant text is a link. Applying underline to text that is not a link is likely to confuse many users, and especially people with cognitive impairments, learning disabilities or dyslexia. Remove the underlining from this passage of text.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": -2
},
"bottom-right": {
"x": 133,
"y": 14
},
"height": 16,
"width": 133
},
"position": {
"line": 2905,
"column": 138
},
"errorSnippet": "<p class=\"usa-banner__header-action\" aria-hidden=\"true\" style=\"\">Here’s how you know</p>",
"xpath": "/html/body/section[1]/div[1]/header[1]/div[1]/div[2]/p[2]",
"issueID": "1ad72712d60fb42b90a370dcf5c9a8b1",
"signature": "bff43e0e07c03f244b650e2da4143217",
"ref": "https://tenon.io/bestpractice.php?bpID=211&tID=129&issueID=1ad72712d60fb42b90a370dcf5c9a8b1"
},
{
"tID": 129,
"bpID": 211,
"priority": 85,
"level": [
"A",
"AA",
"AAA"
],
"certainty": 100,
"errorTitle": "CSS underline on text has been detected that is not a link.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 1.3.1 Info and Relationships",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.5 Images of Text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 3.2.4 Consistent Identification",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.4 Resize text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.5.5 Target Size"
],
"resultTitle": "Ensure content is legible.",
"errorDescription": "The text in this passage has been styled to display underlined but it is not a link. Underlined text on the web or on apps is universally accepted as signifying that the relevant text is a link. Applying underline to text that is not a link is likely to confuse many users, and especially people with cognitive impairments, learning disabilities or dyslexia. Remove the underlining from this passage of text.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 117,
"y": 14
},
"height": 14,
"width": 117
},
"position": {
"line": 7794,
"column": 11
},
"errorSnippet": "<span class=\"usa-banner__button-text\">Here’s how you know</span>",
"xpath": "/html/body/section[1]/div[1]/header[1]/div[1]/button[1]/span[1]",
"issueID": "3a68536e96f78615728e97859777f5fc",
"signature": "cad918eef89fea31f81da8dc0ff6143a",
"ref": "https://tenon.io/bestpractice.php?bpID=211&tID=129&issueID=3a68536e96f78615728e97859777f5fc"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 42,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-how-to-use-uswds\" aria-expanded=\"true\"> <span> How to use USWDS </span>\n</button>\n<ul id=\"nav-how-to-use-uswds\" cla",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[1]",
"issueID": "c1d904551a86f9b4cfec8d807bdd55c0",
"signature": "11e38fff27dd5d4d701dc0211f71b56c",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=c1d904551a86f9b4cfec8d807bdd55c0"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 5933,
"column": 474
},
"errorSnippet": "<li class=\"usa-nav__submenu-item is-current\"> <a href=\"/documentation/accessibility/\" class=\"usa-current\"> <span> Accessibility </span>\n</a> <ul class=\"usa-nav__submenu\"> <li class=\"usa-nav__submenu-item is-current\"",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[1]/ul[1]/li[7]",
"issueID": "3d87b720c3b228a0a55a33670eb3e69c",
"signature": "2447a356c1f6baf51b2452e1391e08b3",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=3d87b720c3b228a0a55a33670eb3e69c"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 8090,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-components\" aria-expanded=\"false\"> <span> Components </span>\n</button>\n<ul id=\"nav-components\" class=\"usa-nav__subm",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[3]",
"issueID": "75c2f35a971d12e8c3010ef5f7fcf5b0",
"signature": "8d307a95c663dce6da347a81dfc7ed08",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=75c2f35a971d12e8c3010ef5f7fcf5b0"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 8828,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-design-tokens\" aria-expanded=\"false\"> <span> Design tokens </span>\n</button>\n<ul id=\"nav-design-tokens\" class=\"usa-",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[4]",
"issueID": "bf2335201e2cdabcac480be5c325bac9",
"signature": "8181a4e1a64eb5ba81f47898d5d377b4",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=bf2335201e2cdabcac480be5c325bac9"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 8988,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-utilities\" aria-expanded=\"false\"> <span> Utilities </span>\n</button>\n<ul id=\"nav-utilities\" class=\"usa-nav__submenu",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[5]",
"issueID": "698d00400a6259b808b8a7464b1be9a4",
"signature": "ea9a65990b07e47f5c0a515ca9d0238c",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=698d00400a6259b808b8a7464b1be9a4"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 9266,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-templates\" aria-expanded=\"false\"> <span> Templates </span>\n</button>\n<ul id=\"nav-templates\" class=\"usa-nav__submenu",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[6]",
"issueID": "c879fde8bdc2784643910183c26053ba",
"signature": "8429b9c33cc920f99d4a37cc04bcc733",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=c879fde8bdc2784643910183c26053ba"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": 0,
"y": 0
},
"height": 0,
"width": 0
},
"position": {
"line": 9378,
"column": 3
},
"errorSnippet": "<li class=\"usa-nav__primary-item\"> <button class=\"usa-accordion__button usa-nav__link\" aria-controls=\"nav-about\" aria-expanded=\"false\"> <span> About </span>\n</button>\n<ul id=\"nav-about\" class=\"usa-nav__submenu\" hidden=\"\" ",
"xpath": "/html/body/nav[2]/div[1]/ul[1]/li[7]",
"issueID": "71bf26315510623070c4a072c7c1ed32",
"signature": "7f8fad0d0fbc7c3f3061b0a5d100828f",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=71bf26315510623070c4a072c7c1ed32"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 32,
"y": 256
},
"bottom-right": {
"x": 236,
"y": 1141
},
"height": 885,
"width": 204
},
"position": {
"line": 8008,
"column": 5
},
"errorSnippet": "<ul class=\"site-sidenav usa-sidenav\"> <li class=\"usa-sidenav__item\"> <a href=\"/how-to-use-uswds/\"> How to use USWDS </a> </li> <li class=\"usa-sidenav__item\"> <a href=\"/documentation/getting-started-for-developers/\"&",
"xpath": "/html/body/div[2]/aside[1]/ul[1]",
"issueID": "e93cf7a88bb84da486c9c7035505e628",
"signature": "b186786158081921b4eb643d1933a3bf",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=e93cf7a88bb84da486c9c7035505e628"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 38
},
"bottom-right": {
"x": 204,
"y": 232
},
"height": 194,
"width": 204
},
"position": {
"line": 8020,
"column": 1
},
"errorSnippet": "<ul class=\"usa-sidenav__sublist\"> <li class=\"usa-sidenav__item is-current\"> <a href=\"#common-patterns-uswds-addresses\">Common patterns USWDS addresses</a> </li> <li class=\"usa-sidenav__item is-current\"> <a href=\"#wh",
"xpath": "/html/body/div[2]/aside[1]/ul[1]/li[7]/ul[1]",
"issueID": "a596c1df4c618ab21a99d7931a940671",
"signature": "f60c0a39a7e18ea2048dba9a7326ca51",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=a596c1df4c618ab21a99d7931a940671"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 7070
},
"bottom-right": {
"x": 1024,
"y": 7274
},
"height": 204,
"width": 1024
},
"position": {
"line": 10471,
"column": 13
},
"errorSnippet": "<div class=\"usa-identifier site-identifier\"> <section class=\"usa-identifier__section usa-identifier__section--masthead\" aria-label=\"Agency identifier\"> <div class=\"usa-identifier__container\"> <div class=\"usa-identifier__logos\"> &l",
"xpath": "/html/body/div[3]",
"issueID": "e68d530c97e7da3652842c65e1b3fd06",
"signature": "d258888e1f993bf2df5d75c89c239c08",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=e68d530c97e7da3652842c65e1b3fd06"
},
{
"tID": 144,
"bpID": 14,
"priority": 91,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This content's line height is insufficent to properly display the computed element font size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 1.4.8 Visual Presentation"
],
"resultTitle": "Set a `line-height` (leading) that is at least one and a half times the current font size.",
"errorDescription": "This content's line height is insufficent to properly display the computed element font size. Line height that is less than 150% of the computed element font size limits content readability for people with dyslexia, low vision, cognitive impairments or learning disabilities. Set the `line-height` for this content to a value of 1.5 or higher. Using a proportional, unitless value like 1.5 or 150% will ensure that the line-height scales if the user zooms the browser window.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 7150
},
"bottom-right": {
"x": 1024,
"y": 7204
},
"height": 54,
"width": 1024
},
"position": {
"line": 10522,
"column": 3
},
"errorSnippet": "<nav class=\"usa-identifier__section usa-identifier__section--required-links\" aria-label=\"Important links\"> <div class=\"usa-identifier__container\"> <ul class=\"usa-identifier__required-links-list\"> <li class=\"usa-identifier__required-l",
"xpath": "/html/body/div[3]/nav[1]",
"issueID": "45d5976656386fe47a7d83eea53db9fe",
"signature": "81018c9010399e0c0cf4f1cd06b0bfe6",
"ref": "https://tenon.io/bestpractice.php?bpID=14&tID=144&issueID=45d5976656386fe47a7d83eea53db9fe"
},
{
"tID": 152,
"bpID": 211,
"priority": 88,
"level": [
"A",
"AA",
"AAA"
],
"certainty": 100,
"errorTitle": "This actionable element is smaller than the minimum required size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 1.3.1 Info and Relationships",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.5 Images of Text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 3.2.4 Consistent Identification",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.4 Resize text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.5.5 Target Size"
],
"resultTitle": "Ensure content is legible.",
"errorDescription": "This actionable element is smaller than the stated minimum defined by all mobile platform developer guides. Minimum sizes for actionable elements ensure that those elements can be operated by people with vision, motor and cognitive disabilities. Even if this system is not explicitly intended for mobile use, it should be enlarged with CSS to meet minimu requirements and improve usability for users with vision, motor and cognitive disabilities.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 12
},
"bottom-right": {
"x": 48,
"y": 60
},
"height": 48,
"width": 48
},
"position": {
"line": 7992,
"column": 3
},
"errorSnippet": "<button class=\"usa-nav__close\" style=\"\"> <img src=\"/assets/img/usa-icons/close.svg\" role=\"img\" alt=\"Close\"> </button>",
"xpath": "/html/body/nav[2]/button[1]",
"issueID": "ced3ab868c30a2db02576f455f8cb5cc",
"signature": "47e1c39aab44d2c47871c3e902efffd3",
"ref": "https://tenon.io/bestpractice.php?bpID=211&tID=152&issueID=ced3ab868c30a2db02576f455f8cb5cc"
},
{
"tID": 152,
"bpID": 211,
"priority": 88,
"level": [
"A",
"AA",
"AAA"
],
"certainty": 100,
"errorTitle": "This actionable element is smaller than the minimum required size.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level A: 1.3.1 Info and Relationships",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.5 Images of Text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 3.2.4 Consistent Identification",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AA: 1.4.4 Resize text",
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 2.5.5 Target Size"
],
"resultTitle": "Ensure content is legible.",
"errorDescription": "This actionable element is smaller than the stated minimum defined by all mobile platform developer guides. Minimum sizes for actionable elements ensure that those elements can be operated by people with vision, motor and cognitive disabilities. Even if this system is not explicitly intended for mobile use, it should be enlarged with CSS to meet minimu requirements and improve usability for users with vision, motor and cognitive disabilities.",
"viewPortLocation": {
"top-left": {
"x": 0,
"y": 0
},
"bottom-right": {
"x": -17,
"y": 30
},
"height": 30,
"width": -17
},
"position": {
"line": 6005,
"column": 0
},
"errorSnippet": "<input id=\"query-mobile\" class=\"usa-input usagov-search-autocomplete\" name=\"query\" type=\"search\" autocomplete=\"off\">",
"xpath": "/html/body/nav[2]/form[1]/div[1]/input[1]",
"issueID": "0ed2720f999e496451619fd4a1336e1b",
"signature": "fdc2d3b56661374db6d6a6ca9bc39601",
"ref": "https://tenon.io/bestpractice.php?bpID=211&tID=152&issueID=0ed2720f999e496451619fd4a1336e1b"
},
{
"tID": 218,
"bpID": 207,
"priority": 88,
"level": [
"AAA"
],
"certainty": 100,
"errorTitle": "This link opens in a new window without user control.",
"standards": [
"Web Content Accessibility Guidelines (WCAG) 2.0, Level AAA: 3.2.5 Change on Request"
],
"resultTitle": "Notify the user when links will open new windows or tabs",
"errorDescription": "This link opens in a new window without user control. Opening a new window or new tab unexpectedly can cause confusion for users, particularly for blind users and those with low vision, cogntive impairments or learning disabilities.. Avoid opening links in new windows or tabs. If it is unavoidable, give the user warning via text or a properly marked up and appropriate icon.",
"viewPortLocation": {
"top-left": {
"x": 768.296875,
"y": 6664
},
"bottom-right": {
"x": 941.287275,
"y": 6679
},
"height": 15,
"width": 172.9904
},
"position": {
"line": 9413,
"column": 1
},
"errorSnippet": "<a href=\"https://touchpoints.app.cloud.gov/touchpoints/5c2410e4/submit\" target=\"_blank\" class=\"usa-button usa-button--outline\" aria-label=\"Provide feedback about this page\">Was this page helpful?</a>",
"xpath": "/html/body/section[2]/a[1]",
"issueID": "8d18463203bdfc03f2ab5b365f6ae3c4",
"signature": "8d34d90884f285fa702fb69aa9be03b8",
"ref": "https://tenon.io/bestpractice.php?bpID=207&tID=218&issueID=8d18463203bdfc03f2ab5b365f6ae3c4"
}
],
"log": []
}
}
}
],
"timeStamp": "3zjtz",
"startTime": "2022-07-06T00:58:10",
"presses": 0,
"amountRead": 0,
"testTimes": [
[
"hover",
63
],
[
"motion",
13
],
[
"ibm",
10
],
[
"alfa",
6
],
[
"wave",
5
],
[
"focAll",
1
],
[
"focInd",
1
],
[
"axe",
1
],
[
"tenon",
1
],
[
"bulk",
0
],
[
"embAc",
0
],
[
"focOp",
0
],
[
"labClash",
0
],
[
"linkUl",
0
],
[
"menuNav",
0
],
[
"radioSet",
0
],
[
"role",
0
],
[
"styleDiff",
0
],
[
"tabNav",
0
],
[
"zIndex",
0
],
[
"htmlcs",
0
]
],
"logCount": 0,
"logSize": 0,
"errorLogCount": 0,
"errorLogSize": 0,
"prohibitedCount": 0,
"visitTimeoutCount": 0,
"visitRejectionCount": 0,
"endTime": "2022-07-06T01:00:13",
"elapsedSeconds": 122,
"score": {
"scoreProcID": "sp12a",
"logWeights": {
"logCount": 0.5,
"logSize": 0.01,
"errorLogCount": 1,
"errorLogSize": 0.02,
"prohibitedCount": 15,
"visitTimeoutCount": 10,
"visitRejectionCount": 10
},
"soloWeight": 2,
"groupWeights": {
"absolute": 2,
"largest": 1,
"smaller": 0.4
},
"preventionWeights": {
"testaro": 50,
"other": 100
},
"packageDetails": {
"testaro": {
"bulk": 0,
"hover": 1,
"linkUl": 84,
"role": 3,
"styleDiff": 31,
"zIndex": 11
},
"alfa": {
"r14": 4,
"r66": 4,
"r72": 4,
"r73": 16
},
"axe": {
"aria-allowed-attr": 1,
"color-contrast-enhanced": 195,
"color-contrast": 6,
"hidden-content": 0,
"label-content-name-mismatch": 3
},
"htmlcs": {
"w:AA.1_3_1.H48": 1,
"w:AA.1_4_10.C32,C31,C33,C38,SCR34,G206": 1,
"w:AA.1_4_3.G145.Alpha": 1,
"w:AA.1_4_3.G18.Alpha": 8,
"w:AA.2_5_3.F96": 2
},
"wave": {
"a:underline": 2,
"a:youtube_video": 1
},
"tenon": {
"73": 4,
"95": 44,
"98": 12,
"129": 6,
"144": 44,
"152": 8,
"218": 4
}
},
"groupDetails": {
"groups": {
"visibleBulk": {
"testaro": {
"bulk": {
"score": 1,
"what": "Page contains many visible elements"
}
}
},
"hoverSurprise": {
"testaro": {
"hover": {
"score": 1,
"what": "Content changes caused by hovering"
}
}
},
"linkIndication": {
"testaro": {
"linkUl": {
"score": 42,
"what": "Non-underlined adjacent links"
}
}
},
"roleBad": {
"testaro": {
"role": {
"score": 2,
"what": "Nonexistent or implicit-overriding role"
}
}
},
"inconsistentStyles": {
"testaro": {
"styleDiff": {
"score": 8,
"what": "Heading, link, and button style inconsistencies"
}
}
},
"zIndexNotZero": {
"testaro": {
"zIndex": {
"score": 3,
"what": "Layering with nondefault z-index values"
}
}
},
"invisibleLabel": {
"alfa": {
"r14": {
"score": 3,
"what": "Visible label is not in the accessible name"
}
},
"axe": {
"label-content-name-mismatch": {
"score": 2,
"what": "Element visible text is not part of its accessible name"
}
},
"htmlcs": {
"w:AA.2_5_3.F96": {
"score": 2,
"what": "Visible label is not in the accessible name"
}
}
},
"contrastAAA": {
"alfa": {
"r66": {
"score": 1,
"what": "Text contrast less than AAA requires"
}
},
"axe": {
"color-contrast-enhanced": {
"score": 49,
"what": "Element has insufficient color contrast (Level AAA)"
}
},
"tenon": {
"95": {
"score": 11,
"what": "Element has insufficient color contrast (Level AAA)"
}
}
},
"allCaps": {
"alfa": {
"r72": {
"score": 1,
"what": "Paragraph text is uppercased"
}
}
},
"noLeading": {
"alfa": {
"r73": {
"score": 12,
"what": "Paragraph of text has insufficient line height"
}
}
},
"ariaBadAttribute": {
"axe": {
"aria-allowed-attr": {
"score": 1,
"what": "ARIA attribute is invalid for the role of its element"
}
}
},
"contrastAA": {
"axe": {
"color-contrast": {
"score": 5,
"what": "Element has insufficient color contrast"
}
}
},
"hiddenContentRisk": {
"axe": {
"hidden-content": {
"score": 1,
"what": "Some content is hidden and therefore may not be testable for accessibility"
}
}
},
"pseudoNavListRisk": {
"htmlcs": {
"w:AA.1_3_1.H48": {
"score": 1,
"what": "Navigation links are not coded as a list"
}
}
},
"scrollRisk": {
"htmlcs": {
"w:AA.1_4_10.C32,C31,C33,C38,SCR34,G206": {
"score": 1,
"what": "Fixed-position element may force bidirectional scrolling"
}
}
},
"contrastRisk": {
"htmlcs": {
"w:AA.1_4_3.G145.Alpha": {
"score": 1,
"what": "Contrast between the text and its background may be less than 3:1, given the transparency"
},
"w:AA.1_4_3.G18.Alpha": {
"score": 2,
"what": "Contrast between the text and its background may be less than 4.5:1, given the transparency"
}
}
},
"pseudoLinkRisk": {
"wave": {
"a:underline": {
"score": 1,
"what": "CSS underline on text that is not a link"
}
},
"tenon": {
"129": {
"score": 2,
"what": "CSS underline on text that is not a link"
}
}
},
"videoCaptionRisk": {
"wave": {
"a:youtube_video": {
"score": 1,
"what": "YouTube video may have no or incorrect captions"
}
}
},
"linkVague": {
"tenon": {
"73": {
"score": 3,
"what": "Link text is too generic to communicate the purpose or destination"
}
}
},
"linkTextsSame": {
"tenon": {
"98": {
"score": 6,
"what": "Links have the same text but different destinations"
}
}
},
"leadingClipsText": {
"tenon": {
"144": {
"score": 44,
"what": "Line height is insufficent to properly display the computed font size"
}
}
},
"targetSize": {
"tenon": {
"152": {
"score": 4,
"what": "Actionable element is smaller than the minimum required size"
}
}
},
"linkForcesNewWindow": {
"tenon": {
"218": {
"score": 3,
"what": "Link opens in a new window without user control"
}
}
}
},
"solos": {}
},
"preventionScores": {},
"summary": {
"total": 250,
"log": 0,
"preventions": 0,
"solos": 0,
"groups": [
{
"groupName": "contrastAAA",
"score": 56
},
{
"groupName": "leadingClipsText",
"score": 46
},
{
"groupName": "linkIndication",
"score": 44
},
{
"groupName": "noLeading",
"score": 14
},
{
"groupName": "inconsistentStyles",
"score": 10
},
{
"groupName": "linkTextsSame",
"score": 8
},
{
"groupName": "invisibleLabel",
"score": 7
},
{
"groupName": "contrastAA",
"score": 7
},
{
"groupName": "targetSize",
"score": 6
},
{
"groupName": "zIndexNotZero",
"score": 5
},
{
"groupName": "contrastRisk",
"score": 5
},
{
"groupName": "linkVague",
"score": 5
},
{
"groupName": "linkForcesNewWindow",
"score": 5
},
{
"groupName": "roleBad",
"score": 4
},
{
"groupName": "pseudoLinkRisk",
"score": 4
},
{
"groupName": "visibleBulk",
"score": 3
},
{
"groupName": "hoverSurprise",
"score": 3
},
{
"groupName": "allCaps",
"score": 3
},
{
"groupName": "ariaBadAttribute",
"score": 3
},
{
"groupName": "hiddenContentRisk",
"score": 3
},
{
"groupName": "pseudoNavListRisk",
"score": 3
},
{
"groupName": "scrollRisk",
"score": 3
},
{
"groupName": "videoCaptionRisk",
"score": 3
}
]
}
}
}