Using correct HTML headings
The problem:
The current template has some inconsistencies as to the use of headings:
- the main heading of the page is encoded as <h2>;
- the page body can contain <h1> elements, hence higher-order headings than the main heading;
- the set of available headings that can be produced with wikka markup includes h1, h2, h3, h4, h5, but not h6, which is allowed by W3 specs.
The reference:
[Source: HTML Techniques for Web Content Accessibility Guidelines 1.0]1.2.1 Section Headings
Checkpoints in this section:
Use header elements to convey document structure and use them according to specification
Long documents are often divided into a variety of chapters, chapters have subtopics and subtopics are divided into various sections, sections into paragraphs, etc. These semantic chunks of information make up the structure of the document.
Sections should be introduced with the HTML heading elements (H1-H6). Other markup may complement these elements to improve presentation (e.g., the HR element to create a horizontal dividing line), but visual presentation is not sufficient to identify document sections.
Since some users skim through a document by navigating its headings, it is important to use them appropriately to convey document structure. Users should order heading elements properly. For example, in HTML, H2 elements should follow H1 elements, H3 elements should follow H2 elements, etc. Content developers should not "skip" levels (e.g., H1 directly to H3). Do not use headings to create font effects; use style sheets to change font styles for example.
The solution:
Here's my suggestion list, which includes a point already made by JW and others:
- replace the <h2> in the page header with a <h1>;
- allow in the page body headings from <h2> to <h6> (note that it's enough to make a small change in the formatter to prevent h1 tags and to enable h6 tags).
CategoryDevelopmentMarkup CategoryLayout
