HTML Guidelines

Header

Header usage should be hierarchical within page views Reference link: Standardize classnames and layout to facilitate theming

• Headers should be hierarchical, with two or more <h3> under each <h2> and so forth.
• <h2> is the top-level header of the page content/central column. There should be only one <h2>
• Headers should not be used for notification. Notification classes should be used for notification.
• We shouldn't even need the .main class. The fact that the header is located in the central column/main content area, and is a header, should be enough. The only reason we need it is because we're recruiting headers for other purposes.

Not this:

  <h2 class="main">This is the top-level header</h2>
  <p>A paragraph of content.</p>
  <h2 class="main">These is your score on XX activity.</h2>
   <p>A paragraph of content.</p>
  <h2 class="main">You must make a selection to proceed.</h2>
  <input type="submit" value="Generic submit button">

This:

  <h2>This is the top-level header</h2>
  <p>This paragraph gives additional information and explains what's to come.</p>
  <h3>Content sub-header</h3>
  <p>More paragraph content content content</p>
  <h3>Content sub-header</h3>
  <p>More paragraph content content content</p>
  <div class="notifyproblem">You must make a selection to proceed.</div>