https://prod.masshousing.com/maintain-your-home/ PASS

Score: 100/100 • Errors: 0 • Warnings: 2 • Notices: 0
Tests Passed: 26/28 • Response Time: 4076ms
Target: WCAG 2.2 Level AA • Settle Delay: 2000ms • Audit Profile: wcag • Run Profile: desktop
Tags Used: wcag2a, wcag2aa, wcag21a, wcag21aa, wcag22a, wcag22aa
Excluded Rules: none

Incomplete (manual review) (2)

aria-valid-attr-value critical

ARIA attributes must conform to valid values

Manual review required to confirm this issue.

Learn more

nodes: 2

target button[aria-controls="mh-translation-sign-in-menu"]

Fix all of the following: Unable to determine if aria-controls referenced ID exists on the page while using aria-haspopup: aria-controls="mh-translation-sign-in-menu"

HTML snippet

<button type="button" class="mh-translation-bar__..." aria-label="Log In" :aria-expanded="$store.signInMenu.op..." aria-controls="mh-translation-sign-..." aria-haspopup="dialog" @click="$store.translateMenu..." aria-expanded="false">

target button[aria-label="Translate"]

Fix all of the following: Unable to determine if aria-controls referenced ID exists on the page while using aria-haspopup: aria-controls="mh-translation-language-menu"

HTML snippet

<button type="button" class="mh-translation-bar__..." aria-label="Translate" :aria-expanded="$store.translateMenu..." aria-controls="mh-translation-langu..." aria-haspopup="listbox" @click="$store.signInMenu.op..." aria-expanded="false">

color-contrast serious

Elements must meet minimum color contrast ratio thresholds

Manual review required to confirm this issue.

Learn more

nodes: 26

target h1

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h1 class="mh-hero__title whitespace-pre-line w-full max-w-[700px]">Maintain Your Home</h1>

target .mh-section--vpad-large > .mh-section__body > .mh-section__inner > .mh-section__blocks > .wp-block-heading

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h2 class="wp-block-heading">Helping you maintain a safe, comfortable home</h2>

target .mh-section__blocks > .wp-block-paragraph

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<p class="wp-block-paragraph">

target .mh-simple-card__title

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<h3 class="mh-simple-card__title m-0 text-xl font-semibold leading-tight text-text-heading">Already a Borrower? Manage your MassHousing account.</h3>

target .mh-simple-card__ctas > .mh-secondary-link[rel="noopener noreferrer"][target="_blank"] > .mh-secondary-link__inner > .mh-secondary-link__label

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<span class="mh-secondary-link__label">
				Visit MassHousing Connect⁠<span class="mh-secondary-link__tail"><span class="mh-secondary-link__icon notranslate" aria-hidden="true" translate="no"></span></span>			</span>

target .mh-section--bg-beige-gradient.mh-section--block-spacing-medium.mh-section--vpad-normal > .mh-section__body > .mh-section__inner > .mh-section__blocks > .wp-block-heading

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h2 class="wp-block-heading">Tools &amp; Resources for Homeowners</h2>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(1) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__title

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<h3 class="mh-icon-card__title">Manage Your MassHousing Mortgage</h3>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(1) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__body

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<div class="mh-icon-card__body">View loan details, make payments, and manage your MassHousing Mortgage online.</div>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(1) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__footer.mh-card-ctas > .mh-secondary-link[rel="noopener noreferrer"][target="_blank"] > .mh-secondary-link__inner > .mh-secondary-link__label

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<span class="mh-secondary-link__label">
				Visit MassHousing Connect⁠<span class="mh-secondary-link__tail"><span class="mh-secondary-link__icon notranslate" aria-hidden="true" translate="no"></span></span>			</span>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(2) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__title

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<h3 class="mh-icon-card__title">Massachusetts Energy Savings Finder</h3>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(2) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__body

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<div class="mh-icon-card__body">Use this free tool to identify rebates and incentives to help reduce your home energy use and reliance on fossil fuels.</div>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(2) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__footer.mh-card-ctas > .mh-secondary-link[rel="noopener noreferrer"][target="_blank"] > .mh-secondary-link__inner > .mh-secondary-link__label

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<span class="mh-secondary-link__label">
				Visit the Savings Finder⁠<span class="mh-secondary-link__tail"><span class="mh-secondary-link__icon notranslate" aria-hidden="true" translate="no"></span></span>			</span>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(3) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__title

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<h3 class="mh-icon-card__title">Apply for MI Plus Benefits</h3>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(3) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__body

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<div class="mh-icon-card__body">If you have lost your job and your mortgage is insured by MassHousing, you may be eligible for MI Plus mortgage payment protection benefits.</div>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(3) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__footer.mh-card-ctas > .mh-secondary-link[rel="noopener noreferrer"][target="_blank"] > .mh-secondary-link__inner > .mh-secondary-link__label

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<span class="mh-secondary-link__label">
				Visit the Eligibility Application⁠<span class="mh-secondary-link__tail"><span class="mh-secondary-link__icon notranslate" aria-hidden="true" translate="no"></span></span>			</span>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(4) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__title

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<h3 class="mh-icon-card__title">Having Trouble Paying Your Mortgage?</h3>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(4) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__text > .mh-icon-card__body

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<div class="mh-icon-card__body">Resources and information for MassHousing Mortgage borrowers having difficulty making payments.</div>

target .mh-icon-card.mh-icon-card--resource.mh-icon-card--linked:nth-child(4) > .mh-icon-card__stack > .mh-icon-card__content > .mh-icon-card__footer.mh-card-ctas > .mh-secondary-link[rel="noopener noreferrer"][target="_blank"] > .mh-secondary-link__inner > .mh-secondary-link__label

Fix any of the following: Element's background color could not be determined due to a pseudo element

HTML snippet

<span class="mh-secondary-link__label">
				View Resources⁠<span class="mh-secondary-link__tail"><span class="mh-secondary-link__icon notranslate" aria-hidden="true" translate="no"></span></span>			</span>

target .mh-highlights-section__card-wrap:nth-child(1) > .mh-teaser-card--large.mh-teaser-card.mh-teaser-card--featured > .mh-teaser-card__media-stack > .mh-teaser-card__overlay > .mh-teaser-card__title

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h3 class="mh-teaser-card__title">Evan Dupree</h3>

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<p class="mh-teaser-card__program-line">Homeownership, Operation Welcome Home</p>

target .mh-highlights-section__card-wrap:nth-child(2) > .mh-teaser-card--small.mh-teaser-card.mh-teaser-card--featured > .mh-teaser-card__media-stack > .mh-teaser-card__overlay > .mh-teaser-card__title

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h3 class="mh-teaser-card__title">Glenda’s Homebuying Story</h3>

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<p class="mh-teaser-card__program-line">Down Payment Assistance, Homeownership</p>

target .mh-highlights-section__card-wrap:nth-child(1) > .mh-teaser-card--small.mh-teaser-card.mh-teaser-card--featured > .mh-teaser-card__media-stack > .mh-teaser-card__overlay > .mh-teaser-card__title

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h3 class="mh-teaser-card__title">Western Mass. Homeowner Looks to ESHLP for Home Energy Improvements</h3>

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<p class="mh-teaser-card__program-line">Homeownership, Mass. Community Climate Bank</p>

target .mh-highlights-section__card-wrap:nth-child(2) > .mh-teaser-card--large.mh-teaser-card.mh-teaser-card--featured > .mh-teaser-card__media-stack > .mh-teaser-card__overlay > .mh-teaser-card__title

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<h3 class="mh-teaser-card__title">Renter Success Story: Nayomi Dowman</h3>

Fix any of the following: Element's background color could not be determined due to a background gradient

HTML snippet

<p class="mh-teaser-card__program-line">Multifamily, Renter Stories</p>