[Help] merge help for two rules being combined

[philljenkins]

Because we are merging input_placeholder_label_visible into the input_label_visible rule, the Help files need to be merged

The Help changes are related to the following rule changes:

#1625 Revisit: input_placeholder_label_visible
#1623 Revisit: input_label_visible

These rules map to the Requirements for 3.3.2 Labels or Instructions

• Goal: Users know what information to enter.
• What to do: Provide labels or instructions for inputs.
• Why it's important: Everyone, blind, sighted, and especially those with cognitive disabilities, will know how to respond.

See discussion note in Box

• Revist the rule "input_label_visible"

[philljenkins]

Existing Help files being merged:

• input_placeholder_label_visible - being removed
• input_label_visible

[philljenkins]

New merged help:

Why is this important?

Visible labels are essential, so every user can know what information to enter:

• People with cognitive, language, and learning disabilities, older adults, and all users will easily learn what information is expected.
• People using voice control will see what to speak. This allows them to easily jump to interactive elements and form fields.

Placeholder labels when used as the only visible label can reduce the accessibility for a wide range of users. Avoid placeholder labels for the following reasons:

• May not be persistent: the placeholder label disappears when the user starts typing in the input field
• Can be mistaken for a pre-filled value: this can be more of an issue in AI applications
• Hard to see: the text color commonly fails a minimum contrast ratio of 4.5 to 1
• May be too small: the lack of a label reduces the hit region for setting focus on the input field in touch devices

Examples:

<label for="test1">License Number:</label>
    <input type="text" id="test1" aria-label="Enter driver license number"/>
<label for="test2">First name:</label>
    <input type="text" id="test2"/>
<label>Email Address: 
    <input type="email" name="address1" placeholder="john@example.net">
</label>

What to do

The intent of labels, including expected formats and required fields, on interactive elements is not to clutter the page with unnecessary information but to provide important cues that will benefit all users. Too much information can be just as harmful as too little.

If there is already a visible label for the element, use an attribute on the label to reference the element's id

• Or, add a visible label with an attribute or coding construct associating it to the element

If using the placeholder attribute, ensure it is a short hint to aid the user with data entry,

• And, use a valid label method that is both visible and programmatically determined.

If a visible label cannot be added,

• Either, make a label or instructions available to users when the individual control has focus (both keyboard and pointer),
• Or, verify the input field and interactive element is understood within the context or instructions.

About this requirement

• IBM 3.3.2 Label or Instruction
• H44: Associate text labels with form controls
• ARIA1: Use aria-describedby to label a user interface control
• ARIA9: Use aria-labelledby to concatenate several text nodes
• W3C Placeholder Research

Who does this affect?

• People with cognitive, language, and learning disabilities
• People with dexterity impairments using voice control
• People with low vision using screen magnification
• People with vision impairments needing contrast enhancement
• People with tremors or other movement disorders using touch devices
• Many older adults

[philljenkins]

Help pushed into dev-1623
and ready for review of PR 1944

[philljenkins]

After help and rules changes, the rule is correctly display in the Rule Set listing

• and input_placeholder_label_visible has been removed and merged into input_label_visible