Accessibility Audit Report

mars

Completed27 Jun 2026, 11:43viewport 756 × 413

Accessibility score

F20 / 100

Critical issues

Weighted by issue severity and affected elements.

Affected elements by severity

Critical8

Serious24

Moderate43

Minor0

Rule violations

Affected elements

Passed checks

Manual review

Executive summary

dequeuniversity.com/demo/mars scored 20/100 — a failing grade driven by issues that block core functionality for people with disabilities.

Across the page, automated checks flagged 12 distinct rule violations affecting 75 elements: 8 critical, 24 serious, and 43 moderate. The critical failures — buttons must have discernible text, images must have alternative text, and select element must have an accessible name — prevent screen-reader and keyboard users from completing key tasks.

A further 3 checks could not be evaluated automatically and require manual review, while 45 checks passed. Remediating the three critical rules and the most frequent serious issue — links must have discernible text — will clear the highest-impact barriers first.

Methodology

Scanned against WCAG 2.0 / 2.1 success criteria at a 756 × 413 viewport, with the results mapped to practical EN 301 549 and European Accessibility Act readiness. Automated testing detects only part of WCAG risk; pair it with manual keyboard and assistive-technology testing for full coverage.

Legal compliance risk

Digital Accessibility Act readiness

Since 28 June 2025, the European Accessibility Act (Directive (EU) 2019/882) has applied to covered digital services across the EU market. Many organizations refer to this as the Digital Accessibility Act in procurement and compliance work. In practice, websites, apps, e-commerce, banking, transport, media and support journeys should align with EN 301 549 and WCAG AA expectations.

Non-compliance can trigger formal complaints, corrective orders, national authority investigations, financial penalties in EUR, reputational harm, contract loss, and restrictions on placing or keeping a non-conforming service in the market. This audit found 12 accessibility issues that may expose your organization to this risk and should be remediated promptly.

Priority implication: treat critical checkout, booking, account, payment and support barriers as commercial and compliance risks, not only technical defects. Remediation evidence can help demonstrate due diligence if customers, public buyers or regulators request proof of accessibility work.

Findings

12 rule violations, grouped by severity.

Critical3 rules · 8 elements

Serious7 rules · 24 elements

Moderate2 rules · 43 elements

Critical

3 rules · 8 elements

Criticalimage-alt

elements

Images must have alternative text

Ensure <img> elements have alternative text or a role of none or presentation

WCAG 2.0 AWCAG 1.1.1

Why it matters

Blocks people with disabilities from using core functionality. Fix as a top priority.

How to fix

→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"

Where — sample elements

img[src$="seg"]

<img src="/assets/demo-sites/mars/js/seg" width="1" height="1">

li:nth-child(1) > a[href="mars2.html?a=crater_adventure"] > img[width="210"][height="120"]

<img src="/assets/demo-sites/mars/images/mars-spaceman.jpg" class="" width="210" height="120">

li:nth-child(8) > a[href="mars2.html?a=crater_adventure"] > img[width="210"][height="120"]

<img src="/assets/demo-sites/mars/images/mars-spaceman.jpg" class="" width="210" height="120">

+ 1 more affected element

Learn more ↗

Criticalbutton-name

elements

Buttons must have discernible text

Ensure buttons have discernible text

WCAG 2.0 AWCAG 4.1.2

Why it matters

Blocks people with disabilities from using core functionality. Fix as a top priority.

How to fix

→Element does not have inner 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
→Element does not have an implicit (wrapped) <label>
→Element does not have an explicit <label>
→Element's default semantics were not overridden with role="none" or role="presentation"

Where — sample elements

.departure-date > .ui-datepicker-trigger:nth-child(4)

<button class="ui-datepicker-trigger" type="button">
<!-- <img title="..." alt="..." src="/redesign/assets/demo-sites/mars/images/calendar.png"> -->
</button>

#player, .ytmVideoInfoChannelAvatar

<button class="ytmVideoInfoLink ytmVideoInfoChannelAvatar"><img class="ytCoreImageHost ytmVideoInfoChannelLogo ytCoreImageFillParentHeight ytCoreImageFillParentWidth ytCoreImageContentModeScaleAspectFill" alt="thumbnail-image" style="background-color: transparent;"></button>

Learn more ↗

Criticalselect-name

elements

Select element must have an accessible name

Ensure select element has an accessible name

WCAG 2.0 AWCAG 4.1.2

Why it matters

Blocks people with disabilities from using core functionality. Fix as a top priority.

How to fix

→Element does not have an implicit (wrapped) <label>
→Element does not have an explicit <label>
→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"

Where — sample elements

#time0

<select name="time0" id="time0" class="select-time" tabindex="4">

#passenger0 > .age-range.wrapper > .traveler-type

<select id="traveler0" class="traveler-type">
<option value="0">Adult (26+)</option>
<option value="1">Youth (12-25)</option>
<option value="2">Child (4-11)</option>
<option value="3">Senior (60+)</option>
</select>

Learn more ↗

Serious

7 rules · 24 elements

Seriouslink-name

elements

Links must have discernible text

Ensure links have discernible text

WCAG 2.0 AWCAG 2.4.4WCAG 4.1.2

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→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
→Element is in tab order and does not have accessible text

Where — sample elements

.link[href$="mars/#"]

<a class="link" href="demo/mars/#"><i class="icon-menu-home"></i></a>

li:nth-child(1) > a[href="mars2.html?a=crater_adventure"]

<a href="mars2.html?a=crater_adventure">
<img src="/assets/demo-sites/mars/images/mars-spaceman.jpg" class="" width="210" height="120"></a>

li:nth-child(8) > a[href="mars2.html?a=crater_adventure"]

<a href="mars2.html?a=crater_adventure">
<img src="/assets/demo-sites/mars/images/mars-spaceman.jpg" class="" width="210" height="120"></a>

+ 5 more affected elements

Learn more ↗

Seriouscolor-contrast

elements

Elements must meet minimum color contrast ratio thresholds

Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds

WCAG 2.0 AAWCAG 1.4.3

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→Element has insufficient color contrast of 4.31 (foreground color: #ff9999, background color: #344b6e, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio of 4.5:1
→Element has insufficient color contrast of 4.49 (foreground color: #acbad0, background color: #344b6e, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1
→Element has insufficient color contrast of 1.87 (foreground color: #067ab4, background color: #344b6e, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio of 4.5:1
→Element has insufficient color contrast of 2.83 (foreground color: #46a546, background color: #344b6e, font size: 13.5pt (18px), font weight: normal). Expected contrast ratio of 4.5:1
→Element has insufficient color contrast of 1.18 (foreground color: #555555, background color: #344b6e, font size: 8.3pt (11px), font weight: normal). Expected contrast ratio of 4.5:1

Where — sample elements

a[href="mars2.html?a=be_bold"] > h3

<h3>Be Bold...</h3>

#vap-plan > p:nth-child(3)

<p>Step out of your comfort zone, and into a rocket with enough fuel to blast a Manhattan-sized crater if it explodes. But it won't. Probably.<br>
&nbsp; </p>

a[href="mars2.html?a=countdown"] > h3

<h3>Countdown...</h3>

+ 4 more affected elements

Learn more ↗

Serioustabindex

elements

Elements should not have tabindex greater than zero

Ensure tabindex attribute values are not greater than 0

Best practice

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→Element has a tabindex greater than 0

Where — sample elements

#from0

<input type="text" value="" class="city-input ac_input ui-autocomplete-input" autocomplete="off" id="from0" name="from0" tabindex="1" role="textbox" aria-autocomplete="list" aria-haspopup="true">

#to0

<input type="text" value="" class="city-input ac_input ui-autocomplete-input" autocomplete="off" id="to0" name="to0" tabindex="1" role="textbox" aria-autocomplete="list" aria-haspopup="true">

#deptDate0

<input size="10" id="deptDate0" name="deptDate0" placeholder="mm/dd/yyyy" value="" tabindex="3" class="hasDatepicker input-dept">

+ 1 more affected element

Learn more ↗

Seriousframe-title

elements

Frames must have an accessible name

Ensure <iframe> and <frame> elements have an accessible name

WCAG 2.0 AWCAG 4.1.2

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→Element has no title 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's default semantics were not overridden with role="none" or role="presentation"

Where — sample elements

#player

<iframe width="365" height="205" name="player" id="player" src="https://www.youtube.com/embed/OagLGti_hTE?controls=1&amp;showinfo=1&amp;modestbranding=0&amp;wmode=opaque&amp;enablejsapi=1" frameborder="0" allowfullscreen=""></iframe>

#fafbba78

<iframe id="fafbba78" name="f2bc5e72d" scrolling="no" style="border: none; overflow: hidden; height: 62px; width: 292px;" class="fb_ltr" src="/assets/demo-sites/mars/js/likebox.html"></iframe>

Learn more ↗

Seriousaria-prohibited-attr

element

Elements must only use permitted ARIA attributes

Ensure ARIA attributes are not prohibited for an element's role

WCAG 2.0 AWCAG 4.1.2

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→aria-label attribute cannot be used on a div with no valid role attribute.

Where — sample elements

#player, #movie_player

<div class="html5-video-player ytp-hide-controls ytp-exp-bottom-control-flexbox ytp-modern-caption ytp-livebadge-color unstarted-mode ytp-small-mode" tabindex="" id="movie_player" data-version="/s/player/5b27766f/player_embed.vflset/en_GB/base.js" aria-label="YouTube Video Player">

Learn more ↗

Serioushtml-has-lang

element

<html> element must have a lang attribute

Ensure every HTML document has a lang attribute

WCAG 2.0 AWCAG 3.1.1

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→The <html> element does not have a lang attribute

Where — sample elements

html

<html class=" js no-flexbox flexb...">

Learn more ↗

Seriouslink-in-text-block

element

Links must be distinguishable without relying on color

Ensure links are distinguished from surrounding text in a way that does not rely on color

WCAG 2.0 AWCAG 1.4.1

Why it matters

Causes significant barriers for assistive-technology users. Should be fixed soon.

How to fix

→The link has insufficient color contrast of 1.17:1 with the surrounding text. (Minimum contrast is 3:1, link text: #e7c643, surrounding text: #acbad0)
→The link has no styling (such as underline) to distinguish it from the surrounding text

Where — sample elements

a[href="mars2.html?a=last_will"]

<a href="mars2.html?a=last_will">prepare your last will and testament</a>

Learn more ↗

Moderate

2 rules · 43 elements

Moderateregion

elements

All page content should be contained by landmarks

Ensure all page content is contained by landmarks

Best practice

Why it matters

Creates friction and a degraded experience for some users.

How to fix

→Some page content is not contained by landmarks

Where — sample elements

body > div:nth-child(1)

<div style="width: 1px; height: 1px; display: inline;">

#purposeDisclaimer

<div id="purposeDisclaimer">This web page is for demonstration purposes, to show common accessibility errors.</div>

.loginnow > .container-fluid-full > .container > .span5.pull-left.left-first > .pull-left:nth-child(2) > form[method="get"][action="/demo/mars/mars2"] > .search[name="query"][placeholder="search"]

<input type="text" class="search" name="query" placeholder="search">

+ 39 more affected elements

Learn more ↗

Moderatelandmark-unique

element

Landmarks should have a unique role or role/label/title (i.e. accessible name) combination

Ensure landmarks are unique

Best practice

Why it matters

Creates friction and a degraded experience for some users.

How to fix

→The landmark must have a unique aria-label, aria-labelledby, or title to make landmarks distinguishable

Where — sample elements

.loginnow > .container-fluid-full > .container > .span5.pull-left.left-first > .pull-left:nth-child(1)

<nav id="left-control-nav" class="pull-left">

Learn more ↗

Needs manual review

3 checks could not be decided automatically and should be verified by a person.

color-contrast73

Elements must meet minimum color contrast ratio thresholds

Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds

duplicate-id-aria1

IDs used in ARIA and labels must be unique

Ensure every id attribute value used in ARIA and in labels is unique

link-in-text-block3

Links must be distinguishable without relying on color

Ensure links are distinguished from surrounding text in a way that does not rely on color

Passed checks45

Automated checks that returned no violations on this page.

aria-allowed-attr
aria-allowed-role
aria-conditional-attr
aria-deprecated-role
aria-hidden-body
aria-hidden-focus
aria-prohibited-attr
aria-required-attr
aria-roles
aria-text
aria-valid-attr-value
aria-valid-attr
autocomplete-valid
avoid-inline-spacing
button-name
bypass

+ 29 more passed checks

Choose Your Path to Compliance

Select the option that works best for you

AI-Powered Fix Instructions

Get detailed, step-by-step instructions with AI assistance to fix issues yourself

✓Code examples and solutions
✓Priority-based guidance
✓Instant access

Full Manual Audit by Expert

Order a comprehensive manual audit from accessibility specialists

✓Expert human review
✓Detailed remediation report
✓Priority support