Findings, ranked by severity
minor
ARIA role should be appropriate for the element
axe · aria-allowed-role · 2 elements · landing
ARIA role should be appropriate for the element. (WCAG mapping not surfaced by axe). Deque rule reference.
target: #help-dropdonw-li
<li id="help-dropdonw-li" class="d-md-block d-none login-button grnt-cservi drop-down position-relative customer-care" data-rel="customer-support" role="dialog" aria-modal="
target: li[data-rel="login"]
<li id="login-dropdonw-li" class="d-md-block d-none login-button drop-down position-relative with-search-box login-menu" data-rel="login" role="dialog" aria-modal="false&q
serious
ARIA dialog and alertdialog nodes should have an accessible name
axe · aria-dialog-name · 5 elements · landing
ARIA dialog and alertdialog nodes should have an accessible name. (WCAG mapping not surfaced by axe). Deque rule reference.
target: #personal
<div class="mega-menu op1" id="personal" role="dialog" aria-modal="false">
target: #business
<div class="mega-menu op1" id="business" role="dialog" aria-modal="false">
critical
Certain ARIA roles must contain particular children
axe · aria-required-children · 1 element · landing
Certain ARIA roles must contain particular children. WCAG 2A. Deque rule reference.
target: .financial-calc-carousal-container
<div class="financial-calc-carousal-container" role="tablist">
critical
An ARIA attribute has a value the spec does not allow
axe · aria-valid-attr-value · 3 elements · landing
ARIA attributes must conform to valid values. WCAG 2A. Deque rule reference.
target: #Popular-tab
<button class="nav-link flex-grow-1..." data-tab="popular" data-bs-toggle="tab" type="button" role="tab" aria-selected="true" aria-controls="Popular&quo
target: #Insurance-tab
<button class="nav-link flex-grow-1..." data-tab="insurance" data-bs-toggle="tab" type="button" role="tab" aria-selected="true" aria-controls="Insurance
critical
A button has no accessible name; a screen reader will announce it as "button" with no purpose
axe · button-name · 10 elements · landing
Buttons must have discernible text. WCAG 2A. Deque rule reference.
target: .special-embla-slider > .embla__buttons > .embla__button--prev.embla__button[type="button"]
<button class="embla__button embla__button--prev" type="button" disabled="">
<span class="icon-Left"></span>
</button>
target: .special-embla-slider > .embla__buttons > .embla__button--next.embla__button[type="button"]
<button class="embla__button embla__button--next" type="button" disabled="">
<span class="icon-Right"></span>
</button>
serious
Text does not have enough contrast against its background for low-vision readers
axe · color-contrast · 7 elements · landing
Elements must meet minimum color contrast ratio thresholds. WCAG 2AA. Deque rule reference.
target: #minAmountValSA
<span id="minAmountValSA">₹10K</span>
target: #maxAmountValSA
<span id="maxAmountValSA">₹5Cr</span>
minor
Headings should not be empty
axe · empty-heading · 2 elements · landing
Headings should not be empty. (WCAG mapping not surfaced by axe). Deque rule reference.
target: .calc-title-main.mobile-show > .h3
<h3 class="h3"></h3>
target: .touch-title
<h2 class="touch-title"></h2>
moderate
Heading levels should only increase by one
axe · heading-order · 1 element · landing
Heading levels should only increase by one. (WCAG mapping not surfaced by axe). Deque rule reference.
target: .cf-heading
<h6 class="cf-heading">ON A MISSION TO BUILD THE WORLD’S MOST</h6>
minor
Alternative text of images should not be repeated as text
axe · image-redundant-alt · 22 elements · landing
Alternative text of images should not be repeated as text. (WCAG mapping not surfaced by axe). Deque rule reference.
target: .lozad[alt="FIRST Select"][data-loaded="true"]
<img class="lozad" data-src="/content/dam/idfcfirstbank/images/header-revamp/privilage-img1.png" src="/content/dam/idfcfirstbank/images/header-revamp/privilage-img1.png" alt="FIRST S
target: .lozad[alt="FIRST Wealth"][data-loaded="true"]
<img class="lozad" data-src="/content/dam/idfcfirstbank/images/header-revamp/privilage-img2.png" src="/content/dam/idfcfirstbank/images/header-revamp/privilage-img2.png" alt="FIRST W
critical
A form control has no visible or programmatic label
axe · label · 4 elements · landing
Form elements must have labels. WCAG 2A. Deque rule reference.
target: #gsa-amt
<input value="2000000" type="text" maxlength="12" id="gsa-amt" class="form-input amount-in..." default="2000000" min="10000" max="500000000&qu
target: #slider-gsa-amt
<input type="range" class="amount-range" min="0" max="9" value="2000000" id="slider-gsa-amt" default="2000000" drage-snippet="10000, 25000, 50
serious
A link has no accessible name; a screen reader will announce it as "link" with no purpose
axe · link-name · 21 elements · landing
Links must have discernible text. WCAG 2A, WCAG 244. Deque rule reference.
target: .col-lg-4:nth-child(1) > .cust-new-box.position-relative > .cust-new-redirect[data-gtm-click-text="WhatsApp banking"][data-gtm-click-header="Customer Service&q
<a href="https://api.whatsapp.com/send?phone=919555555555&text=Hi" class="cust-new-redirect gtm-event" data-gtm-event="cta_click" data-gtm-click-category="Header Page Navigat
target: .col-lg-4:nth-child(2) > .cust-new-box.position-relative > .cust-new-redirect[data-gtm-click-text="Track Requests"][data-gtm-click-header="Customer Service&quo
<a href="/customer-care-sr/track-service-request" class="cust-new-redirect gtm-event" data-gtm-event="cta_click" data-gtm-click-category="Header Page Navigation" data-gtm-click-
serious
<ul> and <ol> must only directly contain <li>, <script> or <template> elements
axe · list · 1 element · landing
<ul> and <ol> must only directly contain <li>, <script> or <template> elements. WCAG 2A. Deque rule reference.
target: .search-container-main > .cta-container
<ul class="d-flex align-items-center cta-container">
moderate
The viewport meta blocks zoom, so low-vision users cannot enlarge the page
axe · meta-viewport · 1 element · landing
Zooming and scaling must not be disabled. WCAG 2AA. Deque rule reference.
target: meta[name="viewport"]
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
moderate
All page content should be inside a landmark (header, nav, main, footer)
axe · region · 99 elements · landing
All page content should be contained by landmarks. (WCAG mapping not surfaced by axe). Deque rule reference.
target: .is-snapped.is-center.embla__slide > .nhb-video
<div class="nhb-video ">
target: .nhb-video-gif > video
<video preload="auto" class="d-md-block" autoplay="" loop="" muted="" playsinline="">
