Accessibility Checklist

Guidance for how to make your interfaces accessible

Category	Rule Title	Applies To	Requirement	Dev Action	How To Test	Failure	Failure Type	User Impact	Related WCAG SC	Notes
All Inputs	Every enabled and disabled input must have a label parameter value	a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!styledTextEditorField, a!encryptedTextField, a!signatureField, a!barcodeField, a!recordsChatField, a!dropdownField, a!multipleDropdownField, a!radioButtonField, a!checkboxField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldUsersAndGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldDocumentsAndFolders, a!pickerFieldRecords, a!pickerFieldCustom, a!pickerField, a!sliderField	Set the label parameter on every input. The label must describe the input's purpose.	Set a label parameter value on every input component. Must not be null.	SAIL: label parameter must not be null. Screen Reader: TAB to input - label must be first thing announced. Tool: axe DevTools page scan (browser only, not Designer). Note that this test will not work for Appian text and paragraph fields.	Input has no label	Error	Critical	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Does not apply to links. Applies to buttons only in certain use cases.
All Inputs	Input label must be descriptive	a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!styledTextEditorField, a!encryptedTextField, a!signatureField, a!barcodeField, a!recordsChatField, a!dropdownField, a!multipleDropdownField, a!radioButtonField, a!checkboxField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldUsersAndGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldDocumentsAndFolders, a!pickerFieldRecords, a!pickerFieldCustom, a!pickerField, a!sliderField	Set the label parameter on every input so it indicates the purpose of the input or the type of input that is expected.	Set label on every input component to a value that indicates the purpose of the input.	SAIL: label parameter conveys the purpose of the input. Screen Reader: TAB to input - label must be descriptive and accurate.	Input label not descriptive	Warning - Needs Review	Needs Context	2.4.6 (AA) Headings and Labels 3.3.2 (A) Labels or Instructions	Applies to both visible and programmatic labels.
All Inputs	Don't rely on placeholder text for important info	a!textField,a!paragraphField, a!integerField, a!decimalField, a!styledTextEditorField, a!encryptedTextField, a!fileUploadField, a!barcodeField, a!chatField, a!dropdownField, a!multipleDropdownField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldUsersAndGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldDocumentsAndFolders, a!pickerField, a!pickerFieldRecords, a!pickerFieldCustom, a!pickerField	Placeholder text alone must not convey important information such as valid ranges and formats.	Put format hints and ranges in the instructions parameter or a visible label - not just placeholder.	Visual: Confirm important info is visible by means other than only the placeholder text.	Placeholder text is used to convey important information	Warning - Needs Review	High	3.3.2 (A) Labels or Instructions
All Inputs	Labels must be persistently visible	a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!styledTextEditorField, a!encryptedTextField, a!signatureField, a!barcodeField, a!recordsChatField, a!dropdownField, a!multipleDropdownField, a!radioButtonField, a!checkboxField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldUsersAndGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldDocumentsAndFolders, a!pickerFieldRecords, a!pickerFieldCustom, a!pickerField, a!sliderField	Every input must have a label that stays visible at all times. Placeholder text or a currently selected value does not meet this requirement.	Use label + set the labelPosition parameter to anything other than COLLAPSED. OR Use rich text set to the same value as the input label and use a labelPosition parameter of COLLAPSED.	Visual: Confirm the label is visible when the input has and does not have a value.	Input has no persistently-visible label	Error	High	2.4.6 (AA) Headings and Labels 3.3.2 (A) labels or Instructions	This requirement is always met when a label parameter value is provided for the input and a labelPosition of any value other than COLLAPSED is used.
All Inputs	Accessible name must include visible label text	a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!styledTextEditorField, a!encryptedTextField, a!signatureField, a!barcodeField, a!recordsChatField, a!dropdownField, a!multipleDropdownField, a!radioButtonField, a!checkboxField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldUsersAndGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldDocumentsAndFolders, a!pickerFieldRecords, a!pickerFieldCustom, a!pickerField, a!sliderField	The accessible name (the input label parameter value) must contain at least the exact same text as the visible label.	When labelPosition is COLLAPSED, ensure the label parameter value contains at least the same exact text as the visible rich text label.	SAIL: label parameter contains the exact same string as the visible label. Screen Reader: TAB to input - announced name must include the exact visible label string.	Input label does not contain the visible label	Error	Medium	2.5.3 (A) Label in Name	The accessible name is the label parameter value set on the input. This is also known as the programmatic label. This requirement is always met when a label parameter value is provided for the input and a labelPosition of any value other than COLLAPSED is used.
All Inputs	Disambiguate duplicate controls	Repeated inputs, links, or buttons with identical labels (any a!textField, a!dropdownField, a!buttonWidget, a!richTextItem, etc. where the same label/text appears more than once on the same screen)	When multiple controls share the same visible name or label parameter value, provide additional context via accessibilityText, icon altText, or a labeled section/box layout. Does not apply to controls and inputs in grids.	Set accessibilityText or icon altText/caption to indicate what each duplicate relates to, OR wrap in a!sectionLayout/a!boxLayout with a label.	Screen Reader: TAB through duplicates - each must be distinguishable OR use Browse mode: Check for hidden context text immediately before/after each control or input.	Duplicate control/input names are present	Error	Medium to High based on context	1.3.1 (A) Info and Relationships 2.4.4 (A) Link Purpose (In Context) (links) 2.4.6 (AA) Headings and Labels 4.1.2 (A) Name, Role, Value	Because of a known bug, it is not recommended to set accessibility text on rich text links because the information is provided in only one navigation mode for screen reader users.
Checkbox	Checkbox: each option must have a choice label	a!checkboxField	Every individual checkbox must have a label via the choiceLabels parameter.	Set choiceLabels - no null values.	SAIL: choiceLabels parameter has a meaningful value. Screen Reader: TAB to each checkbox - must announce its label. DOM: <label for=...> must match input ID and must not be null.	Individual checkbox has no label	Error	Critical	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions 4.1.2 (A) Name, Role, Value	Use of a rich text label does not meet this requirement.
Checkbox	Checkbox group must have a group label	a!checkboxField	When a checkbox group has more than one option, the component must have a label parameter set.	Set label on a!checkboxField.	SAIL: label parameter has a value. Screen Reader: TAB to group - must announce the label and identify as "group" or "grouping".	Checkbox group has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Setting the label on a!checkboxField allows screen readers and other assistive technologies to identify the checkboxes as a "group" or "grouping". This information is announced when the first checkbox in the group receives keyboard focus via forward navigation and when the last checkbox in the group receives keyboard focus via backward navigation.
Checkbox	Checkbox group must have a descriptive group label	a!checkboxField	When a checkbox group has more than one option, the component must have a descriptive label parameter set.	Set a descriptive label on a!checkboxField.	SAIL: label parameter has a descriptive value. Screen Reader: TAB to group - must announce a descriptive label for the group.	Checkbox group has nondescript label	Warning - Needs Review	High to Critical based on context	2.4.6 (AA) Headings and Labels
Checkbox	Boolean Checkbox: option must have a choice label	a!booleanCheckboxField	Every boolean checkbox must have a label via the choiceLabel parameter.	Set the choiceLabel parameter - no null value.	SAIL: choiceLabel parameter has a value. Screen Reader: TAB to the checkbox - must announce its label. DOM: <label for=...> must match input ID and must not be null.	Boolean checkbox has no label	Error	Critical	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions 4.1.2 (A) Name, Role, Value
Radio Button	Radio button: each option must have a choice label	a!radioButtonField	Every individual radio button must have a label via the choiceLabels parameter.	Set the choiceLabels parameter - no null values.	SAIL: choiceLabels parameter has a value. Screen Reader: Up/Down arrows to each radio button - must announce its label. DOM: <label for=...> must match input ID and must not be null.	Individual radio button has no label	Error	Critical	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions 4.1.2 (A) Name, Role, Value
Radio Button	Radio button group must have a group label	a!radioButtonField	When a radio button group has more than one option, the component must have a label parameter set.	Set label on a!radioButtonField.	SAIL: label parameter has a value. Screen Reader: TAB to selected radio - must announce the label and identify as "group" or "grouping".	Checkbox group has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Setting the label on a!radioButtonField allows screen readers and other assistive technologies to identify the radio buttons as a "group" or "grouping".
Radio Button	Radio button group must have a descriptive group label	a!radioButtonField	When a radio button group has more than one option, the component must have a descriptive label parameter set.	Set a descriptive label on a!radioButtonField.	SAIL: label parameter has a descriptive value. Screen Reader: TAB to selected radio button - must announce a descriptive label for the group.	Checkbox group has nondescript label	Warning - Needs Review	High to Critical based on context	2.4.6 (AA) Headings and Labels
Text Field	Auto-complete for personal info fields	a!textField, a!encryptedTextField for personal data	Text fields accepting personal info of the person completing the form must set inputPurpose. "Name" is only for a single full-name field. Do not set inputPurpose on public/shared devices.	Set the appropriate inputPurpose parameter value on a!textField or a!encryptedTextField.	SAIL: inputPurpose parameter has an appropriate value based on the type of input requested. Keyboard: TAB to field - previously entered values should appear as suggestions. DOM: Confirm autocomplete attribute is set on <input type="text"> and the attribute value is appropriate for the input being requested.	No input purpose for personal data input	Warning - Needs Review	High	1.3.5 (AA) Identify Input Purpose	Some browsers will attempt to provide dropdown values by default, but without the input purpose being specifically defined, the browser may provide inaccurate information in the dropdown. Refer to the product documentation for available values for input purpose.
Toggle Field	Toggle: must have a choice label	a!toggleField	Every toggle must have a label via the choiceLabel parameter.	Set choiceLabel - no null values.	SAIL: choiceLabel parameter has a value. Screen Reader: TAB to toggle - must announce its label. DOM: Second value used for the aria-labeledby parameter must match the <label> ID and <label> must not be null.	Toggle has no label	Error	Critical	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions 4.1.2 (A) Name, Role, Value	Do not indicate the on/off state in the label value.
Required Fields	Required fields must be marked	All required inputs (a!textField, a!paragraphField, a!integerField, a!decimalField, a!timeField, a!dateField, a!encryptedTextField, a!dropdownField, a!multipleDropdownField, a!checkboxField, a!radioButtonField, a!booleanCheckboxField, a!toggleField, a!cardChoiceField, a!pickerFieldRecords, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerFieldDocuments, a!pickerFieldFolders, a!pickerFieldCustom, a!fileUploadField, a!signatureField, a!barcodeScannerField)	Inputs that are required must have the required parameter set to TRUE.	Set required: true on the input.	SAIL: required parameter is set to TRUE. Screen Reader: TAB to input - must announce "required". DOM: aria-required="true" on the input.	Input not indicated as being required	Error	High	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions 4.1.2 (A) Name, Role, Value	Do not use a rich text asterisk to indicate required fields.
Error Messages	Use OOTB validation for errors	All inputs with validation (a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!encryptedTextField, a!dropdownField, a!multipleDropdownField, a!checkboxField, a!radioButtonField, a!pickerFieldRecords, a!pickerFieldUser, a!pickerFieldGroups, a!pickerFieldDocuments, a!fileUploadField, a!signatureField, a!barcodeScannerField)	All error messaging must use Appian's built-in validation (applicable validations, validationGroup, validationMessage parameters). Don't build custom error displays or use the message banner for errors.	Use the standard validation parameters only.	Screen Reader: TAB to an invalid input - must announce the error message and "invalid entry". DOM: aria-describedby on input references the error message node.	Input not indicated as having an error	Error	Critical	1.3.1 (A) Info and Relationships 3.3.1 (A) Error Identification 3.3.3 (AA) Error Suggestion 4.1.2 (A) Name, Role, Value
Error Messages	Include input name in error messages	All inputs with validation (a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!encryptedTextField, a!dropdownField, a!multipleDropdownField, a!checkboxField, a!radioButtonField, a!pickerFieldRecords, a!pickerFieldUser, a!pickerFieldGroups, a!pickerFieldDocuments, a!fileUploadField, a!signatureField, a!barcodeScannerField)	Error messages must include the input's visible name, e.g., "First Name requires a value." Cannot be applied to character counter and integer field errors.	Follow the pattern: "[Input Name] requires a value." or "[Input Name] must be numeric."	Visual: Read each error message and confirm the visible input name is present.	Input name not used in error message	Error	Medium	3.3.1 (A) Error Identification
Input Instructions	Use instructions parameter for input instructions and hints	All inputs with visible hints (a!textField, a!paragraphField, a!integerField, a!decimalField, a!dateField, a!timeField, a!encryptedTextField, a!dropdownField, a!multipleDropdownField, a!checkboxField, a!radioButtonField, a!booleanCheckboxField, a!cardChoiceField, a!toggleField, a!pickerFieldUsers, a!pickerFieldGroups, a!pickerfieldDocuments, a!pickerFieldRecords, a!pickerFieldCustom, a!fileUploadField, a!signatureField)	Visible instructions (formats, ranges, etc.) must be set via the instructions parameter on the input - not placeholder text or free text placed nearby.	Set the instructions parameter.	SAIL: The instructions parameter is set to the instruction text. Screen Reader: TAB to input - instructions must be announced. DOM: aria-describedby references the instructions node.	Instructions not associated with input	Error	High	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions
Input Instructions	Instructions do not reference physical location or color	All instructions (text, buttons, links, icons, status indicators, charts, form inputs, message banners, accessibility text)	Don't identify elements by their physical location (e.g., "left", "right", "corner") or their color (e.g., "red button").	Refer to elements by their name (e.g., "Continue button"), reference a nearby semantic heading to identify location, or use generic terms. It is permissible to use "above", "before", "below", or "after".	Visual: Confirm instructions and cues do not identify elements using "left", "right", "corner", etc. or by color.	Elements referenced using sensory information	Warning - Needs Review	High	1.3.3 (A) Sensory Characteristics
Input Instructions	Required-field legend	Forms with required fields using asterisks	If required fields use an asterisk, a visible legend must appear before the first input, e.g., "Required fields are marked with an asterisk (*)".	Add legend text before the first input.	Visual: Confirm the legend is present at the top of the form.	Legend not provided for required inputs using an asterisk	Error	Medium	3.3.2 (A) Labels or Instructions
Input Instructions	Auto-populate previously entered data	Multi-step forms/workflows, wizards, milestones	Information a user already entered in an earlier step must be auto-populated or selectable - don't make them re-enter it.	Carry forward user-entered data across steps.	Visual: Walk through multi-step flows and confirm previously entered data carries forward.	Previously entered data not prepopulated or selectable	Error	Medium to High based on context	3.3.7 (A) Redundant Entry
Grid	Every grid needs a label	a!gridField, a!gridLayout	Set the label parameter on a!gridField. Can use labelPosition: COLLAPSED if a visible heading that summarizes the content precedes the grid. Do not use "grid" or "table" in the label text.	Set label on a!gridField.	SAIL: label parameter has a value. Screen Reader (Browse): Press T (Windows) or VO+Cmd+T (Mac) - must announce the label. DOM: aria-labelledby on <table> references the node that contains the label text.	Grid has no label	Error	Critical	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
Grid	Grid label must be descriptive	a!gridField, a!gridLayout	Set the label on the grid to a value that describes the purpose of or content in the grid. Do not use "grid" or "table" in the label text.	Set descriptive label on a!gridField.	SAIL: label parameter has a value that accurately describes the purpose of or content in the grid. Screen Reader (Browse): Press T (Windows) or VO+Cmd+T (Mac) - must announce a descriptive label. DOM: aria-labelledby on <table> references the node that contains the label text and the label makes sense based on the content in the grid.	Grid has incorrect label	Warning - Needs Review	High to Critical based on context	1.3.1 (A) Info and Relationships 2.4.6 (AA) Headings and Labels
Grid	Column headers are required	a!gridColumn	Every data column and column that contains form inputs must have header text via a label on a!gridColumn. Exception: columns with single or multiple self-describing controls (action menus, up/down links) typically output in the last (rightmost) grid column.	Set label on each a!gridColumn.	Visual: Check the top of each column for text. Screen Reader: Use table nav keys (Ctrl+Alt+Left/Right) - headers must be announced as cells in each row are navigated left and right. DOM: Each <th> in <thead> must have a value.	Grid column has no header cell	Warning - Needs Review	Critical	1.3.1 (A) Info and Relationships	For columns that contain inputs such as text fields, dropdowns, etc., the column header text provides the required programmatic label for the inputs in the column in the same way setting a label parameter on the individual input would.
Grid	Define grid row headers	a!gridField, a!gridLayout	Set the rowHeader parameter on the grid to the position of the cell that uniquely identifies each row and is not repeated in other rows. Caution on editable grids - in most cases the row header should not be set on a cell that contains an input (editable grids).	Set the rowHeader parameter to the numeric position of the identifying cell.	Screen Reader: Navigate cells to the right of the column header up/down (Ctrl+Alt+Up/Down) - row header value must be announced before the value in each cell. DOM: Row header cell uses scope="row".	Grid row header is not defined or is defined on incorrect cell	Warning - Needs Review	High	1.3.1 (A) Info and Relationships	Do not set the row header on cells that can contain the same value in more than one row.
Grid	No empty columns for spacing	a!gridColumn, a!gridLayoutHeaderCell	Don't use empty grid columns as spacers or placeholders for data that is not present.	Ensure every column has a label and valid value parameter. Remove empty columns that are used for spacing or as placeholders.	Screen Reader: Column count announced must match visible number of columns. DOM: Every <th> in the header row must contain text.	Empty grid column is used for spacing	Error	High	1.3.1 (A) Info and Relationships	Using empty columns for spacing conveys incorrect grid dimensions to non-sighted users. Screen readers inform users of how many rows and columns are contained in the grid when they are accessed.
Grid	Grid instructions	a!gridField, a!gridLayout	Use the grid's instructions parameter for any instruction text. Use "table" not "grid" in the wording if it must be used.	Set instructions on the grid. Use "table" not "grid" if the element must be referenced.	SAIL: Grid instructions parameter contains the visible instruction text. Screen Reader (Browse): Press T (Windows) or VO+Cmd+T (Mac) - instructions must be announced. DOM: aria-describedby on <table> references the instructions node.	Instructions are not associated with the grid	Error	High	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions	The need to use "table" in instruction text should be rare.
Grid	Warn users about controls enabled by row selection	a!gridField, a!gridLayout with selectable rows	When controls above a grid become enabled on row selection, set accessibility text on the grid (preferred) OR use a!messageBanner to announce when controls become enabled. Use "table" not "grid" if the information needs to reference the element.	Set accessibility text of "Controls above table become enabled on row selection" on the grid and do not indicate the condition under which controls become disabled (PREFERRED). OR use a!messageBanner with announceBehavior of ANNOUNCE_ONLY with a basic message of "Controls above grid are enabled" and do not use an announcement when controls are subsequently disabled.	Screen Reader: Navigate to the grid - accessibility text must be announced, OR select a row and listen for a message banner announcement.	Users not informed of dynamic control states	Error	High	1.3.1 (A) Info and Relationships 1.3.2 (A) Meaningful Sequence 2.4.3 (A) Focus Order	Non-sighted users need to be informed of this function EITHER before it occurs or afterward (not both). It is preferred to put the information in the grid accessibility text rather than using a message banner to reduce the potential number of screen reader announcements.
Grid	Row reorder links: target size	Grid row ordering links	Up/down row-ordering links must be at least 24x24px, OR 24px circles centered on each link must not overlap. Three spaces between links or the use of buttons meet this requirement.	Ensure links are ≥24x24px or add 3 spaces between them.	Phase 1: DOM inspect - check link size ≥24x24px (check the link anchor, not the icon within the link). Phase 2 (if undersized): Use target size bookmarklet or axe DevTools scan "All touch targets must have sufficient size".	Controls have insufficient target size	Error	High	2.5.8 (AA) Target Size (Minimum)	Buttons should be used for these controls. Links are typically not used to perform this function on the web.
Grid	Drag-and-drop needs a single-click alternative	Grids with drag-and-drop row reordering	Grid row drag-and-drop must also provide single-click alternatives (e.g., up/down controls).	Add up/down controls alongside drag-and-drop.	Visual: Confirm single click-based reorder controls exist alongside drag-and-drop.	No single-click alternative to grid row drag and drop	Error	Critical	2.1.1 (A) Keyboard
Grid	Drag-and-drop needs a keyboard alternative	Grids with drag-and-drop row reordering	Grid row drag-and-drop must also provide a keyboard alternative (e.g., up/down controls).	Add up/down controls alongside drag-and-drop.	Keyboard: Confirm row reordering controls are available that can receive keyboard focus with the TAB key and can be operated with the keyboard.	No keyboard alternative to grid row drag and drop	Error	Critical	2.1.1 (A) Keyboard	Buttons should be used for up/down controls. These are typically used to perform this function on the web.
Headings	Use semantic headings	a!headingField, layouts with labelHeadingTag (a!sectionLayout, a!boxLayout)	Visual headings must be defined using a!headingField or a layout's labelHeadingTag parameter - not just styled text.	Use a!headingField or set the labelHeadingTag parameter on section/box layouts.	Screen Reader (Browse): Press H - must identify as a heading with level. DOM: Text is inside <h1>-<h6> tags.	Headings not defined	Error	High	1.3.1 (A) Info and Relationships
Headings	Use rich text for text that does not summarize or "head" content	a!headingField	Text that does not summarize or "head" adjacent content must not be defined as a semantic heading.	Use rich text for the text.	SAIL: a!richTextDisplayField is used for the text. Screen Reader (Browse): Press H - text must not be navigated to as a heading and not identified as a heading. DOM: Text is inside <p>/</p> tags.	Heading defined for regular text	Error	High	1.3.1 (A) Info and Relationships
Headings	Use correct heading levels	a!headingField, layouts with labelHeadingTag (a!sectionLayout, a!boxLayout)	Heading levels (headingTag / labelHeadingTag parameters) must reflect content hierarchy and parent/child heading relationships - try to avoid skipping levels.	Set headingTag or labelHeadingTag (section/box layout) to the appropriate level.	Screen Reader (Browse): Press H - heading levels identified must match the visual structure. DOM: Correct <h1>-<h6> tags in appropriate sequence.	Incorrect heading levels used	Warning - Needs Review	Medium to High based on context	1.3.1 (A) Info and Relationships	Although it is always preferred that heading levels are sequential, it is not a hard requirement. The requirement is that the heading levels used make sense based on the structure of the content. Keeping them in sequence can remove any subjective scrutiny. The use of two H1 headings in a single interface should be avoided.
Lists	Use semantic lists	a!richTextBulletedList, a!richTextNumberedList	Visually styled lists (bullets, numbers, checkmarks, etc.) must use a!richTextBulletedList or a!richTextNumberedList. Does not apply to lists of nav links.	Use a!richTextBulletedList or a!richTextNumberedList instead of manual bullet styling.	SAIL: The list uses a!richTextBulletedList, a!richTextNumberedList, or was created using the rich text editor. Screen Reader (Browse): Press L - must identify as a list. DOM: Uses <ul>/<li> or <ol>/<li> tags.	Lists not defined	Error	Medium	1.3.1 (A) Info and Relationships
Pane Layout	Pane layout: accessibility text required	a!pane	Each a!pane must have accessibility text that brielfy describes the content in the pane. Avoid reserved terms: pane, main, navigation, section, form, search, header, footer, article.	Set the accessibilityText parameter on a!pane with a brief descriptive, unique name.	SAIL: accessibilityText must not be null. Screen Reader (Browse): Press R (JAWS), D (NVDA), or use Rotor (Mac) - must identify as "region" with a descriptive name.	Pane has no label	Error	Critical	1.3.1 (A) Info and Relationships 2.4.1 (A) Bypass Blocks 2.4.6 (AA) Headings and Labels 4.1.2 (A) Name, Role, Value
Section Layout	Expandable section layout: label + heading tag	a!sectionLayout (expandable)	Expandable a!sectionLayout must have both label and labelHeadingTag parameters set.	Set both label and labelHeadingTag on a!sectionLayout.	SAIL: label and labelHeadingTag on expandable a!sectionLayout must not be null. Screen Reader: Press H to find the heading, or TAB to the expand/collapse button - must announce section name, heading level, and button state. DOM: Label text inside <h1>-<h6> tags.	Expandable section layout has no label	Error	Critical	1.3.1 (A) Info and Relationships 2.4.6 (AA) Headings and Labels 4.1.2 (A) Name, Role, Value	Setting a label and heading for a non-expandable section layout is considered to be a best practice.
Box Layout	Expandable box layout: label + heading tag	a!boxLayout (expandable)	Expandable a!boxLayout must have both label and labelHeadingTag parameters set.	Set both label and labelHeadingTag on a!boxLayout.	SAIL: label and labelHeadingTag on expandable a!boxLayout must not be null. Screen Reader: Press H to find the heading, or TAB to the expand/collapse button - must announce section name, heading level, and button state. DOM: Label in a <div> with role="heading" and aria-level.	Expandable box layout has no label	Error	Critical	1.3.1 (A) Info and Relationships 2.4.6 (AA) Headings and Labels 4.1.2 (A) Name, Role, Value	Setting a label and heading for a non-expandable box layout is considered to be a best practice.
Card	Linked cards must not contain other interactive elements	a!cardLayout with link	If a!cardLayout has a link, no other links, buttons, or inputs may exist inside the card.	Remove all interactive elements from inside a linked card.	Keyboard: TAB to the card, then TAB again - focus must not move to anything inside the card other than an icon that uses a caption. DOM: The element with role="link" must have no focusable child elements.	Invalid control nesting	Error	Critical	2.1.1 (A) Keyboard 4.1.2 (A) Name, Role, Value
Card	No label on card links	a!cardLayout with link	When a link is set on a!cardLayout, the link label must be null.	Set the link's label to null.	SAIL: The label parameter for the link used in a!cardLayout does not have a value. Screen Reader (Browse): Read the card - "link" must be announced only once. DOM: First child of role="link" must not be a standalone <a> tag.	Invalid control role conveyed	Error	High	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
Card	Indicate selected cards with accessibility text	a!cardLayout (selectable)	When color or a decorative bar indicates selection, set accessibility text: "Selected" on the card. Remove it when deselected. Don't use "Unselected" when the card is not the current selection.	Conditionally set the accessibilityText parameter to "Selected" based on selected state.	Screen Reader: TAB to the card link or Browse mode - must announce "Selected". DOM: Last child of role="link" element contains "Selected".	Only styling indicates the selected card	Error	High	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Consider using a!tabLayout if the design and functionality allows. Selected states are managed by the component.
Card Choice Field	Card choice field: group label	a!cardChoiceField	a!cardChoiceField must have a label when more than one card is in the group.	Set label on a!cardChoiceField.	Screen Reader: TAB to first card - must announce the label and "grouping". DOM: role="group with aria-labelledby pointing to label text.	Card choice field has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Setting the label on a!cardChoiceField allows screen readers and other assistive technologies to identify the card choices as a "group" or "grouping".
Card Group Layout	Card group layout: group label	a!cardGroupLayout	a!cardGroupLayout must have a label when more than one card is in the group.	Set label on a!cardGroupLayout.	Screen Reader: TAB to first card (or Browse mode) - must announce the label and "grouping". DOM: role="group" with aria-labelledby pointing to label text.	Card group layout has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	Setting the label on a!cardGroupLayout allows screen readers and other assistive technologies to identify the cards as a "group" or "grouping".
Links	Links in text need more than just color	a!richTextItem links embedded in text	Links embedded in text must be visually distinct beyond color alone: use underline (linkStyle: INLINE), font change, icon, or have ≥3:1 contrast with surrounding text. Repositioning on a new line also works.	Set linkStyle: INLINE on a!richTextItem, or apply another visual differentiator.	SAIL/Visual: Check the linkStyle parameter on a!richTextItem OR confirm other visual differentiation is present.	Link distinguishable only by color	Warning - Needs Review	Medium	1.4.1 (A) Use of Color	Producing an underline below the link when the link is hovered over with a mouse or when it gains keyboard focus does not meet this requirement. This requirement does not apply to lists of links, e.g., navigation links listed in a navigation region.
Links	Selected link indication	Rich text links indicating selection	For rich text links indicating selection: if no icon, set accessibility text of "Selected" on a!richTextDisplayField. If an icon is used, set altText: "Selected" on the icon instead. Remove when deselected.	Conditionally set the accessibilityText parameter (no icon) or icon altText parameter (with icon) to "Selected".	Screen Reader: Must be tested using Browse mode because of a platform bug. The screen reader must announce "Selected" immediately prior to the link when selected.	Selected link not indicated	Error	High	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value	If the design and functionality allows, consider using a!tabLayout instead of links. Selected states are managed by the component.
Links	Link focus must be visible	Rich text links	Rich text links must show a visible focus indicator (underline color change, focus ring, etc.) when focused via keyboard.	Ensure link styling includes a visible focus state and there is enough spacing for the link for the focus state to be visible.	Keyboard: TAB to the link - confirm a visible change occurs on focus.	Link has no indication of keyboard focus	Error	High to Critical based on context	2.4.7 (AA) Focus Visible	In some cases an indication of focus may not be present because the link uses a combination of the standalone link style and a style parameter value of UNDERLINE. This causes the link to have the same visual appearance in both default and focused states.
Breadcrumb	Breadcrumb accessibility text	Breadcrumb patterns	Breadcrumbs must use accessibility text to identify the component as a breadcrumb and indicate the current (last) page, e.g., "Breadcrumbs, Corporate is the current page".	Set the accessibilityText parameter on the breadcrumb's a!richTextDisplayField.	Screen Reader (Browse): Read the breadcrumb - must identify as breadcrumb first and announce current page.	Breadcrumb not defined	Error	High	1.3.1 (A) Info and Relationships
iFrames	iFrame: needs a label	HTML <iframe> element	iFrames that contain content must have a label. Does not apply to iFrames used as shims, data transport, or use display:none or aria-hidden="true".	Set the label on the iFrame using the existing aria-label attribute present on the iFrame OR set the title attribute on the iFrame.	DOM: The aria-label or title attribute on the <iframe> is set to a value that describes the purpose of or content within the iFrame. Tool: axe DevTools: "Frames must have an accessible name".	iFrame has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 2.4.1 (A) Bypass Blocks 4.1.2 (A) Name, Role, Value	If your team cannot resolve this issue, then reassign it to the platform.
Progress Bar	Progress bar: needs a label	a!progressBarField	a!progressBarField must have a label.	Set the label parameter on a!progressBarField.	SAIL: label parameter is not null. Screen Reader (Browse): Must announce label before the value. Tool: axe DevTools: "ARIA progressbar nodes must have an accessible name".	Progress bar has no label	Error	High to Critical based on context	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
Progress Bar	Progress bar: must not rely only on color	a!progressBarField	Because of color restrictions with a!progressBarField, the textual percentage value of the progress bar must be present.	Set the percentage parameter on a!progressBarField and ensure the showPercentage parameter is NOT set to FALSE.	SAIL: The percentage parameter is not null and the showPercentage parameter is not set to FALSE on a!progressBarField. Visual: Ensure the completion percentage is output in text for the progress bar and not only the bar colors convey the information.	Progress bar has insufficient color contrast	Error	Medium to High based on context	1.4.11 (AA) Non-text Contrast	The color contrast of the base gray color used in progress bars cannot be modified in low code. Therefore, the textual value of the component must be output.
File Upload	File upload: label required	a!fileUploadField	a!fileUploadField must have a label.	Set the label parameter on a!fileUploadField.	SAIL: label parameter on a!fileUploadField is not null. Screen Reader: TAB to Upload button - must announce label + "upload" + "drop files here".	File upload has no label	Error	High	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
File Upload	File upload: use instructions parameter	a!fileUploadField	Visible upload instructions must be set via the instructions parameter on a!fileUploadField.	Set instructions on a!fileUploadField to match visible instruction text.	Screen Reader: TAB to Upload button - instructions must be announced. DOM: aria-describedby references the instructions node.	File upload instructions not associated with file upload button	Error	High	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions
File Upload	File upload: use visual required indicator	a!fileUploadField	When a file upload is required, the labelPosition parameter on a!fileUploadField is not set to COLLAPSED.	When a!fileUploadField uses a required parameter value of TRUE, set the labelPosition parameter on a!fileUploadField to any value other than COLLAPSED.	SAIL: If the required parameter is set to TRUE, the labelPosition parameter is not set to COLLAPSED. Visual: Ensure required asterisk is visible adjacent to the label.	Visual required asterisk not used with File Upload field	Error	High	1.3.1 (A) Info and Relationships 3.3.2 (A) Labels or Instructions
Signature	Signature: provide a keyboard alternative	a!signatureField	The Signature component must have an accessible keyboard alternative (checkbox, dropdown, DocuSign, etc.). Don't default values.	Provide an alternative, keyboard accessible input method alongside the signature component.	Visual: Confirm an accessible alternative input method exists and is not pre-filled.	No keyboard alternative for Signature component	Error	Critical	2.1.1 (A) Keyboard
Date & Time Component	Date & Time component: do not use	a!dateTimeField	a!dateTimeField must not be used - it is not accessible.	Do not use a!dateTimeField. Use a!dateField and a!timeField instead.	SAIL: Search for a!dateTimeField in the interface code - must not be present.	Date & Time component used	Error	Critical	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
Chart	Charts: label required	All chart components (a!areaChartField, a!barChartField, a!columnChartField, a!lineChartField, a!pieChartField, a!scatterChartField)	Every chart must have a label parameter set. Can use labelPosition: COLLAPSED if a heading directly above describes the chart.	Set label on the chart component.	SAIL: The label parameter on the chart component is not null. Screen Reader: TAB to the chart - must announce the label. DOM: aria-label on the highcharts-container div.	Chart has no label	Error	Critical	1.3.1 (A) Info and Relationships 4.1.2 (A) Name, Role, Value
Stamp	Stamp: no important info in help tooltip	a!stampField	a!stampField must not use a helpTooltip parameter to convey important information - this is not keyboard accessible.	Use only the tooltip parameter for stamp tooltips, do not use the helpTooltip parameter on a!stampField.	SAIL: Confirm helpTooltip parameter is null.	Stamp tooltip inaccessible	Error	Critical	1.3.1 (A) Info and Relationships	The stamp helpTooltip parameter value cannot be made visible with a keyboard. Setting this parameter is the same as setting the accessibilityText parameter on the stamp.
Tooltip	Tooltip: keyboard accessible	Components with tooltips	Tooltips visible on hover must also be visible via keyboard focus on the triggering element.	Ensure tooltip triggers are keyboard focusable elements. Do not set tooltips on disabled inputs and controls.	Keyboard: TAB to the element - tooltip must appear without a mouse.	Tooltip not keyboard accessible	Error	Critical	2.1.1 (A) Keyboard
Workflow Visualization Plugin	Workflow Visualization: provide an alternative view	Workflow Visualization plugin	Provide an accessible alternative view for the Workflow Visualization plugin (grid, rich text, cards, etc.) that conveys the same information including node name, dependencies, next node, and drill-down capability.	Build an alternative view (toggled, same page, or linked) with equivalent information.	Visual: Confirm an alternative view exists with node name, dependencies, next node, and drill-down content.	No alternative for Workflow Visualization	Error	Critical	1.1.1 (A) Non-text Content 1.3.1 (A) Info and Relationships 1.3.2 (A) Meaningful Sequence 2.1.1 (A) Keyboard 2.4.1 (A) Bypass Blocks 4.1.2 (A) Name, Role, Value
Simulated Grid	Simulated grid: accessibility text per cell	Non-grid table-like layouts	Data visually displayed as a grid but not using a!gridField must have accessibilityText in each "cell" containing the column header text (and row header text if applicable).	Set accessibility text as the first element in each "cell" with column header and row header text.	Screen Reader (Browse): Read cells - must announce column header and row header before the cell value.	Simulated grid provides no context	Error	Critical	1.3.1 (A) Info and Relationships 1.3.2 (A) Meaningful Sequence	Is is always preferred to use a grid for information coneyed in a tabular layout.
Custom Pagination	Disabled pagination links: no accessibility text and icon text alternative	Custom pagination controls	Inactive/non-applicable pagination links must not have accessibilityText, altText, or caption set. Remove all text alternatives when theese controls are inactive and the link is removed.	Set accessibilityText, altText, and caption to null when pagination controls are inactive OR do not output the icons when the pagination does not apply (when the links are removed).	Screen Reader (Browse): Inactive/non-applicable pagination elements must be ignored. DOM: Icon SVG has focusable="false", aria-hidden="true", tabindex="-1".	Non-applicable pagination links not ignored by assistive technologies	Error	Critical	1.3.1 (A) Info and Relationships	It is preferred to use buttons for pagination, with the buttons being disabled (and still labeled) when they do not apply.
Custom Pagination	Pagination link target size	Adjacent active pagination links	Adjacent active pagination links must be ≥24x24px, or 24px circles centered on each must not overlap.	Ensure links are ≥24x24px or add sufficient spacing or use buttons.	Phase 1: DOM inspect - check link size ≥24x24px. Phase 2 (if undersized): Use target size bookmarklet or axe DevTools "All touch targets must have sufficient size" (axe DevTools may not test accurately if content is in a modal dialog).	Links have insufficient target size	Error	High	2.5.8 (AA) Target Size (Minimum)	Passes by default if there are 3 spaces between each link or if buttons are used instead of links.
Icon - In a Link (standalone)	Standalone icon in a link needs text alternative	Icons as the only element in a link	When an icon is the only element in a link, set the altText or caption parameter (prefer altText) to describe the icon's purpose.	Set the altText (preferred) or caption parameter on the icon.	SAIL: The altText or caption parameter is set on the icon. Screen Reader: TAB to the link - must announce the text alternative. Tool: axe DevTools: "Links must have discernible text". DOM: aria-label on the icon SVG.	Standalone icon used in link has no text alternative	Error	Critical	1.1.1 (A) Non-text Content 2.4.4 (A) Link Purpose (In Context) 4.1.2 (A) Name, Role, Value	Use a caption ONLY if the purpose of the icon may not be clear to all sighted users based on its visual presentation.
Icon - In a Link (with text)	Informational icon with text in a link needs text alternative	Icons alongside text in a link	Only provide a text alternative for the icon if the link text doesn't already convey the same info. Set via altText or caption - don't use accessibilityText or tooltip on the link.	Set the altText or caption parameter on the icon only if the link text does not convey they information presented by the icon.	Screen Reader: TAB to the link - icon alt text must be announced alongside link text only when needed. DOM: aria-label on the icon SVG.	Icon that conveys information in link having text has no text alternative	Warning - Needs Review	High to Critical based on context	1.1.1 (A) Non-text Content 2.4.4 (A) Link Purpose (In Context) 4.1.2 (A) Name, Role, Value	Use a caption ONLY if the purpose of the icon may not be clear to all sighted users based on its visual presentation.
Icon - In a Button (standalone)	Standalone icon in a button needs a text alternative	Icons as the only element in a button	When an icon is the only element in a button, set accessibilityText or tooltip on the button.	Set the accessibilityText or tooltip parameter on the button.	SAIL: The accessibilityText or tooltip parameter is set on the button. Screen Reader: TAB to the button - must announce the text alternative. Tool: axe DevTools: "Buttons must have discernible text".	Standalone icon used in button has no text alternative	Error	Critical	1.1.1 (A) Non-text Content 4.1.2 (A) Name, Role, Value	Use a tooltip ONLY if the purpose of the icon may not be clear to all sighted users based on its visual presentation.
Icon - In a Button (with text)	Informational icon with text in a button needs text alternative	Icons alongside text in a button	Only provide a text alternative if the button label doesn't already convey the icon's meaning. Set via accessibilityText or tooltip on the button.	Set the accessibilityText or tooltip parameter on the button only if the button label does not convey the same information as the icon.	Screen Reader: TAB to the button - icon description must be announced alongside button text only when needed. DOM: Node positioned inside of button contains accessibility text.	Icon that conveys information in button having text has no text alternative	Warning - Needs Review	High to Critical based on context	1.1.1 (A) Non-text Content 4.1.2 (A) Name, Role, Value	Use a tooltip ONLY if the purpose of the icon may not be clear to all sighted users based on its visual presentation.
Icon - Standalone (informative)	Standalone informational icon needs a text alternative	Standalone icons conveying information (not in link/button)	Set altText, caption, or accessibilityText to describe the icon when no adjacent text conveys the same info. Use a caption if the icon's meaning may not be universally understood based on its visual presentation.	Set the altText (preferred) or caption parameter on the icon or set the accessibilityText parameter on a!richTextDisplayField (if used).	Screen Reader (Browse): Read the icon - must announce the text alternative. DOM: aria-label on the icon SVG or a node containing accessibility text (stamp).	Standalone icon that conveys information has no text alternative	Warning - Needs Review	Critical	1.1.1 (A) Non-text Content	Use a caption ONLY if the purpose of the icon may not be clear to all sighted users based on its visual presentation.
Icon - Decorative/Redundant	Decorative or redundant icons must be ignored	Decorative icons or icons with adjacent equivalent text	Do not set altText or caption on icons that are purely decorative or where adjacent text already conveys the same info.	Set the altText and caption parameters to null on decorative/redundant icons.	Screen Reader (Browse): Icon must be ignored (nothing announced). DOM: Icon SVG has focusable="false", tabindex="-1", aria-hidden="true", and no aria-label.	Decorative icon has a text alternative	Warning - Needs Review	Medium to High based on context	1.1.1 (A) Non-text Content
Icon - General	No redundant text alternatives	All icons that accept both altText and caption parameters	Do not set altText and caption on icons where both parameters have the same value.	Use only one of the parameters UNLESS one parameter provides necessary contextual information in addition to the other parameter value.	SAIL: The icon altText and caption parameters are not set to the same value. Screen Reader (Browse): A redundant text alternative is not announced. DOM: Icon SVG has aria-label set to two redundant values seperated by a comma.	Icon has redundant text alternative	Warning - Needs Review	Medium to High based on context	1.1.1 (A) Non-text Content
Image of Text	No images of text	Images containing text	Don't use images containing text unless it's a logo or a font that browsers can't render.	Use real text instead of images of text.	Visual/DOM: Determine if text is embedded in the image or overlaid via CSS.	Image of text is used	Warning - Needs Review	High to Critical based on context	1.4.5 (AA) Images of Text	If an image of text is used, the text must also have adequate color contrast between it and the background unless the text is part of a logo.
Text Contrast	Regular text: 4.5:1 contrast	All regular-sized text (body text, labels, placeholder text, button labels, link text, table cells - any text below 18pt or below 14pt bold)	Regular-sized text must have ≥4.5:1 color contrast ratio against its background.	Ensure text and background color combinations meet the 4.5:1 color contrast ratio.	Tools: Colour Contrast Analyser or axe DevTools page scan.	Regular-sized text has insufficient color contrast	Error	Medium to High based on context	1.4.3 (AA) Contrast (Minimum)	It is possible to get unequal results between the Colour Contrast Analyzer and axe DevTools. axe DevTools is better at accounting for opacity.
Text Contrast	Large text: 3:1 contrast	Large text (≥18pt or ≥14pt bold)	Large text (≥18pt or ≥14pt bold) must have ≥3:1 color contrast ratio against its background.	Ensure large text and background color combinations meet the 3:1 color contrast ratio.	Tools: Colour Contrast Analyser or axe DevTools page scan.	Large text has insufficient color contrast	Error	Medium to High based on context	1.4.3 (AA) Contrast (Minumum)	It is possible to get unequal results between the Colour Contrast Analyzer and axe DevTools. axe DevTools is better at accounting for opacity.
Image & Icon (non-text) Contrast	Icons/images/non-text: 3:1 contrast	Informational (non-redundant) icons/images/non-textual content	Informational icons, images, and non-textual content must have ≥3:1 color contrast between the part of the image or non-text content that conveys information and adjacent colors.	Ensure icon/image/non-text colors meet the 3:1 color contrast ratio against adjacent colors.	Tool: Colour Contrast Analyser.	Image/non-textual content that conveys information has insufficient color contrast	Warning - Needs Review	Medium to High based on context	1.4.11 (AA) Non-text Contrast	The Appian product has a user setting that allows users to change colors used in charts to patterns.
Selected State Contrast	Selected state: 3:1 contrast	Adjacent elements with selected/unselected states	The color indicating a "selected" state must have ≥3:1 color contrast against the same area of an adjacent unselected element.	Ensure selected state color has 3:1 color contrast vs. the adjacent unselected state.	Tool: Colour Contrast Analyser.	Insufficient color contrast between selected and unselected states	Warning - Needs Review	Medium to High based on context	1.4.11 (AA) Non-text Contrast
Color Use	Color must not be the only indicator	All visual elements (text, buttons, links, icons, status indicators, charts, form inputs - any element where color is used to communicate meaning)	Don't use color as the sole means of conveying information (e.g., "click the red button", "added items are green").	Always pair color with text, icons, patterns, or other non-color cues.	Visual: Confirm meaning is conveyed through text, icons, patterns, or other non-color cues alongside color.	Color alone is used to convey information	Warning - Needs Review	High to Critical based on context	1.4.1 (A) Use of Color
200% Zoom	200% zoom: content must be readable and functional	All content (all text, inputs, buttons, links, images, grids, layouts - everything visible on the interface)	At 200% browser zoom, all text must be readable, functional, and not overlapping. If text is truncated, a method to access it must exist.	Ensure layouts are responsive at 200% zoom.	Browser (not Designer): Maximize window: Ctrl+"+" five times to reach 200% magnification. Check readability and functionality. Ctrl+0 to reset.	Content does not reflow at 200% screen magnification	Warning - Needs Review	Medium to Critcal based on context	1.4.4 (AA) Resize Text
400% Zoom	400% zoom: no loss of content, no 2D scrolling	All content (grids and complex images exempt) (all text, inputs, buttons, links, images, layouts - everything visible on the interface; a!gridField and complex images are excluded)	At 1280px browser width and 400% zoom, content must not require both vertical and horizontal scrolling, and no content or functionality may be lost. The two-way scrolling requirement does not apply to complex images and grids.	Ensure layouts reflow to single-column at 400% zoom with a browser width of 1280px.	Browser (not Designer): Set width to 1280px: Ctrl+"+" eight times to reach 400% magnification. Verify no content loss and no two-way scrolling. Ctrl+0 to reset.	Content does not reflow at 400% screen magnification	Warning - Needs Review	Medium to Critical based on context	1.4.10 (AA) Reflow	Using more than one pane layout or panes with fixed header and footer in an interface increases the chance of failing this requirement.
Modal Dialog	Modal dialog: don't auto-focus past content	Modal dialogs with forms	When a modal dialog opens, don't move focus to a form input if important content precedes it.	Set focusOnFirstInput: false on the form inside the dialog.	Screen Reader: On dialog open - must announce the dialog name and 'dialog'. Focus must not jump to an input when important content comes first.	Mismanaged keyboard focus in dialog	Warning - Needs Review	High	1.3.2 (A) Meaningful Sequence 2.4.3 (A) Focus Order	Not all screen readers will announce the dialog name and role when a dialog opens because of a bug in how Appian moves focus to dialogs when they open. This gist of this requirement is that focus is not moved past important content when the dialog opens.
Dynamically-Added Content	Dynamically added content: tab order	Interfaces with dynamically added content (does not apply to dynamic visual messages with screen reader announcement)	New content added to the page must appear in the tab order after the control that triggered it, OR visible instructions must warn the user beforehand, OR a!messageBanner with announceBehavior: ANNOUNCE_ONLY must notify users of the content's location after the content has been added.	Position new content after the trigger in DOM order, or use instructions/messageBanner.	Keyboard: After activating the trigger, TAB forward - new content must be next. Screen Reader: If not in forward order, the trigger or a banner must announce where content will be or was added.	Illogical tab order	Warning - Needs Review	High to Critical based on context	2.4.3 (A) Focus Order	Don't overuse the message banner. It is preferred to warn the user prior to the content addition if it cannot be added in front of the user.
Dynamically-Added Content	Dynamically added content: reading order	Interfaces with dynamically added content (does not apply to dynamic visual messages with screen reader announcement)	New content added to the page must be in the screen reader reading order after the control that triggered it, OR visible instructions must warn the user beforehand, OR a!messageBanner with announceBehavior: ANNOUNCE_ONLY must notify users of the content's specific location after the content has been added.	Position new content after the trigger in DOM order, or use instructions/messageBanner.	Screen Reader (Browse): After activating the trigger read the content in the forward reading order. If not in forward reading order, the trigger or a banner must announce where content was added.	Illogical content reading sequence	Warning - Needs Review	High to Critical based on context	1.3.2 (A) Meaningful Sequence	Don't overuse the message banner. It is preferred to warn the user prior to the content addition.
Dynamically-Added Content	Dynamically added content: wizards	Multi-step wizards that do not use the Milestone component	Non-sighted users are aware of which wizard step is being accessed as they navigate forward and backward within the wizard.	Use the Milestone component or use a!messageBanner with a screen reader announcement.	Screen Reader: Access steps within the wizard using forward and backward navigation. The step number or name must be announced as it is accessed, or any other screen reader announcement that indicates that new content has been served.	Wizard steps are not perceivable	Warning - Needs Review	High to Critical based on context	1.3.1 (A) Info and Relationships
Dynamically-Added Content	Misuse of message banner: static content	Interfaces containing text	Message banners with screen reader announcements are not used for static text that is present when the interface is initialized.	Avoid using the message banner screen reader announcement for static text that exists when the interface is initialized.	Screen Reader: Open the interface and ensure static text that is present in the interface when it initializes is not announced by the screen reader.	Misuse of message banner with screen reader announcement	Error	Medium to High based on context and what is announced	1.3.1 (A) Info and Relationships	The exception is when a user is instructed to refresh the page or their browser, causing a change/update to any previously available text.
Dynamic Status Messages	Dynamic status messages: use message banner	Dynamic status/notification/toast messages	Dynamic status messages must use a!messageBanner with an appropriate announceBehavior parameter value. For screen reader announcements, the entire visual message must be included in the screen reader announcement.	Use a!messageBanner with the announceBehavior parameter for all dynamic messages.	Screen Reader: Perform the action that initiates the message - the full message must be announced when it appears.	Dynamic message unavailable to assistive technologies	Warning - Needs Review	Critical	1.3.1 (A) Info and Relationships 1.4.3 (AA) Status Messages
Keyboard Focus	Keyboard focus must be visible	All actionable elements including inputs, controls, pane layouts	All elements that can receive keyboard focus must show a visible focus indicator (underline color change, focus ring, etc.) when focused via keyboard.	Ensure the spacing around the element is sufficient to allow the default focus indicator to be visible. For custom controls, ensure the CSS outline property is not set to none.	Keyboard: TAB to the active element - confirm a visible change occurs on focus.	Active element has no indication of keyboard focus	Error	High to Critical based on context	2.4.7 (AA) Focus Visible
Focus Order	Focus order must be logical	Buttons adjacent to text or paragraph fields that are enabled after input is entered (applies mostly to searches)	The button that becomes enabled based on user input is next in the forward tab order when the input loses keyboard focus.	Use a refreshAfter value of KEYPRESS and not UNFOCUS.	Keyboard: TAB to the button after providing input in the text or paragraph field - confirm the button is next in the forward tab order and is not skipped.	Button not enabled in time to receive keyboard focus	Error	High to Critical based on context	2.4.3 (A) Focus Order
Accessibility Text	Accessibility text is not redundant	All components that accept accessibility text	Accessibility text does not duplicate text already available onscreen.	Do not use accessibility text that duplicates adjacent onscreen text.	Screen Reader (Browse): For all components, read the component content and content immediately before the component. Screen Reader (Forms): Navigate to the component using the TAB or SHIFT + TAB keys (does not work for all components, Browse mode is more effective).	Misuse of accessibility text	Warning - Needs Review	Medium to Critical based on context	1.3.1 (A) Info and Relationships Can apply to other WCAG criteria based on context