Accessibility Report for "default"

Run on: http://mediawiki-web:8080/wiki/Test?useskin=vector-2022

Generated at: Mon Oct 28 2024 12:46:01 GMT+0000 (Coordinated Universal Time)

Overview of changes

✅ No change

All issues found

Errors (3)

This form does not contain a submit button, which creates issues for those who cannot submit the form using the keyboard. Submit buttons are INPUT elements with type attribute "submit" or "image", or BUTTON elements with type "submit" or omitted/invalid.

Rule: htmlcs, WCAG2AA.Principle3.Guideline3_2.3_2_2.H32.2

2 issue(s): 
  • #skin-client-prefs-vector-feature-custom-font-size > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>
  • #skin-client-prefs-vector-feature-limited-width > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>

Elements must only use permitted ARIA attributes (https://dequeuniversity.com/rules/axe/4.8/aria-prohibited-attr?application=axeAPI)

Rule: axe, aria-prohibited-attr

Impact: serious

1 issue(s): 
  • #bodyContent
    <div id="bodyContent" class="vector-body ve-init-mw-desktopArticleTarget-targetContainer" aria-labelledby="firstHeading" data-mw-ve-target-container="">
					<div class="vector-body-b...</div>

Warnings (6)

The heading structure is not logically nested. This h2 element appears to be the primary document heading, so should be an h1 element.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_3.1_3_1_A.G141

2 issue(s): 
  • #vector-toc > div > h2
    <h2 class="vector-pinnable-header-label">Contents</h2>
  • #vector-toc > div > h2
    <h2 class="vector-pinnable-header-label">Contents</h2>

If these radio buttons or check boxes require a further group-level description, they should be contained within a fieldset element.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_3.1_3_1.H71.SameName

2 issue(s): 
  • #skin-client-prefs-vector-feature-custom-font-size > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>
  • #skin-client-prefs-vector-feature-limited-width > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>

Img element is marked so that it is ignored by Assistive Technology.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_1.1_1_1.H67.2

1 issue(s): 
  • html > body > div:nth-child(2) > header > div:nth-child(1) > a > span > img:nth-child(2)
    <img class="mw-logo-tagline" alt="" src="https://en.wikipedia.org/static/images/mobile/copyright/wikipedia-tagline-en.svg" width="117" height="13" style="width: 7.3125em; height: 0.8125em;">

This element has "position: fixed". This may require scrolling in two dimensions, which is considered a failure of this Success Criterion.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_4.1_4_10.C32,C31,C33,C38,SCR34,G206

1 issue(s): 
  • #p-dock-bottom
    <div class="vector-settings" id="p-dock-bottom">
	<ul></ul>
</div>

Notices (7)

ARIA role should be appropriate for the element (https://dequeuniversity.com/rules/axe/4.8/aria-allowed-role?application=axeAPI)

Rule: axe, aria-allowed-role

Impact: minor

7 issue(s): 
  • #vector-main-menu-dropdown-checkbox
    <input type="checkbox" id="vector-main-menu-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-main-menu-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Main menu">
  • #p-lang-btn-checkbox
    <input type="checkbox" id="p-lang-btn-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-p-lang-btn" class="vector-dropdown-checkbox mw-interlanguage-selector webfonts-changed" aria-label="This article exist only in this langua...
  • #vector-variants-dropdown-checkbox
    <input type="checkbox" id="vector-variants-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-variants-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Change language variant">
  • #vector-page-tools-dropdown-checkbox
    <input type="checkbox" id="vector-page-tools-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-tools-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Tools">
  • #vector-appearance-dropdown-checkbox
    <input type="checkbox" id="vector-appearance-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-appearance-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Appearance">
  • #vector-user-links-dropdown-checkbox
    <input type="checkbox" id="vector-user-links-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-user-links-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Personal tools">
  • #vector-page-titlebar-toc-checkbox
    <input type="checkbox" id="vector-page-titlebar-toc-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-titlebar-toc" class="vector-dropdown-checkbox webfonts-changed" aria-label="Toggle the table of contents">

Errors (3)

This form does not contain a submit button, which creates issues for those who cannot submit the form using the keyboard. Submit buttons are INPUT elements with type attribute "submit" or "image", or BUTTON elements with type "submit" or omitted/invalid.

Rule: htmlcs, WCAG2AA.Principle3.Guideline3_2.3_2_2.H32.2

2 issue(s): 
  • #skin-client-prefs-vector-feature-custom-font-size > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>
  • #skin-client-prefs-vector-feature-limited-width > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>

Elements must only use permitted ARIA attributes (https://dequeuniversity.com/rules/axe/4.8/aria-prohibited-attr?application=axeAPI)

Rule: axe, aria-prohibited-attr

Impact: serious

1 issue(s): 
  • #bodyContent
    <div id="bodyContent" class="vector-body ve-init-mw-desktopArticleTarget-targetContainer" aria-labelledby="firstHeading" data-mw-ve-target-container="">
					<div class="vector-body-b...</div>

Warnings (6)

The heading structure is not logically nested. This h2 element appears to be the primary document heading, so should be an h1 element.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_3.1_3_1_A.G141

2 issue(s): 
  • #vector-toc > div > h2
    <h2 class="vector-pinnable-header-label">Contents</h2>
  • #vector-toc > div > h2
    <h2 class="vector-pinnable-header-label">Contents</h2>

If these radio buttons or check boxes require a further group-level description, they should be contained within a fieldset element.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_3.1_3_1.H71.SameName

2 issue(s): 
  • #skin-client-prefs-vector-feature-custom-font-size > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>
  • #skin-client-prefs-vector-feature-limited-width > div:nth-child(2) > ul > li > div > form
    <form><div class="cdx-radio"><input n...</form>

Img element is marked so that it is ignored by Assistive Technology.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_1.1_1_1.H67.2

1 issue(s): 
  • html > body > div:nth-child(2) > header > div:nth-child(1) > a > span > img:nth-child(2)
    <img class="mw-logo-tagline" alt="" src="https://en.wikipedia.org/static/images/mobile/copyright/wikipedia-tagline-en.svg" width="117" height="13" style="width: 7.3125em; height: 0.8125em;">

This element has "position: fixed". This may require scrolling in two dimensions, which is considered a failure of this Success Criterion.

Rule: htmlcs, WCAG2AA.Principle1.Guideline1_4.1_4_10.C32,C31,C33,C38,SCR34,G206

1 issue(s): 
  • #p-dock-bottom
    <div class="vector-settings" id="p-dock-bottom">
	<ul></ul>
</div>

Notices (7)

ARIA role should be appropriate for the element (https://dequeuniversity.com/rules/axe/4.8/aria-allowed-role?application=axeAPI)

Rule: axe, aria-allowed-role

Impact: minor

7 issue(s): 
  • #vector-main-menu-dropdown-checkbox
    <input type="checkbox" id="vector-main-menu-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-main-menu-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Main menu">
  • #vector-user-links-dropdown-checkbox
    <input type="checkbox" id="vector-user-links-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-user-links-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Personal tools">
  • #p-lang-btn-checkbox
    <input type="checkbox" id="p-lang-btn-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-p-lang-btn" class="vector-dropdown-checkbox mw-interlanguage-selector webfonts-changed" aria-label="This article exist only in this langua...
  • #vector-variants-dropdown-checkbox
    <input type="checkbox" id="vector-variants-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-variants-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Change language variant">
  • #vector-page-tools-dropdown-checkbox
    <input type="checkbox" id="vector-page-tools-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-tools-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Tools">
  • #vector-appearance-dropdown-checkbox
    <input type="checkbox" id="vector-appearance-dropdown-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-appearance-dropdown" class="vector-dropdown-checkbox webfonts-changed" aria-label="Appearance">
  • #vector-page-titlebar-toc-checkbox
    <input type="checkbox" id="vector-page-titlebar-toc-checkbox" role="button" aria-haspopup="true" data-event-name="ui.dropdown-vector-page-titlebar-toc" class="vector-dropdown-checkbox webfonts-changed" aria-label="Toggle the table of contents">