Skip to content
Gx
GitHub

GX2021: heading skips a level

A warning. A heading of a component is more than one level below the heading before it.

Cause

GX2021 is a warning. It does not fail gx check.

A user of a screen reader moves through a page by its headings. A heading that skips a level, such as h3 after h1, says that a part of the page is missing.

Gx reads one file. A component does not know the heading level of the page that uses it, so this is a warning and not an error.

Example

post/Post.gx
package post

<article>
  <h1>Tea</h1>
  <h3>How to brew</h3>
</article>

gx check reports:

gx check
post/Post.gx:5:3: GX2021: hint: the heading <h3> comes after <h1>: it skips a level

Fix

  1. Use the next level: h2 after h1.
  2. Choose the level by the structure of the page, and the size by a class.