[18] [DFN[[CODE(HTMLe)@en[figure]]]] [[要素]]は、 [[図]]を表します。 * 意味 [23] [CODE(HTMLe)@en[figure]] [[要素]]は図表を表すために使うことができます。 図表には一般的に「図1. 小学生の平均身長」のような題名が付されていることが多いですが、 [CODE(HTMLe)@en[figure]] [[要素]]はそうでなくても使うことができます。 [24] ここでいう図表というのは、 [CODE(HTMLe)@en[img]] [[要素]]や [CODE(HTMLe)@en[table]] [[要素]]という意味ではありません。[[文書]]の一部を構成するものの[[本文]]自体には含まれないような独立した部分であれば、 広く用いることができます。具体的には、[[写真]]、[[表]]、 [[詩]]、[[プログラムコード]]、[[引用文]]、[[列挙]]、 [[公式]]や[[定理]]を含む[[数式]]や[[化学式]]、 [[ASCIIアート]]、[[地図]]などに使えます。 [25] [[雑誌]]や[[論文]]などでは、図表は[[本文]]の流れから離れて[[ページ]]の端などにまとめる形で[[配置]]される場合があります。 しかし [CODE(HTMLe)@en[figure]] [[要素]]はそうした表示方法に限定されるものではなく、 通常の [[CSS]] の指定により任意の方法で表示できます。 もちろん [CODE[float]] などで[[本文]]とは離して表示することもできますし、 何も指定せず[[本文]]の流れの中で表示することもできます。 [CODE[display: fixed]] など[[紙媒体]]とは異なる手法で表示しても構いません。 ;; [26] [[ページ]]の最後に関連事項の[[コラム]]が付属している場合のように、 図表とは違って[[本文]]との関係性が強くない場合には、 [CODE(HTMLe)@en[aside]] [[要素]]を使うことができます。 ;; [27] 他の[[HTML要素]]同様に、 [CODE(HTMLe)@en[figure]] [[要素]]は必ず使わなければならないというものではありません。 [[著者]]が図表だと判断すれば使うことができますし、図表とは思わない、 図表と明示する必要性が薄いと判断すれば [CODE(HTMLe)@en[figure]] [[要素]]を使わなくて構いません。 [CODE(HTMLe)@en[figure]] [[要素]]を使うべきか迷うのであれば、使わなくて構いません。 * 内容 [32] [CODE[figcaption]] [[要素]]を先頭または末尾のいずれかに高々 1つ置くことができます。 ;; [33] [[論文]]などでは、 [[表題]]は上側、[[図題]]は下側といった[[スタイルガイド]]が定められていることがあります。 しかし [[HTML]] ではそうした内容に依存した制約はありません。 * [CODE[imggroup]] 要素 (DTBook) [36] [[HTMLもどき]]の [[DTBook]] には [DFN[[CODE[imggroup]]]] [[要素]]があります。 [38] [[HTML]] とほぼ同じ [CODE[img]] [[要素]]があってそのまま使うこともできますが、 [CODE[imggroup]] [[要素]]でいくつかグループ化したり、 [CODE[caption]] や [CODE[prodnote]] と組み合わせたりできました。 [39] 後の [[HTML]] の [CODE[figure]] / [CODE[figcaption]] を先取りした形といえます。 - [37] [CITE@en-US[DAISY ANSI/NISO Z39.86-2002 - The DAISY Consortium]], [TIME[2023-11-26T05:17:33.000Z]] * 関連 [34] [[表]]については、 [CODE[table]] [[要素]]と [CODE[caption]] [[要素]]があります。これは [CODE[figure]] [[要素]]の特殊ケースとも言えます。 [35] [CODE[fig]] [[要素]]とは異なります。 * 歴史 [40] [TIME[1994-04-07]]に HTML DTD に追加されました。 現在の [CODE[figure]] に相当すると思われます。 しかしこのとき限りの実験に終わり、以後の DTD には出現しません。 [FIG(data)[ [216] [[HTML要素概説]] :[F[要素名]]:[CODE[fig]] :日付:[TIME[1994-04-07]] :説明: [TIME[1994-04-07]]、 [[HTML DTD]] に [CODE[fig]] が追加された。 現在の [CODE[figure]] に当たると思われる。 [SEE[>>43]] [SRC[HTML19940407]] :注釈: - [43] しかしこのとき限りに終わり、以後の [[HTML DTD]] に出現しない。 ]FIG] [FIG(data)[ [284] [[HTML要素概説]] :[F[要素名]]:[CODE[fig]] :[F[要素名]]:[CODE[caption]] :日付:[TIME[1995-12-20]] :説明: [TIME[1995-12-20]]版 [CITE@en[HTML3 Linking and Embedding Model]] に、 [CODE[fig]], [CODE[caption]] が将来拡張案として示されている。 [CODE[insert]] と併用する。 [SRC[>>44]] 現在の [CODE[figure]], [CODE[figcaption]], [CODE[object]] に当たる。 :出典: [REFS[ - [44] [CITE@en[HTML3 Linking and Embedding Model]], [DATA(.author)[[[W3C]]]], [DATA(.status)[Working Draft]], [TIME(.published)[20-Dec-95][1995-12-20]], [TIME[1999-02-04T17:57:09.000Z]], [TIME[2024-08-15T07:38:59.446Z]] ]REFS] ]FIG] ** HTML5 [41] [CITE@en[the figure element and associated trappings]], [[Hixie]], [TIME[2006-11-28 07:22:02 +09:00]], [TIME[2024-09-01T12:29:49.000Z]] [FIG(data)[ [42] [[HTML要素概説]] :[F[要素名]]:[CODE[figure]] :日付:[TIME[2006-11-28]] :説明: [TIME[2006-11-28]]、 [CITE[HTML5]] に [CODE[figure]] が追加された。 現行仕様である。 :出典: [REFS[ - [CITE[HTML5 r365]], [DATA(.author)[[[Hixie]]]], [TIME(.published)[2006-11-28 07:22:02 +09:00]], [TIME[2024-09-01T12:29:49.000Z]] ]REFS] ]FIG] [1] [CITE[Re: several messages about
and related subjects]] ([[Ian Hickson ]] 著, [TIME[2008-02-25 22:42:29 +09:00]] 版) ([[名無しさん]]) [2] [CITE[IRC logs: freenode / #whatwg / 20091219]] ([TIME[2010-01-05 22:40:48 +09:00]] 版) [14] [CITE[IRC logs: freenode / #whatwg / 20100107]] ([TIME[2010-01-09 14:17:58 +09:00]] 版) [3] [CITE[''''''[''''''whatwg'''''']'''''' Various threads with feedback on HTML elements]] ( ([TIME[2013-10-16 00:30:44 +09:00]] 版)) [4] [CITE@en[(X)HTML5 Tracking]] ([TIME[2010-01-30 21:19:42 +09:00]] 版) [5] [CITE@en[Web Applications 1.0 r7991 Broaden the possible use case for
.]] ( ([TIME[2013-06-20 03:53:00 +09:00]] 版)) [6] [CITE@en[Web Applications 1.0 r3859 Parser changes: , , are now treated differently. Styling changes: , , , and
are now treated differently. Semantic changes: Dropped .
and
now use
/
instead of . Editorial changes: Added a section on how to mark up conversations, moved the sections on footnotes and tag clouds around. Updated lots of examples. Validator changes: Changed rules for missing alt='' given the new elements.]] ( ([TIME[2009-09-15 20:09:00 +09:00]] 版)) [7] [CITE@en[Web Applications 1.0 r8550 Adjust how
gives captions to s to exclude cases where s are not alone]] ( ([TIME[2014-03-18 05:14:00 +09:00]] 版)) [FIG(quote)[ [FIGCAPTION[ [8] [CITE@ja[年賀状のサルを12年前と比べてみたら...デザイナーは同じ人、ヒツジでも話題に]] ([TIME[2015-12-31 14:23:03 +09:00]] 版) ]FIGCAPTION] > >
> >
> $USERNAME ]FIG] [FIG(quote)[ [FIGCAPTION[ [9] [CITE@ja[時事ドットコム:文化庁の京都移転有力に=「一部機能」軸に検討-政府]] ([TIME[2015-12-31 14:45:39 +09:00]] 版) ]FIGCAPTION] > >
>
>
> >
政府機関の地方移転で、有力候補とされる文化庁が入る合同庁舎=22日、東京都千代田区
>
>
>

> 政府は年明け以降、 ]FIG] [FIG(quote)[ [FIGCAPTION[ [10] [CITE@ja[【今日は何の日?】あこぎという駅が開業 | 乗りものニュース]] ([TIME[2015-12-31 15:08:32 +09:00]] 版) ]FIGCAPTION] > 駅名は「あこぎ」と読みます。

>
阿漕駅は津駅の隣にある(2013年4月、恵 知仁撮影)。

「あこぎ」という単語には ]FIG] [FIG(quote)[ [FIGCAPTION[ [11] [CITE[【茨城新聞】つくばみらい・陽光台小披露 木を多用、開放感]] ( ([TIME[2016-05-27 19:05:42 +09:00]])) ]FIGCAPTION] > >

>
廊下側の壁が三角形に空いている教室を見学する内覧会の参加者=陽光台小
>
廊下側の壁が三角形に空いている教室を見学する内覧会の参加者=陽光台小
>
]FIG] [FIG(quote)[ [FIGCAPTION[ [12] [CITE@ja[HTML5における
タグの使い方 | UX MILK]] ( ([TIME[2016-06-03 15:39:11 +09:00]])) ]FIGCAPTION] >
タグは、図や表などをグループ化する際に使用します。 > 同じように画像などをマークアップするものに、

タグがありましたが、HTML5からは、図や表は

でマークアップすることでより文章構造として正しいマークアップが可能になり、推奨されています。ただし、
を使えるのは、独立している自己完結できる内容に限定されます。独立している内容というのは、たとえ違うページにあったり、ページのどこにあっても、コンテンツが成り立っている状態のものです。 > 画像などであっても、文章などから独立しておらず、前後のコンテンツがないと成り立たないものの場合は、
タグではなく、

タグを利用する必要があります。 ]FIG] [13] >>12 本文読んでも「グループ化」の意味がわからなかった。 [[開始タグ]]と[[終了タグ]]で囲むことを「グループ化」と呼ぶのだろうか? [15] >>12 どこで誰が「推奨」しているのかわからない (少なくても [[HTML Standard]] では無さそう)。「独立」していなければ [CODE(HTMLe)@en[p]] を使え、 というのもよくわからない。 [FIG(quote)[ [FIGCAPTION[ [16] [CITE@ja[8月23日からタイ標準時を導入 | チエンマイブログ日々雑感]] ( ([TIME[2016-06-03 22:48:43 +09:00]])) ]FIGCAPTION] > >

バンコク週報、タイの情報【社会】
海軍・河海測量局がタイ標準時を決定・管理することが決まり、国内のテレビ・ラジオ局などは8月23日からこの標準時に従うことが義務づけられた。……..以下略…………
>

明日からですが……….これでズレが無くなるのかな?

]FIG] [17] [CITE@en[match the W3C in preferring `footer`s instead of `figcaption`s to give attribution for `blockquote`s in `figure`s · Issue #1650 · whatwg/html]] ([TIME[2016-08-11 10:42:40 +09:00]]) [19] [CITE@en[Expand on example and other ways of referencing]] ([[domenic]]著, [TIME[2017-07-18 04:03:25 +09:00]]) [20] [CITE@en[dfn what it means for elements to be “referenced” by sideshowbarker · Pull Request #2841 · whatwg/html]] ([TIME[2017-07-18 21:13:14 +09:00]]) [21] [CITE@en[dfn what it means for elements to be “referenced” by sideshowbarker · Pull Request #2841 · whatwg/html]] ([TIME[2017-07-18 21:15:53 +09:00]]) [22] [CITE@en[dfn what it means for elements to be “referenced”]] ([[sideshowbarker]]著, [TIME[2017-07-15 19:05:30 +09:00]]) [28] [CITE@en[25552 – Shouldn't
also allow intermixed script-supporting elements (before/after the
)?]] ([TIME[2017-07-24 15:36:27 +09:00]]) [29] [CITE@en[updated figure mapping to reflect figure role in core-aam]] ([[stevefaulkner]]著, [TIME[2017-11-23 21:40:02 +09:00]]) [30] [CITE@en[figure/figcaption sparse flow content not valid · Issue #2450 · whatwg/html]] ([TIME[2018-01-18 13:28:25 +09:00]]) [31] [CITE@en[Restrict the main element to be used once per document]] ([[annevk]]著, [TIME[2018-01-23 17:10:16 +09:00]])