New Scan

52 Score

Koton: Türkiye'nin Öncü Moda ve Giyim Markası

https://www.koton.com/

WCAG 2.1 AA | Dec 29, 2025 01:30

Issue

Failing Elements

Impact

WCAG Criteria

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

1 elements

critical

WCAG 1.1.1

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['.footer__chatbot > img']

<img src="https://054308f5.cdn.akinoncloud.com/static_omnishop/koton487/img/chatbot_icon.png">

2. WHAT DOES THIS MEAN?

Images must have alternative text

3. HOW TO SOLVE IT:

How to Fix It

Images must have alternative text

Learn More

Ensure links have discernible text

16 elements

serious

WCAG 2.4.4

1. FAILING ELEMENTS ON YOUR WEBSITE (16):

SELECTOR: ['.new-homepage-banner.js-homepage-banner:nth-child(6) > .new-homepage-banner__…

<a href="/baklava-desenli-kazak-hirka-suveter/" class="banner-link">

SELECTOR: ['.quadruple-banners-item.js-quadruple-banner-item.-active > pz-analytics-obser…

<a target="_blank" href="/blog">

SELECTOR: ['.-passive.quadruple-banners-item.js-quadruple-banner-item:nth-child(2) > pz-a…

<a target="_blank" href="/blog">

SELECTOR: ['.-passive.quadruple-banners-item.js-quadruple-banner-item:nth-child(3) > pz-a…

<a target="_blank" href="/blog">

SELECTOR: ['.-passive.quadruple-banners-item.js-quadruple-banner-item:nth-child(4) > pz-a…

<a target="_blank" href="/blog">

SELECTOR: ['.footer__chatbot']

<a class="footer__chatbot" href="https://api.whatsapp.com/send?phone=908502087171">
    <img src="https://054308f5.cdn.akinoncloud.com/static_omnishop/koton487/img/chatbot_icon.png">
  </a>

SELECTOR: [['efilli-layout-dynamic', 'a:nth-child(5)']]

<a href="https://www.koton.com/hakkimizda"> </a>

SELECTOR: ['.new-homepage-banner.js-homepage-banner:nth-child(3) > .new-homepage-banner__…

<a href="/yilbasi-hediyesi/?attributes_filterable_gender=Kadın" class="banner-link">

SELECTOR: ['pz-analytics-observed[position="1"] > .slide-link']

<a href="/50yevaran-kampanyali-urunler/?attributes_filterable_gender=Kadın" class="slide-link">

SELECTOR: ['a[href$="kadife-urunler-kadin/"]']

<a href="/kadife-urunler-kadin/" class="banner-link">

... and 6 more element(s)

2. WHAT DOES THIS MEAN?

Links must have discernible text

3. HOW TO SOLVE IT:

How to Fix It

Links must have discernible text

Provide Descriptive Link Text: Every link must have text that describes its purpose. Avoid generic phrases like "click here" or "read more" without context.

Correct Markup Solutions:

Code example

1 <!-- Correct: Descriptive link text -->
2 <a href="/products">View our products</a>
3
4 <!-- Correct: Using aria-label -->
5 <a href="/cart" aria-label="Shopping cart">
6   <img src="cart-icon.svg" alt="">
7 </a>

Incorrect Markup Solutions:

Code example

1 <!-- Incorrect: Empty link -->
2 <a href="/products"></a>
3
4 <!-- Incorrect: Image without alt -->
5 <a href="/cart">
6   <img src="cart-icon.svg">
7 </a>

Learn More

Ensure the banner landmark is at top level

4 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (4):

SELECTOR: ['.footer-popcategories > .pz-expandable__header.js-pz-expandable-header']

<header class="pz-expandable__header js-pz-expandable-header">
          <h3 class="title">Popüler Kategoriler</h3>
          
        </header>

SELECTOR: ['.mobile-nav__header']

<header class="mobile-nav__header">

SELECTOR: ['pz-expandable[title="Kurumsal"] > .pz-expandable__header.js-pz-expandable-hea…

<header class="pz-expandable__header js-pz-expandable-header">
          <h3 class="title">Kurumsal</h3>
          
        </header>

SELECTOR: ['pz-expandable[title="Yardım"] > .pz-expandable__header.js-pz-expandable-heade…

<header class="pz-expandable__header js-pz-expandable-header">
          <h3 class="title">Yardım</h3>
          
        </header>

2. WHAT DOES THIS MEAN?

Banner landmark should not be contained in another landmark

3. HOW TO SOLVE IT:

How to Fix It

Banner landmark should not be contained in another landmark

Learn More

Ensure the contentinfo landmark is at top level

1 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['.mobile-nav__footer']

<footer class="mobile-nav__footer">

2. WHAT DOES THIS MEAN?

Contentinfo landmark should not be contained in another landmark

3. HOW TO SOLVE IT:

How to Fix It

Contentinfo landmark should not be contained in another landmark

Learn More

Ensure the document has at most one banner landmark

1 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['.header']

<header class="header">

2. WHAT DOES THIS MEAN?

Document should not have more than one banner landmark

3. HOW TO SOLVE IT:

How to Fix It

Document should not have more than one banner landmark

Learn More

Ensure the document has at most one contentinfo landmark

1 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['.mobile-nav__footer']

<footer class="mobile-nav__footer">

2. WHAT DOES THIS MEAN?

Document should not have more than one contentinfo landmark

3. HOW TO SOLVE IT:

How to Fix It

Document should not have more than one contentinfo landmark

Learn More

Ensure the document has a main landmark

1 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['html']

<html lang="tr">

2. WHAT DOES THIS MEAN?

Document should have one main landmark

3. HOW TO SOLVE IT:

How to Fix It

Document should have one main landmark

Learn More

Ensure landmarks are unique

3 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (3):

SELECTOR: ['#splide02']

<div class="pz-carousel__container splide splide--slide splide--ttb splide--draggable is-active is-initialized" id="splide02" role="region" aria-roledescription="carousel">

SELECTOR: ['.header']

<header class="header">

SELECTOR: ['.mobile-nav__footer']

<footer class="mobile-nav__footer">

2. WHAT DOES THIS MEAN?

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

3. HOW TO SOLVE IT:

How to Fix It

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

Learn More

Ensure that the page, or at least one of its frames contains a level-one heading

1 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (1):

SELECTOR: ['html']

<html lang="tr">

2. WHAT DOES THIS MEAN?

Page should contain a level-one heading

3. HOW TO SOLVE IT:

How to Fix It

Page should contain a level-one heading

Learn More

Ensure all page content is contained by landmarks

8 elements

moderate

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (8):

SELECTOR: [['efilli-layout-dynamic', '#f6e0d300-4e98-4157-879b-62eb088ae335']]

<div class="flex flex-col gap-16..." efl-category-essenti...="" efl-category-functio...="" efl-category-marketi...="" efl-category-other-o...="" efl-consent-not-save...="" data-id="f6e0d300-4e98-4157-8..." data-name="Button Container" id="f6e0d300-4e98-4157-8...">

SELECTOR: ['.quadruple-banners-left']

<div class="quadruple-banners-left">

SELECTOR: ['.stores__main-title']

<div class="stores__main-title">
  Mağazalarımız
</div>

SELECTOR: ['.stores__main-description']

<div class="stores__main-description">
  Aradığınız KOTON mağazasına ülke ve şehir bilgilerini seçerek ulaşabilirsiniz.
</div>

SELECTOR: ['.stores__form-wrapper > .stores__form-button']

<div class="stores__form-button">
      <pz-button size="3xl" type="button" class="stores__form-button js-stores-button -w-full pz-button -appearance-filled -size-3xl" w-full="">
      
      
      <span class="pz-button__text">Arama</span>
    </pz-button>
    </div>

SELECTOR: ['.modal-stock-alert > .pz-modal-dialog > .pz-modal-dialog__content']

<div class="pz-modal-dialog__content">
  <p>Ürün tekrar stoklarımıza geldiğinde, hesabındaki mail adresine talebin 
üzerine bilgilendirme yapacağız.<br><br><strong></strong></p>
</div>

SELECTOR: ['.modal-stock-alert > .pz-modal-dialog > .pz-modal-dialog__buttons']

<div class="pz-modal-dialog__buttons"><pz-button class="modal-button js-close-button pz-button -appearance-outlined -shadow -size-xl">
      
      
      <span class="pz-button__text">Kapat</span>
    </pz-button></div>

SELECTOR: [['efilli-layout-dynamic', '#fce14899-a504-4006-9b83-a82d9aa97bb2']]

<div class="mb-32px" efl-category-essential-on="" efl-category-functional-off="" efl-category-marketing-off="" efl-category-other-off="" efl-consent-not-saved="" data-id="fce14899-a504-4006-9b83-a82d9aa97bb2" data-name="Title" id="fce14899-a504-4006-9b83-a82d9aa97bb2">

2. WHAT DOES THIS MEAN?

All page content should be contained by landmarks

3. HOW TO SOLVE IT:

How to Fix It

All page content should be contained by landmarks

Use Landmark Regions: All page content should be contained within landmark regions like <header>, <main>, <nav>, <footer>, or elements with role attributes.

Correct Markup Solutions:

Code example

1 <header>Site header content</header>
2 <nav>Navigation links</nav>
3 <main>
4   <article>Main content</article>
5   <aside>Sidebar content</aside>
6 </main>
7 <footer>Site footer content</footer>

Incorrect Markup Solutions:

Code example

1 <!-- Incorrect: Content outside landmarks -->
2 <div class="header">Header</div>
3 <div class="content">Content</div>
4 <div class="footer">Footer</div>

Learn More

Ensure role attribute has an appropriate value for the element

2 elements

minor

WCAG Best Practice

1. FAILING ELEMENTS ON YOUR WEBSITE (2):

SELECTOR: ['#splide02-slide01']

<li class="pz-carousel__slide splide__slide is-active is-visible" id="splide02-slide01" role="group" aria-roledescription="slide" aria-label="1 of 1" style="margin-bottom: 0rem; height: calc(100% + 0rem);">

SELECTOR: ['#splide01-slide01']

<li class="pz-carousel__slide splide__slide is-active is-visible" id="splide01-slide01" role="tabpanel" aria-roledescription="slide" aria-label="1 of 6" style="margin-right: 0rem; width: calc(100% + 0rem); transform: translateX(0%);">

2. WHAT DOES THIS MEAN?

ARIA role should be appropriate for the element

3. HOW TO SOLVE IT:

How to Fix It

ARIA role should be appropriate for the element

Learn More

PASS

Ensure an element's role supports its ARIA attributes

aria-allowed-attr

PASS

Ensure role attribute has an appropriate value for the element

aria-allowed-role

PASS

Ensure ARIA attributes are used as described in the specification of the element's role

aria-conditional-attr

PASS

Ensure elements do not use deprecated roles

aria-deprecated-role

PASS

Ensure aria-hidden="true" is not present on the document body.

aria-hidden-body

PASS

Ensure aria-hidden elements are not focusable nor contain focusable elements

aria-hidden-focus

PASS

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

aria-prohibited-attr

PASS

Ensure elements with ARIA roles have all required ARIA attributes

aria-required-attr

PASS

Ensure elements with an ARIA role that require child roles contain them

aria-required-children

PASS

Ensure elements with an ARIA role that require parent roles are contained by them

aria-required-parent

PASS

Ensure all elements with a role attribute use a valid value

aria-roles

PASS

Ensure all ARIA attributes have valid values

aria-valid-attr-value

PASS

Ensure attributes that begin with aria- are valid ARIA attributes

aria-valid-attr

PASS

Ensure the autocomplete attribute is correct and suitable for the form field

autocomplete-valid

PASS

Ensure that text spacing set through style attributes can be adjusted with custom stylesheets

avoid-inline-spacing

PASS

Ensure buttons have discernible text

button-name

PASS

Ensure each page has at least one mechanism for a user to bypass navigation and jump straight to the content

bypass

PASS

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

color-contrast

PASS

Ensure each HTML document contains a non-empty <title> element

document-title

PASS

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

duplicate-id-aria

PASS

Ensure headings have discernible text

empty-heading

PASS

Ensure form field does not have multiple label elements

form-field-multiple-labels

PASS

Ensure the order of headings is semantically correct

heading-order

PASS

Ensure every HTML document has a lang attribute

html-has-lang

PASS

Ensure the lang attribute of the <html> element has a valid value

html-lang-valid

PASS

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

image-alt

PASS

Ensure image alternative is not repeated as text

image-redundant-alt

PASS

Ensure that every form element has a visible label and is not solely labeled using hidden labels, or the title or aria-describedby attributes

label-title-only

PASS

Ensure every form element has a label

label

PASS

Ensure the banner landmark is at top level

landmark-banner-is-top-level

PASS

Ensure the contentinfo landmark is at top level

landmark-contentinfo-is-top-level

PASS

Ensure landmarks are unique

landmark-unique

PASS

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

link-in-text-block

PASS

Ensure links have discernible text

link-name

PASS

Ensure that lists are structured correctly

list

PASS

Ensure <li> elements are used semantically

listitem

PASS

Ensure <meta name="viewport"> can scale a significant amount

meta-viewport-large

PASS

Ensure <meta name="viewport"> does not disable text scaling and zooming

meta-viewport

PASS

Ensure interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies

nested-interactive

PASS

Ensure elements marked as presentational do not have global ARIA or tabindex so that all screen readers ignore them

presentation-role-conflict

PASS

Ensure all page content is contained by landmarks

region

PASS

Ensure elements that have scrollable content are accessible by keyboard

scrollable-region-focusable

PASS

Ensure tabindex attribute values are not greater than 0

tabindex

REVIEW

Ensure role attribute has an appropriate value for the element

aria-allowed-role | 5 element(s) require manual review

REVIEW

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

color-contrast | 12 element(s) require manual review

REVIEW

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

link-in-text-block | 1 element(s) require manual review

N/A

Ensure every accesskey attribute value is unique

accesskeys

N/A

Ensure <area> elements of image maps have alternative text

area-alt

N/A

Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalent

aria-braille-equivalent

N/A

Ensure every ARIA button, link and menuitem has an accessible name

aria-command-name

N/A

Ensure every ARIA dialog and alertdialog node has an accessible name

aria-dialog-name

N/A

Ensure every ARIA input field has an accessible name

aria-input-field-name

N/A

Ensure every ARIA meter node has an accessible name

aria-meter-name

N/A

Ensure every ARIA progressbar node has an accessible name

aria-progressbar-name

N/A

Ensure role="text" is used on elements with no focusable descendants

aria-text

N/A

Ensure every ARIA toggle field has an accessible name

aria-toggle-field-name

N/A

Ensure every ARIA tooltip node has an accessible name

aria-tooltip-name

N/A

Ensure every ARIA treeitem node has an accessible name

aria-treeitem-name

N/A

Ensure <blink> elements are not used

blink

N/A

Ensure <dl> elements are structured correctly

definition-list

N/A

Ensure <dt> and <dd> elements are contained by a <dl>

dlitem

N/A

Ensure table headers have discernible text

empty-table-header

N/A

Ensure <frame> and <iframe> elements with focusable content do not have tabindex=-1

frame-focusable-content

N/A

Ensure <iframe> and <frame> elements contain the axe-core script

frame-tested

N/A

Ensure <iframe> and <frame> elements contain a unique title attribute

frame-title-unique

N/A

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

frame-title

N/A

Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page

html-xml-lang-mismatch

N/A

Ensure input buttons have discernible text

input-button-name

N/A

Ensure <input type="image"> elements have alternative text

input-image-alt

N/A

Ensure the complementary landmark or aside is at top level

landmark-complementary-is-top-level

N/A

Ensure the main landmark is at top level

landmark-main-is-top-level

N/A

Ensure the document has at most one main landmark

landmark-no-duplicate-main

N/A

Ensure <marquee> elements are not used

marquee

N/A

Ensure <meta http-equiv="refresh"> is not used for delayed refresh

meta-refresh

N/A

Ensure <object> elements have alternative text

object-alt

N/A

Ensure [role="img"] elements have alternative text

role-img-alt

N/A

Ensure the scope attribute is used correctly on tables

scope-attr-valid

N/A

Ensure select element has an accessible name

select-name

N/A

Ensure that server-side image maps are not used

server-side-image-map

N/A

Ensure all skip links have a focusable target

skip-link

N/A

Ensure summary elements have discernible text

summary-name

N/A

Ensure <svg> elements with an img, graphics-document or graphics-symbol role have accessible text

svg-img-alt

N/A

Ensure the <caption> element does not contain the same text as the summary attribute

table-duplicate-name

N/A

Ensure that each cell in a table that uses the headers attribute refers only to other <th> elements in that table

td-headers-attr

N/A

Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describe

th-has-data-cells

N/A

Ensure lang attributes have valid values

valid-lang

N/A

Ensure <video> elements have captions

video-caption

N/A

Ensure <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audio

no-autoplay-audio