Skip to content
Customer Support Portal
  • There are no suggestions because the search field is empty.

Are Banner Titles accessible when they are set to heading level 2 and hide the Canvas page title?

Yes. DesignPLUS provides two options for Banner Titles, and both produce an accessible heading structure.

Why does DesignPLUS hide the Canvas page title?

By default, Canvas marks up the page's title as a Heading 1 (H1). When a Banner Title is added in DesignPLUS, it usually contains the same text as the Canvas page title.

If both headings were displayed, users would see the same title twice. To avoid this visual duplication, DesignPLUS hides the Canvas page title. The underlying heading structure remains accessible, no matter which Banner Title option is selected. While screen reader users can still encounter two nearly identical headings, we feel that it is important to keep the heading hierarchy intact.

Default Behavior: Banner Title as H2 (recommended)

By default, the Banner Title is configured as an H2. In this case, the Canvas page title is hidden visually but remains available to screen readers. The screen reader encounters:

  • H1: Canvas page title
  • H2: Banner Title

Although the text is similar, the heading hierarchy is preserved. The H2 does not skip heading levels because the H1 is still present in the document for assistive technologies. This was also the behavior of the legacy Design Tools, which only supported Banner Titles as H2 headings.

Alternate Option: Banner Title as H1

When the Banner Title is configured as an H1, the Canvas page title is hidden visually and hidden from assistive technologies. The Banner Title becomes the page's single H1.

While this option eliminates duplicate page titles for screen reader users, it comes with a few challenges:

  • Accessibility checkers: Some accessibility checkers automatically flag H1 headings in the editor. This is because a page can only have a single H1 heading, and the accessibility checkers do not know that DesignPLUS has replaced the existing H1.
  • Skipped headings: Many other DesignPLUS elements (such as Content Blocks) have built-in headings designed to nest under an H2 Banner Title. Therefore, if you change the Banner Title to H1, you will likely need to adjust all other headings on the page to avoid skipped heading levels.

Because of these considerations, the default of H2 is a better option for most users.

Is an H2 Banner Title WCAG compliant?

Yes. Using a Banner Title as an H2 does not violate WCAG.

WCAG requires that the heading structure and relationships within the page are conveyed programmatically so assistive technologies can interpret them correctly (Success Criterion 1.3.1, Info and Relationships). 

When the Banner Title is configured as an H2, the Canvas H1 remains available to screen readers, so the heading hierarchy is preserved. When the Banner Title is configured as an H1, it replaces the Canvas page title as the page's single H1.

Does the Banner Title disrupt heading hierarchy?

No. Both the H2 and H1 options produce an accessible heading structure:

  • Using a Banner Title as H1 results in a single H1 that replaces the Canvas page title.
  • Using a Banner Title as H2 retains the Canvas H1 for assistive technologies, followed by the Banner Title as H2.
  • Heading levels are not skipped in either configuration.
  • The visual hiding of the Canvas page title does not remove the underlying document structure needed by screen readers.

As with any page, accessibility also depends on authors using subsequent headings (H2, H3, H4, etc.) in a logical order throughout the rest of the content.