color-contrast - Elements must meet minimum color contrast ratio thresholds
Impact: serious
Description: Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds
Help: Elements must meet minimum color contrast ratio thresholds
Tags: cat.color, wcag2aa, wcag143, TTv5, TT13.c, EN-301-549, EN-9.1.4.3, ACT
Affected Elements (7)
<a class="btn btn-rounded bg-ccmnet-lightblue text-white m-0 text-decoration-none mt-1 px-5 mb-3" href="/user/register/">Join CCMNet</a>
Target: .mt-1
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 2.68 (foreground color: #ffffff, background color: #06a9e5, font size: 10.5pt (14px), font weight: bold). Expected contrast ratio of 4.5:1
<div class="text-uppercase ml-2">
Recruiting: Mentor </div>
Target: .col.col-lg-4.carousel-item:nth-child(2) > .views-field.views-field-field-me-state > .field-content > .rounded-bottom-left.border-ccmnet-blue.bg-white > .bg-teal.py-2.align-middle > .ml-2.text-uppercase
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 3.07 (foreground color: #ffffff, background color: #28a588, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio of 4.5:1
<a class="text-white corner-triangle text-uppercase bg-teal" href="/node/10913">More</a>
Target: a[href="/node/10913"]
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 3.07 (foreground color: #ffffff, background color: #28a588, font size: 10.5pt (14px), font weight: normal). Expected contrast ratio of 4.5:1
<a class="btn btn-rounded bg-ccmnet-lightblue text-white m-0 text-decoration-none mt-5 px-5 mb-3" href="https://ccmnet.org/mentorships">See All</a>
Target: .btn-rounded.bg-ccmnet-lightblue.mt-5
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 2.68 (foreground color: #ffffff, background color: #06a9e5, font size: 10.5pt (14px), font weight: bold). Expected contrast ratio of 4.5:1
<h2 class="text-white text-large">Learn about the program in <br> the CCMNet Guide</h2>
Target: .order-2 > .text-large
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 2.68 (foreground color: #ffffff, background color: #06a9e5, font size: 24.3pt (32.4px), font weight: bold). Expected contrast ratio of 3:1
<a href="https://new.nsf.gov/funding/opportunities/research-coordination-networks-fostering-nurturing/nsf22-558/solicitation">RCN:CIP solicitation</a>
Target: .text-left:nth-child(1) > a
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 4.38 (foreground color: #06a9e5, background color: #04376f, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 4.5:1
<a href="https://dl.acm.org/doi/pdf/10.1145/3507694">Transforming Science through Cyberinfrastructure</a>
Target: .text-left:nth-child(3) > a
Failure Summary:
Fix any of the following:
Element has insufficient color contrast of 4.38 (foreground color: #06a9e5, background color: #04376f, font size: 9.8pt (13px), font weight: normal). Expected contrast ratio of 4.5:1
image-alt - Images must have alternative text
Impact: critical
Description: Ensure ![]()
elements have alternative text or a role of none or presentation
Help: Images must have alternative text
Tags: cat.text-alternatives, wcag2a, wcag111, section508, section508.22.a, TTv5, TT7.a, TT7.b, EN-301-549, EN-9.1.1.1, ACT
Affected Elements (2)
<img width="82" height="82" src="/themes/contrib/asp-theme/images/logos/NSF_logo.svg">
Target: .container > div:nth-child(1) > .nsf-logo[href$="nsf.gov/"][rel="noopener"] > img[width="82"][height="82"]
Failure Summary:
Fix any of the following:
Element does not have an alt attribute
aria-label attribute does not exist or is empty
aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
Element has no title attribute
Element's default semantics were not overridden with role="none" or role="presentation"
<img width="82" height="82" src="/themes/nect-theme/img/NSF_logo.svg">
Target: .col-2 > .nsf-logo[href$="nsf.gov/"][rel="noopener"] > img[width="82"][height="82"]
Failure Summary:
Fix any of the following:
Element does not have an alt attribute
aria-label attribute does not exist or is empty
aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
Element has no title attribute
Element's default semantics were not overridden with role="none" or role="presentation"
landmark-one-main - Document should have one main landmark
Impact: moderate
Description: Ensure the document has a main landmark
Help: Document should have one main landmark
Tags: cat.semantics, best-practice
Affected Elements (1)
<html lang="en" dir="ltr" class=" js">
Target: html
Failure Summary:
Fix all of the following:
Document does not have a main landmark
landmark-unique - Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Impact: moderate
Description: Ensure landmarks are unique
Help: Landmarks should have a unique role or role/label/title (i.e. accessible name) combination
Tags: cat.semantics, best-practice
Affected Elements (1)
<nav class="navbar navbar-expand secondary-nav navbar-light bg-light " id="secondaryNav">
Target: #secondaryNav
Failure Summary:
Fix any of the following:
The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable
link-in-text-block - Links must be distinguishable without relying on color
Impact: serious
Description: Ensure links are distinguished from surrounding text in a way that does not rely on color
Help: Links must be distinguishable without relying on color
Tags: cat.color, wcag2a, wcag141, TTv5, TT13.a, EN-301-549, EN-9.1.4.1
Affected Elements (2)
<a href="https://new.nsf.gov/funding/opportunities/research-coordination-networks-fostering-nurturing/nsf22-558/solicitation">RCN:CIP solicitation</a>
Target: .text-left:nth-child(1) > a
Failure Summary:
Fix any of the following:
The link has insufficient color contrast of 2.68:1 with the surrounding text. (Minimum contrast is 3:1, link text: #06a9e5, surrounding text: #ffffff)
The link has no styling (such as underline) to distinguish it from the surrounding text
<a href="https://dl.acm.org/doi/pdf/10.1145/3507694">Transforming Science through Cyberinfrastructure</a>
Target: .text-left:nth-child(3) > a
Failure Summary:
Fix any of the following:
The link has insufficient color contrast of 2.68:1 with the surrounding text. (Minimum contrast is 3:1, link text: #06a9e5, surrounding text: #ffffff)
The link has no styling (such as underline) to distinguish it from the surrounding text
link-name - Links must have discernible text
Impact: serious
Description: Ensure links have discernible text
Help: Links must have discernible text
Tags: cat.name-role-value, wcag2a, wcag244, wcag412, section508, section508.22.a, TTv5, TT6.a, EN-301-549, EN-9.2.4.4, EN-9.4.1.2, ACT
Affected Elements (2)
<a class="nsf-logo" href="https://www.nsf.gov/" target="_blank" rel="noopener">
<img width="82" height="82" src="/themes/contrib/asp-theme/images/logos/NSF_logo.svg">
</a>
Target: .container > div:nth-child(1) > .nsf-logo[href$="nsf.gov/"][rel="noopener"]
Failure Summary:
Fix all of the following:
Element is in tab order and does not have accessible text
Fix any of the following:
Element does not have text that is visible to screen readers
aria-label attribute does not exist or is empty
aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
Element has no title attribute
<a class="nsf-logo" href="https://www.nsf.gov/" target="_blank" rel="noopener">
<img width="82" height="82" src="/themes/nect-theme/img/NSF_logo.svg">
</a>
Target: .col-2 > .nsf-logo[href$="nsf.gov/"][rel="noopener"]
Failure Summary:
Fix all of the following:
Element is in tab order and does not have accessible text
Fix any of the following:
Element does not have text that is visible to screen readers
aria-label attribute does not exist or is empty
aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
Element has no title attribute
page-has-heading-one - Page should contain a level-one heading
Impact: moderate
Description: Ensure that the page, or at least one of its frames contains a level-one heading
Help: Page should contain a level-one heading
Tags: cat.semantics, best-practice
Affected Elements (1)
<html lang="en" dir="ltr" class=" js">
Target: html
Failure Summary:
Fix all of the following:
Page must have a level-one heading
region - All page content should be contained by landmarks
Impact: moderate
Description: Ensure all page content is contained by landmarks
Help: All page content should be contained by landmarks
Tags: cat.keyboard, best-practice
Affected Elements (9)
<div class="layout layout--twocol-section layout--twocol-section--50-50">
Target: .layout--twocol-section
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<header>
<h2 class="text-large text-white text-center mb-5">Featured Mentorships</h2>
</header>
Target: .bg-ccmnet-navy > header
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="col col-lg-4 carousel-item active">
Target: .active
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="col col-lg-4 carousel-item">
Target: .col.col-lg-4.carousel-item:nth-child(2)
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="col col-lg-4 carousel-item">
Target: .col.col-lg-4.carousel-item:nth-child(3)
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="col col-lg-4 carousel-item">
Target: .col.col-lg-4.carousel-item:nth-child(4)
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="col col-lg-4 carousel-item">
Target: .col.col-lg-4.carousel-item:nth-child(5)
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<footer class="d-flex justify-content-center">
<a class="btn btn-rounded bg-ccmnet-lightblue text-white m-0 text-decoration-none mt-5 px-5 mb-3" href="https://ccmnet.org/mentorships">See All</a>
</footer>
Target: .bg-ccmnet-navy > footer
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks
<div class="layout layout--onecol">
Target: .layout--onecol.layout:nth-child(3)
Failure Summary:
Fix any of the following:
Some page content is not contained by landmarks