[20] hgroup 要素は、見出しを表します。 同じく見出しを表す hn 要素とは違って、 サブタイトルなども含めた構造を表現できます。

仕様書

意味

[29] hgroup 要素は、章の見出しheadingを表現します。 この見出しは、 hgroup 要素の子供である hn 要素すべてによって構成されます。 >>21

[30] hgroup 要素は、1つの見出しがサブタイトル、 別題、キャッチコピーなどを含めて複数のレベルで構成される時に、 hn 要素をまとめるために使います。 >>21

[34] hgroup 要素の子孫である hn 要素のうち、最大の階数のものが見出しの主たる部分を表しています。 それ以外は、サブタイトルの類を表しています >>21。

分類

[23] hgroup 要素は、次の分類に所属しています。

文脈

[24] hgroup 要素は、フロー内容を使える場所で用いることができます >>21。

[43] 見出しに主たる部分とサブタイトル部分があって、 CSS を使って両者の表示を変えたいときに有用です。

構文

[25] 開始タグも終了タグも省略できません。

属性

[26] HTML の大域属性を利用できます。

内容

[22] hgroup 要素の内容モデルは、1つ以上の hn 要素とスクリプト支援要素とされています >>21。

[42] 見出し以外の内容を含められないことに注意が必要です。 そのような場合は、 header 要素が適切でしょう。

DOM インターフェイス

[27] 要素インターフェイスは、 HTMLElement です >>21。

処理

[44] 文書のアウトラインの検出では、 hgroup 要素全体が1つの見出し扱いになり、 その子供の hn 要素はその一部であるという以外にアウトラインに影響しません。

[45] hgroup 外に h1 と h2 が並んでいれば、 h1 で始まる章の中に h2 で始まる節が含まれていることになります。 しかし hgroup 内にあるなら、 hgroup 全体で1つの章の見出しを表すことになります。

階数

[31] hgroup 要素の階数rankは、次のように定義されます >>21。

  1. [32] 子孫に hn 要素があれば、 その最大の階数とします。
  2. [33] なければ、 h1 要素の階数とします。

歴史

header 要素からの改称

[28] hgroup 要素は、第2次 header 要素 (HTML5 初期に追加されたもの) を改称する形で追加されました。

改称までの歴史は header 要素の項を参照してください。

W3C の乱

[1] Bug 11731 – Replace <hgroup> element with a <subhead> element used as the child of the <hx> element ( ( 版)) http://www.w3.org/Bugs/Public/show_bug.cgi?id=11731

[2] Web Applications 1.0 r6052 remove <hgroup> from the w3c spec by request of steven faulkner ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6051&to=6052

[3] Web Applications 1.0 r6064 revert change per http://lists.w3.org/Archives/Public/public-html/2011May/0061.html ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6063&to=6064

[4] IRC logs: freenode / #whatwg / 20110504 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20110504

[5] Web Applications 1.0 r7234 Let tools decide how to render <hgroup>s in ToCs and so on. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7233&to=7234

[6] IRC logs: freenode / #whatwg / 20121004 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20121004

[7] IRC logs: freenode / #whatwg / 20121207 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20121207#l-387

[8] Web Applications 1.0 r7616 Add support for automatic sizing of headings in <hgroup> if they follow <h1>. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7615&to=7616

[9] WG Decision on request to drop hgroup from HTML5 ( (Paul Cotton 著, 版)) http://lists.w3.org/Archives/Public/public-html-admin/2013Apr/0003.html

[10] IRC logs: freenode / #whatwg / 20130402 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130402#l-269

[11] IRC logs: freenode / #whatwg / 20130403 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130403

[12] 4.13 Common idioms without dedicated elements — HTML 5.1 Nightly ( ( 版)) http://www.w3.org/html/wg/drafts/html/master/common-idioms.html#sub-head

[13] IRC logs: freenode / #whatwg / 20130529 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130529

[14] IRC logs: freenode / #whatwg / 20130604 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130604#l-78

[15] IRC logs: freenode / #whatwg / 20130904 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130904#l-891

[16] IRC logs: freenode / #whatwg / 20131128 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20131128

[17] IRC logs: freenode / #whatwg / 20140117 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20140117

[46] W3C の主張を真に受けて hgroup 要素は廃止されたなどと説明する人がいるので、 要注意です。

template 要素への対応

[35] template 要素の導入時にスクリプト支援要素が子供として使えるようになりましたが、 script 要素を認める必然性はないとして、削除されました >>18, >>19。 template 要素はその後も認められています。

  • [18] Bug 25572 – Don't remove script elements when checking noscript (hgroup content model) ( ( 版)) https://www.w3.org/Bugs/Public/show_bug.cgi?id=25572
  • [19] Web Applications 1.0 r8695 Catch up with recent changes that were made while the pipeline was down. Sorry for jamming all these changes into one patch. ( ( 版)) http://html5.org/r/8695

[36] Web Applications 1.0 r8759 Add some examples of app-like usages to increase example variety ( ( 版)) http://html5.org/r/8759

[37] 28077 – many sites, including the w3 validator, state that the hgroup element is obsolete. there is no mention of such thing here in the documentation so it is not clear whether it can be used or not. ( 版) https://www.w3.org/Bugs/Public/show_bug.cgi?id=28077

[38] IRC logs: freenode / #whatwg / 20150828 ( 版) http://krijnhoetmer.nl/irc-logs/whatwg/20150828#l-878

[39] Add examples of <hgroup> with alternative titles (sideshowbarker著, ) https://github.com/whatwg/html/commit/648ae64bb6cf61487bee534df2107c33bbd9dcbe

[40] Editorial: hgroup makes multi-level heading in outline (sideshowbarker著, ) https://github.com/whatwg/html/commit/bd6758b8b7273ac4c025cd561178922aeff25f53

[41] Editorial: Drop mention of <hgroup> “masking” subheadings (sideshowbarker著, ) https://github.com/whatwg/html/commit/688809456fe566f49f9015d7c0ffe0b0cadb0317

[47] 民泊法、来年6月施行 宙に浮く監視法案 衆院選で審議に遅れ :日本経済新聞 () https://www.nikkei.com/article/DGKKZO22666030U7A021C1EE8000/

<div class="cmn-section cmn-indent " itemscope itemtype="http://schema.org/NewsArticle">

<h1 class="cmn-article_title cmn-clearfix" itemprop="headline">

<span class="cmnc-middle JSID_key_fonthln">民泊法、来年6月施行 宙に浮く監視法案</span>

<span class="cmnc-small JSID_key_fonttxt">衆院選で審議に遅れ</span>

<span class="cmnc-small JSID_key_fonttxt"></span>

</h1>

[48] google-api-javascript-client/jsclient.html at master · google/google-api-javascript-client () https://github.com/google/google-api-javascript-client/blob/master/io-2012-slides/jsclient.html

[49] Allow <script> inside <hgroup> (annevk著, ) https://github.com/whatwg/html/commit/9bc8dee5ace8a8c01b9a621b4cda3377867065f1

[50] [c] (3) Make <script> be accepted in most places <template> is now ac… (Hixie著, ) https://github.com/whatwg/html/commit/c9a38bd7dc5cdf19b479566a0e1ed0a57d27c6c2

[51] [acgiowt] (2) Catch up with recent changes that were made while the p… (Hixie著, ) https://github.com/whatwg/html/commit/d2021df727adb22ee6d4c7e7968aa5abbd93a307

[52] Allow <script> inside <hgroup> by annevk · Pull Request #3383 · whatwg/html () https://github.com/whatwg/html/pull/3383

[53] 天ノ岩座神宮 (あまのいわくらじんぐう) - 神社巡りジャパン (https://jinjamegurijapan.jp著, ) https://jinjamegurijapan.jp/detail.php?id=704

<div class="title-summary">

<h2>天ノ岩座神宮</h2>

<h3>(あまのいわくらじんぐう)</h3>

<blockquote>

[54] 世帯と人口(年齢別) - データセット - 東京都オープンデータカタログサイト, https://catalog.data.metro.tokyo.lg.jp/dataset/t131202d0000000004
    <hgroup class="header-image navbar-left">
       
<a class="logo" href="https://portal.data.metro.tokyo.lg.jp"><img src="/tokyo_od_theme/images/tokyo-od-logo.png" alt="東京都オープンデータカタログサイト" title="東京都オープンデータカタログサイト" /></a>
 
    </hgroup>