Page Scan Results:

Contact Us

https://www.hptc.edu/contact-2-2 Scanned Sep. 17, 2023 at 9:03 PM

Known Issues - These "violations" have been flagged as problematic by Axe, our accessibility scanner. Axe's "no false positives" philosophy means that if it's shown here, it's likely a problem to someone.

Known Issues Summary

Form elements must have labels: 1

Known Issues on This Page

Form elements must have labels

critical

Ensures every form element has a label. Axe Reference

Rule type: WCAG 2.0 A, WCAG SC 4.1.2, Old Section 508, EN-301-549, EN-9.4.1.2, ACT

```
<input inputmode="numeric" id="phone-3f149298-6a61-414b-8b9d-bd738696c543-input-field" autocomplete="tel-national" class="EPP7gUN4hvOdLcPLvYT2" aria-invalid="false" type="text" value="">
```
Element selector:
#phone-3f149298-6a61-414b-8b9d-bd738696c543-input-field
Failing checks (At least one of these should pass)
- Form element does not have an implicit (wrapped) <label>
- Form element does not have an explicit <label> .EEMfEixsuO1vg4NCa5hi > .field[data-dynamic-strings=""] > .LvAkJ9xQ71AovsTYPLTr.caption
- 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 has no placeholder attribute
- Element's default semantics were not overridden with role="none" or role="presentation"

Needs Review - These "incomplete" issues may be problematic, but couldn't be completely tested automatically. They should be reviewed by a real person.

Needs Review Summary

Elements must meet minimum color contrast ratio thresholds: 17
aria-roledescription must be on elements with a semantic role: 1

Needs Review on This Page

Elements must meet minimum color contrast ratio thresholds

serious

Ensures the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds. Axe Reference

Rule type: WCAG 2.0 AA, WCAG SC 1.4.3, EN-301-549, EN-9.1.4.3, ACT

<a class="header-nav-folder-title preScale scaleIn" href="/about" tabindex="-1" data-animation-role="header-element" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.0352941s;">
About
</a>

Element selector:

.header-nav-folder-title.scaleIn[href$="about"]

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

<a class="header-nav-folder-title preScale scaleIn" href="/information-for-students" tabindex="-1" data-animation-role="header-element" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.0529412s;">
Information for Students
</a>

Element selector:

.header-nav-folder-title.scaleIn[href$="information-for-students"]

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

```
<a href="/career-programs" data-animation-role="header-element" class="preScale scaleIn" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.0705882s;">
Career Programs
</a>
```
Element selector:
.scaleIn[href$="career-programs"][data-animation-role="header-element"]
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<a href="/short-term-programs" data-animation-role="header-element" class="preScale scaleIn" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.0882353s;">
Short Term Programs
</a>
```
Element selector:
.scaleIn[href$="short-term-programs"][data-animation-role="header-element"]
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element

<a class="header-nav-folder-title preScale scaleIn" href="/business-industry" tabindex="-1" data-animation-role="header-element" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.105882s;">
Business &amp; Industry
</a>

Element selector:

.header-nav-folder-title.scaleIn[href$="business-industry"]

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

```
<a class="header-nav-folder-title preScale scaleIn" href="/contact-us" tabindex="-1" data-animation-role="header-element" aria-current="true" style="transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.123529s;">
Contact Us
</a>
```
Element selector:
.header-display-desktop > .header-title-nav-wrapper > .header-nav > .header-nav-wrapper > .header-nav-list > .header-nav-item--active.header-nav-item--folder.header-nav-item > .header-nav-folder-title[href$="contact-us"][aria-current="true"]
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element

<h1 style="white-space: pre-wrap; transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.317647s;" class="preScale scaleIn">Contact Us</h1>

Element selector:

h1

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

```
<span class="sqsrte-text-color--accent">Address</span>
```
Element selector:
#block-8e4450aa04e73b304456 > .sqs-block-content > .sqs-html-content > h3:nth-child(1) > .sqsrte-text-color--accent
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element

<p class="sqsrte-large preFade fadeIn" style="white-space: pre-wrap; transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.352941s;">High Plains Technology Center<br>3921 34th Street<br>Woodward, OK 73801</p>

Element selector:

.sqsrte-large

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

<h3 style="white-space: pre-wrap; transition-timing-function: ease; transition-duration: 1.2s; transition-delay: 0.370588s;" class="preScale scaleIn"><span class="sqsrte-text-color--accent"><strong>Phone</strong></span><br><br>580-256-6618</h3>

Element selector:

h3:nth-child(3)

Failing checks (At least one of these should pass)

Element's background color could not be determined because it is overlapped by another element

```
<strong>Phone</strong>
```
Element selector:
strong
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<span class="description required">(required)</span>
```
Element selector:
.pDrrGovH4WPE4ap28zXo > .description.required
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<span class="description required">(required)</span>
```
Element selector:
#email-yui_3_17_2_1_1655960843848_1602 > .ORJvfAX1j_0GYzxaesgd.title > .V_yH0Ko5JiN5z1pCuJtb > .xHXC4uuk1CR_E981Erer > .description.required
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<span class="description required">(required)</span>
```
Element selector:
#text-yui_3_17_2_1_1655960843848_1603 > .ORJvfAX1j_0GYzxaesgd.title > .V_yH0Ko5JiN5z1pCuJtb > .xHXC4uuk1CR_E981Erer > .description.required
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<span class="description required">(required)</span>
```
Element selector:
#textarea-yui_3_17_2_1_1655960843848_1604 > .ORJvfAX1j_0GYzxaesgd.title > .V_yH0Ko5JiN5z1pCuJtb > .xHXC4uuk1CR_E981Erer > .description.required
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it is overlapped by another element
```
<textarea id="textarea-yui_3_17_2_1_1655960843848_1604-field" aria-invalid="false" class="N6XNqaZKAVtWxncrvkab" placeholder=""></textarea>
```
Element selector:
#textarea-yui_3_17_2_1_1655960843848_1604-field
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it's partially obscured by another element #textarea-yui_3_17_2_1_1655960843848_1604-field
```
<a role="option" href="#" id="weglot-language-es" tabindex="-1"><img src="https://cdn.weglot.com/flags/rectangle_mat/mx.svg" width="30" height="20" role="none" alt="Español flag" class="wg-flag">Español</a>
```
Element selector:
#weglot-language-es
Failing checks (At least one of these should pass)
- Element's background color could not be determined because it's partially obscured by another element #textarea-yui_3_17_2_1_1655960843848_1604-field

aria-roledescription must be on elements with a semantic role

serious

Ensure aria-roledescription is only used on elements with an implicit or explicit role. Axe Reference

Rule type: WCAG 2.0 A, WCAG SC 4.1.2, EN-301-549, EN-9.4.1.2, deprecated

<div tabindex="0" aria-label="Map" aria-roledescription="map" role="region" style="position: absolute; z-index: 0; left: 0px; top: 0px; height: 100%; width: 100%; padding: 0px; border-width: 0px; margin: 0px; cursor: url(&quot;https://maps.gstatic.com/mapfiles/openhand_8_8.cur&quot;), default; touch-action: pan-x pan-y;">

Element selector:

div[aria-label="Map"]

Failing checks (At least one of these should pass)

Check that the aria-roledescription is announced by supported screen readers

Page Scan Results: Contact Us

Known Issues Summary

Known Issues on This Page

Form elements must have labels

Needs Review Summary

Needs Review on This Page

Elements must meet minimum color contrast ratio thresholds

aria-roledescription must be on elements with a semantic role

Page Scan Results:

Contact Us