How to Define Localized Labels and Access Keys

Developing Accessible ADF Faces Pages 22-13 CSS positioning should be used only in the case of positioning the stretched layout component. Do not use CSS positioning elsewhere.

22.4.4 How to Use Page Structures and Navigation

Follow these accessibility guidelines when using these page structures and navigation tools: ■ Use af:panelSplitter component for layouts. When implementing geometry-managed layouts, using af:panelSplitter allows users to: – Redistribute space to meet their needs – Hide or collapse content that is not of immediate interest. If you are planning to use af:panelStretchLayout, you should consider using af:panelStretchLayout instead when is appropriate These page structure qualities are useful to all users, and are particularly helpful for low-vision users and screen-reader users As an example, a chrome navigation bar at the top of the page should be placed within the first facet of a vertical af:panelSplitter component, rather than within the top facet of af:panelStretchLayout component. This allows the user to decrease the amount of space used by the bar, or to hide it altogether. Similarly, in layouts that contain left, center, or right panes, use horizontal splitters to lay out the panes. ■ Enable scrolling of flow layout contents. When nesting flow layout contents such as layout controls inside of geometry-managed parent components such as af:panelSplitter or af:panelStretchLayout, wrap af:panelGroupLayout with layout=scroll around the flow layout contents. This provides scrollbars in the event that the font size is scaled up such that the content no longer fits. Failure to do this can result in content being clipped or truncated. ■ Use header-based components to identify page structure. HTML header elements play an important role in screen readability. Screen readers typically allow users to gain an understanding of the overall structure of the page by examining or navigating across HTML headers. Identify major portions of the page through components that render HTML header contents including: – af:panelHeader – af:showDetailHeader – af:showDetailItem in af:panelAccordion each accordion in a pane renders an HTML header for the title area ■ Use af:breadCrumbs component to identify page location. Accessibility standards require that users be able to determine their location within a web site or application. The use of af:breadCrumbs achieves this purpose. 22-14 Web User Interface Developers Guide for Oracle Application Development Framework

22.4.5 How to Use WAI-ARIA Landmark Regions

The WAI-ARIA standard defines different sections of the page as different landmark regions. Together with WAI-ARIA roles, they convey information about the high-level structure of the page and facilitate navigation across landmark areas. This is particularly useful to users of assistive technologies such as screen readers. ADF Faces includes landmark attributes for several layout components, as listed in Table 22–3 . These attributes can be set to one of the WAI-ARIA landmark roles, including: ■ banner ■ complimentary ■ contentinfo ■ main ■ navigation ■ search When any of the landmark-related attributes is set, ADF Faces renders a role attribute with the value you specified.

22.5 Running Accessibility Audit Rules

JDeveloper provides ADF Faces accessibility audit rules to investigate and report compliance with many of the common requirements described in Section 22–1, ADF Faces Components Accessibility Guidelines. Running an audit report involves creating and running an audit profile. To create an audit profile: 1. From the main menu, choose Tools Preferences. 2. In the Audit: Profiles dialog, deselect all checkboxes except ADF Faces Accessibility Rules .

3. Save the profile with a unique name and click OK.

Table 22–3 ADF Faces Components with Landmark Attributes Component Attribute decorativeBox topLandmark centerLandmark panelGroupLayout landmark panelSplitter firstLandmark secondLandmark panelStretchLayout topLandmark startLandmark centerLandmark endLandmark bottomLandmark