<hr> as heading container


#1

What if custom element type <html5-h> or XHTML2’s <h> or HTML5’s <hgroup> could be substituted by existing <hr>? It would play an important part in the outline algorithm.

Example 1: <h1> with <h2>

<hr>
  <h1>I’m a heading</h1>
  <h2>I’m a subheading</h2>
</hr>

Example 2: <h1> with <p>

<hr>
  <h1>I’m a heading</h1>
  <p>I’m a subheading</p>
</hr>

Example 3: <h1> with <subhead>

<hr>
  <h1>I’m a heading</h1>
  <subhead>I’m a subheading</subhead>
</hr>

Example 4: anonymous with <subhead>

<hr>I’m a heading
  <subhead>I’m a subheading</subhead>
</hr>

Example 5: anonymous with <h2>

<hr>I’m a subheading
  <h2>I’m a heading</h2>
</hr>

Example 6: just anonymous

<hr>I’m a heading</hr>

Considerations

  • XHTML: Standalone <hr> would be a syntax error, with </hr> it parses just fine, therefore the empty <hr/> can be a special case of the generic hr heading container, rendered as a divider as it has always been.

  • HTML4: </hr> is ignored, hence <hr> and <hr /> are always dividers. Authors might choose to supply some CSS rule like this: hr:empty {display: none;}

  • HTML5: Legacy content with <hr> would open an element that is never closed. Therefore special rules for automatic closing are necessary, e.g. only anonymous text nodes and h# headings could be allowed as (first) contents. That means, <hr><p>… would constitute an empty heading container followed by a normal paragraph, hence Example 2 above would not work.

  • Legacy browsers: Some legacy content may use </hr >(like </br>) and assume it works the same as with the slash at the end or without it. That’s certainly the case with similar </br>.


#2

<hr> is a void element, and you can’t ever change that; it would break a bazillion pages using <hr>. Even your suggested auto-closing rules likely wouldn’t work; I’m sure there’s plenty of naked text following an <hr>.

Why do you think redefining the <hr> element so drastically is important here? Is it just because it has a name that matches the “hX” pattern? Its name stands for “horizontal rule”, not anything about headings, so it’s a false cognate here.


#3

In XHTML5, you could change it to a non-void element type easily. In HTML5, you would need some tricks. To imagine which ones, we would need to know what follows <hr> in existing content – and what encompasses it Also, I’m a fan of upycling. If only <h#/> content would be allowed it would always auto-close quickly.

I really don’t like <hr>, at least not as meaning horizontal rule. I tried to argue to keep it out of HTML 5 back in the day. I pointed out that it could well be interpreted as a non-leveled, empty heading, not just because of hr resembling h#