Configure semantic headers to ensure that users across browsers and assistive
technologies have an equal and accessible experience in your application. You can use
semantic headers as navigation landmarks for screen readers, an organizational component
for content, or as table of contents for a page.Note: Configuring headers for layouts is a best practice for
accessibility, as it generates a semantic
<h> header in the markup
- Search for and open an existing section.
- If the section is based on a template, in the header of the section editor,
click convert to full section editor, and then confirm
- In the Dynamic layout header, click the
View properties icon.
- In the layout properties dialog box, select the Display header and
- In the Container settings section, in the
Title list, select the source of the header
- To use a text constant, select Text, and then, in
the field to the left, enter the text of the header.
- To reference a property, select Property, and
then, in the field to the left, select the property that you want to
- To reference the value of a property, select Field
value, and then, in the field to the left, select the
property whose value you want to reference.
- Optional: To add an icon to the header, select the Include icon or
value header, and then complete the icon settings.
- In the Body visibility list, select when you want to
display the header.
- In the Header type list, select the style of the
- To display a horizontal bar that is always present, select
- To display a horizontal bar that application users can click to expand
or collapse the layout contents, select
- To display a border around the contents of the layout with a single text
label, select Fieldset.
The Fieldset produces HTML