VGAR Content Requirements

VGAR Overview Requirements Test Procedures PDF Tools
Page
Navigation
Interaction

Content

Visual

Heading Structure CON-001

Use heading elements to define content structure

Requirements

Use Headings (h1 etc.) (CON-WEB-001-01)

Pages MUST organize content using headings (e.g., H1, H2, etc.) AND the headings must accurately describe their sub-content.

One h1 Per Page (CON-WEB-001-02)

Each page MUST have only one H1.

H1 at Top of Main (CON-WEB-001-03)

The H1 MUST be within and at the top of the Main ARIA Landmark, with no plain text content (i.e. <div> or <span>) above it.

Sequential Headings (CON-WEB-001-04)

Headings MUST occur in a sequential and increasing order (i.e., Heading 1, then Heading 2, then Heading 3 and so on, no skipping numbers).

Properly Nested Headings (CON-WEB-001-05)

Headings MUST be nested properly (i.e., 2 is always a child of 1, and 3 is always a child of 2, and so on).

Test Procedures

Headings Map (CON-WEB-001-01-T)

  1. Open ANDI > Structures > Headings > View Headings List
  2. View all headings instances listed below the 'View headings list' button
  3. Confirm that each page organizes content using headings (e.g., H1, H2, etc.) and that all content which serves as a heading visually and structurally is also exposed as a heading programmatically.
  4. Confirm that the page headings accurately describe their sub-content

Headings Map (CON-WEB-001-02-T)

Confirm that each page has only one H1.

ANDI > Browser Inspection (CON-WEB-001-03-T)

  1. Run ANDI>Structures>Headings
  2. Find the H1 outlined on the page and confirm that the H! is within and at the top of the Main ARIA Landmark, with no plain text content (i.e. <div> or <span>) above it.

Headings Map (CON-WEB-001-04-T)

Headings MUST occur in a sequential and increasing order (i.e., Heading 1, then Heading 2, then Heading 3 and so on, no skipping numbers).

Headings Map (CON-WEB-001-05-T)

Confirm that headings are nested properly (i.e., 2 is always a child of 1, and 3 is always a child of 2, and so on).

Related Content

WCAG Success Criteria

W3C Techniques

These materials and steps outlined on this website are provided “AS IS” and are intended for illustrative purposes only. They should not be relied upon for marketing, legal, tax, financial, regulatory or other advice. You are responsible for the legal aspects of any implementation of the concepts illustrated herein. Further, Visa neither makes any warranty or representation as to the completeness or accuracy of this information, nor assumes any liability or responsibility that may result from reliance on such information.  You should not act or rely on such content without seeking the advice of a professional.  All brand names, logos and/or trademarks are the property of their respective owners, are used for identification purposes only, and do not necessarily imply product endorsement or affiliation with Visa.