Assigning WAI-ARIA roles to a Dynamic Layout
Make your application more accessible to users with disabilities by adding semantic information about the role of a layout on a page. When you define the role of a layout in your UI, you provide screen reader users with the information that they require to successfully navigate your application.
When you develop your application, Pega Platform automatically assigns WAI-ARIA roles to the screen layout. Other layouts in the system do not have default accessibility roles when you create them. For most use cases, the blank setting is sufficient. However, when you design a layout that behaves in an unconventional way, you must assign a WAI-ARIA role to that layout by hand.
For example, your page might include a large layout that you can click. Because the default
role for the layout is blank, a screen reader ignores the layout and does not inform the
user that it can be clicked. If you assign a button
role to the layout by hand, the
screen reader can interpret the header correctly.
- In the navigation pane of Dev Studio, click Records.
- Expand the User Interface category, and then click Section.
- Open the section that you want to edit.
- If your section uses a template, in the section editor header, click convert to full section editor, and then confirm the conversion.
- Select the dynamic layout to which you want to assign a WAI-ARIA role, and then click
the View properties icon.
- In the Accessibility section, in the Role
type list, define the general role of the layout:
- To mark a layout as a primary part of the page, such as a form, select Landmark.
- To mark a layout as a structural, non-interactive part of the page, such as a header, select Document structure.
- To mark a layout as an interactive part of the page, such as a link, select Component/Widget.
- In the Value field, select the specific role for the layout.
- In the Label field, provide a short, meaningful description of the content of the layout, and then click Submit.
- On the design template form, click Save.
Previous topic Accessibility standards in Pega Platform Next topic Managing the main content of your application