Ask Question

ID:
ask-question
Automated score:
88.9
URL:
https://stackoverflow.com/questions/ask
View JSON file

13 violations: Light: 3Dark: 4HC Light: 3HC Dark: 3

Ensure every form element has a label. Form elements must have labels. Help URL

HTML

<input id="post-title-input" aria-describedby="post-title-input-description" aria-invalid="false" class="s-input bc-transparent bs-none p0 h100 fl-grow1 w-auto py4" type="text" placeholder="" required="" label="Title" maxlength="300" autocomplete="off" autofocus="" data-min-length="15" data-max-length="150">

Target

#post-title-input

Summary

Fix any of the following:

  • 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 has an empty placeholder attribute
  • Element's default semantics were not overridden with role="none" or role="presentation"

Ensure every form element has a label. Form elements must have labels. Help URL

HTML

<input id="post-title-input" aria-describedby="post-title-input-description" aria-invalid="false" class="s-input bc-transparent bs-none p0 h100 fl-grow1 w-auto py4" type="text" placeholder="" required="" label="Title" maxlength="300" autocomplete="off" autofocus="" data-min-length="15" data-max-length="150">

Target

#post-title-input

Summary

Fix any of the following:

  • 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 has an empty placeholder attribute
  • Element's default semantics were not overridden with role="none" or role="presentation"

Ensure every form element has a label. Form elements must have labels. Help URL

HTML

<input id="post-title-input" aria-describedby="post-title-input-description" aria-invalid="false" class="s-input bc-transparent bs-none p0 h100 fl-grow1 w-auto py4" type="text" placeholder="" required="" label="Title" maxlength="300" autocomplete="off" autofocus="" data-min-length="15" data-max-length="150">

Target

#post-title-input

Summary

Fix any of the following:

  • 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 has an empty placeholder attribute
  • Element's default semantics were not overridden with role="none" or role="presentation"

Ensure every form element has a label. Form elements must have labels. Help URL

HTML

<input id="post-title-input" aria-describedby="post-title-input-description" aria-invalid="false" class="s-input bc-transparent bs-none p0 h100 fl-grow1 w-auto py4" type="text" placeholder="" required="" label="Title" maxlength="300" autocomplete="off" autofocus="" data-min-length="15" data-max-length="150">

Target

#post-title-input

Summary

Fix any of the following:

  • 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 has an empty placeholder attribute
  • Element's default semantics were not overridden with role="none" or role="presentation"

Ensure every ARIA input field has an accessible name. ARIA input fields must have an accessible name. Help URL

HTML

<div class="fl-grow1 outline-none p12 pt6 w100 s-prose js-editor ProseMirror" role="textbox" aria-multiline="true" contenteditable="true" translate="no"><p><br class="ProseMirror-trailingBreak"></p></div>

Target

.outline-none

Summary

Fix any of the following:

  • 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

Ensure every ARIA input field has an accessible name. ARIA input fields must have an accessible name. Help URL

HTML

<div class="fl-grow1 outline-none p12 pt6 w100 s-prose js-editor ProseMirror" role="textbox" aria-multiline="true" contenteditable="true" translate="no"><p><br class="ProseMirror-trailingBreak"></p></div>

Target

.outline-none

Summary

Fix any of the following:

  • 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

Ensure every ARIA input field has an accessible name. ARIA input fields must have an accessible name. Help URL

HTML

<div class="fl-grow1 outline-none p12 pt6 w100 s-prose js-editor ProseMirror" role="textbox" aria-multiline="true" contenteditable="true" translate="no"><p><br class="ProseMirror-trailingBreak"></p></div>

Target

.outline-none

Summary

Fix any of the following:

  • 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

Ensure every ARIA input field has an accessible name. ARIA input fields must have an accessible name. Help URL

HTML

<div class="fl-grow1 outline-none p12 pt6 w100 s-prose js-editor ProseMirror" role="textbox" aria-multiline="true" contenteditable="true" translate="no"><p><br class="ProseMirror-trailingBreak"></p></div>

Target

.outline-none

Summary

Fix any of the following:

  • 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

link-in-text-block

Ensure links are distinguished from surrounding text in a way that does not rely on color. Links must be distinguishable without relying on color. Help URL

HTML

<a target="_blank" href="https://stackoverflow.az1.qualtrics.com/jfe/form/SV_0ukaKXryz4gGW6W">providing feedback or reporting a bug</a>

Target

span > a[target="_blank"]

Summary

Fix any of the following:

  • The link has insufficient color contrast of 1.75:1 with the surrounding text. (Minimum contrast is 3:1, link text: #90c4f9, surrounding text: #f9fafa)
  • The link has no styling (such as underline) to distinguish it from the surrounding text

Ensure links have discernible text. Links must have discernible text. Help URL

HTML

<a href="#" class="s-topbar--menu-btn js-left-sidebar-toggle" aria-haspopup="true" aria-controls="left-sidebar" aria-expanded="false"><span></span></a>

Target

.s-topbar--menu-btn

Summary

Fix all of the following:

  • Element is in tab order and does not have accessible text
  • Fix any of the following:
  • 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

Ensure links have discernible text. Links must have discernible text. Help URL

HTML

<a href="#" class="s-topbar--menu-btn js-left-sidebar-toggle" aria-haspopup="true" aria-controls="left-sidebar" aria-expanded="false"><span></span></a>

Target

.s-topbar--menu-btn

Summary

Fix all of the following:

  • Element is in tab order and does not have accessible text
  • Fix any of the following:
  • 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

Ensure links have discernible text. Links must have discernible text. Help URL

HTML

<a href="#" class="s-topbar--menu-btn js-left-sidebar-toggle" aria-haspopup="true" aria-controls="left-sidebar" aria-expanded="false"><span></span></a>

Target

.s-topbar--menu-btn

Summary

Fix all of the following:

  • Element is in tab order and does not have accessible text
  • Fix any of the following:
  • 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

Ensure links have discernible text. Links must have discernible text. Help URL

HTML

<a href="#" class="s-topbar--menu-btn js-left-sidebar-toggle" aria-haspopup="true" aria-controls="left-sidebar" aria-expanded="false"><span></span></a>

Target

.s-topbar--menu-btn

Summary

Fix all of the following:

  • Element is in tab order and does not have accessible text
  • Fix any of the following:
  • 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