Opened 12 years ago

Last modified 8 years ago

#8716 confirmed Bug

Better indication of required fields

Reported by: Satya Minnekanti Owned by:
Priority: Normal Milestone:
Component: Accessibility Version: 3.0
Keywords: IBM Discussion Cc: Damian, Teresa Monahan

Description

Labels for all required fields on our dialogs should have an astrisk(*) and instructions for identifying required fields should be clearly labeled at the beginning of the form.

This is a failure of Accessibility Checkpoint 1.3.1

This is clearly documented in Examples of Success Criterion for 1.3.1

See links here.. http://www.w3.org/TR/2012/NOTE-UNDERSTANDING-WCAG20-20120103/content-structure-separation-programmatic.html

http://www.w3.org/TR/WCAG20-TECHS/H44.html

Attachments (1)

RequiredField.jpg (17.6 KB) - added by Teresa Monahan 11 years ago.

Download all attachments as: .zip

Change History (10)

comment:1 Changed 12 years ago by Jakub Ś

Component: GeneralAccessibility
Keywords: Accessibility removed
Status: newconfirmed
Version: 3.0

comment:2 Changed 11 years ago by Mike Gifford

Where are the required fields in CKEditor? Again, looking to see if this is still an issue in the 4.x version.

comment:3 Changed 11 years ago by Teresa Monahan

Examples of required fields are:

  • The URL field on link, image, iframe, flash dialog
  • Rows/Columns fields on table dialog
  • Name field on anchor dialog

This is still an issue in 4.x

comment:4 Changed 11 years ago by Frederico Caldeira Knabben

Keywords: Discussion added

We have two solutions for this already in place:

  • aria-required is applied to required fields, so they're actively identified as required.
  • Labels are marked with the "cke_required" class, so they can be styled to have any kind of visual representation.

It looks like we have already all the necessary tools to properly satisfy the accessibility requirements for our target environments.

comment:5 Changed 11 years ago by Mike Gifford

So, should this get closed for now? Is there an audit process?

comment:6 Changed 11 years ago by Jakub Ś

So, should this get closed for now?

Definitely not because problem hasn’t been fixed yet. Keyword Discussion is used to ask CKSource devs and users interested in this feature opinion. You may for example have better idea or see potential bug in @fredck proposal.

comment:7 Changed 11 years ago by Teresa Monahan

The aria-required attribute is sufficient for this for screen reader users. However the cke_required field does not address the full issue for sighted users. This class means styling can be used to identify required fields, however styles such as colors, background images etc will not be visible in High Contrast mode. Required fields should be denoted in some way e.g. adding an asterisk to the field label.

In addition, the dialogs should contain some descriptive text explaining that the asterisk (and any styling used to indicate required fields) means that the field is required. See an example in the attached image.

The solution for this needs to be flexible enough to adapt to different UI requirements e.g. providing config options for specifying how to denote required fields i.e. use a * or the word required etc, adding the marker at the start/end of the label, styling for descriptive text etc

Changed 11 years ago by Teresa Monahan

Attachment: RequiredField.jpg added

comment:8 Changed 8 years ago by Marek Lewandowski

Summary: Label for Required fields should have an asterisk( *) & instructions for identifying required fields is clearly labeled at beginning of the formLabel for Required fields should have an asterisk (*) & instructions for identifying required fields is clearly labeled at beginning of the form

comment:9 Changed 8 years ago by Marek Lewandowski

Summary: Label for Required fields should have an asterisk (*) & instructions for identifying required fields is clearly labeled at beginning of the formBetter indication of required fields
Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy