Guideline
Every textbox, file input, slider, checkbox, radio button, dropdownlist and listbox should have a label that is associated with it using the HTML label element. Conversely, do not create a label element that is not associated with one of the above input elements; for example, do not associate a label element with a button, as the button text itself serves as the label.
If it is neither practical nor necessary to include a label for sighted users (for example, due to screen space concerns), you can include a title attribute (tooltip) on the input control.
Also, groups of checkboxes or radio buttons that have the same name should be grouped under an HTML fieldset element with a legend element.
WCAG References
Refer to the following topics for more information:
H44: Using label elements to associate text labels with form controls (http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H44.html)
H65: Using the title attribute to identify form controls when the label element cannot be used (http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H65.html)
H71: Providing a description for groups of form controls using fieldset and legend elements (http://www.w3.org/TR/2008/NOTE-WCAG20-TECHS-20081211/H71.html)
ePortal Recommendations
Editing Client Messages to Generate Labels
If you set the ControlStyle property for a particular field in a client message to any of the following, then ePortal can be configured to use the Label property to generate an associated HTML label element; the content of the label element matches the value of the Label property from the client message.
CheckBox
ComboBox
DropDownList
ListBox
TextBox
Slider
HybridBarcodeReader
HybridContactAddress
HybridContactEmail
HybridContactPhone
Custom
In this case, set Label to a meaningful label for the input control.
Notes:
The ControlStyle settings Custom and Slider only apply to MVC applications; they are rendered like a simple TextBox for other web applications. Refer to Controlling the Look and Feel in All Data Source Projects for more information.
If you set the ControlStyle for a particular field to Custom, then you can edit the AdditionalMetadata property to specify further customization. If you do not want an associated label for your custom control, add an additional metadata value with a MetaName of GenAssociatedLabel and a MetaValue of false.
Refer to Creating and Modifying Client Messages for more information.
Editing Client Messages to Generate Fieldsets with Legends
If you set the ControlStyle property for a particular field in a client message to any of the following, then ePortal can be configured to use the Label property to generate an HTML fieldset element containing a legend element; the content of the legend element matches the value of the Label property from the client message.
CheckBoxList
RadioButtonList
In this case, set Label to meaningful legend text for the fieldset. In addition, edit the ListItems property and set the Text for each item to a meaningful label for the corresponding individual checkbox or radio button.
Refer to Creating and Modifying Client Messages for more information.
Editing Client Messages to Generate Titles (tooltips)
ClearPath ePortal uses the value of the Description property to generate an HTML title attribute. Most browsers use the title attribute as a tooltip when you hover the mouse over the element. In addition, accessibility technologies (such as screen readers) can use the title when no associated label is available.
Scaffolding MVC Applications to Generate Labels
To comply with accessibility guidelines, do not select the option Preserve Screen Layouts and Styles when you scaffold the views for an MVC application. When you select this option, ePortal does not generate associated labels; instead, the application relies on static text from the original application to provide the label text. These static text labels do not comply with accessibility guidelines.
Refer to Scaffold Unisys Controller for ePortal Data Source with Views Dialog for more information.
Configuring Web Forms Applications to Generate Labels and Fieldsets
To comply with accessibility guidelines, configure presentation generation options for a Web Forms application as follows:
Set IncludePainterStaticText to false (applies to the AB Suite/EAE data source only).
Edit the control templates as follows:
Set the ControlNamespace for each control template to ePortal, where possible.
For RadioButtonList and CheckBoxList, set LabelLocation to Group. In this case, ePortal will generate an HTML fieldset element with a legend element.
For all other templates with LabelLocation, set to Front. In this case, ePortal will generate an HTML label element.
Refer to the following topics for more information: