引用元をHTMLで示す方法:W3Cではblockquote要素の中に出典や引用元を使用できるみたい

ブログ運営

引用をする時に使用する<blockquote>要素。

その際に”引用元”をどのように記述すればよいのか、そのmarkupの仕方がわからなかった為、HTMLの仕様書を読んでみました。

結論として、W3Cの定めるHTML5.1と、WHATWGの定めるHTML Standardで仕様が異なるようでした。

“厳密には”、引用元は引用ではない

あくまでblockquote要素に含めるべきは引用文なわけです。引用元情報/出典元というのは、厳密にはいえば引用文そのものではありません。

その為、あくまで”あるべき論”でいえば、引用元をblockquote要素内に含めるべきではありません。

しかし、現実問題、blockquote要素内に引用元をマークアップしているサイトは多数ありますし、figure要素の無かった時代との後方互換性を考えると、blockquote要素内に引用元を含めるべきという考え方もあります。

結果として、

  • W3Cはblockquote要素内に引用元を含めることを認めている
  • WHATWGはblockquote要素内に引用元を含めることを認めていない

というスタンスとなっているようです。

W3Cではfooter要素かcite要素内であればblockquote要素内に入れてよい

W3CのHTML 5.1には以下のような記述があります。

Attribution for the quotation, may be be placed inside the blockquote element,
but must be within a cite element for in-text attributions or within a footer element.

HTML 5.1より

footer要素内やcite要素内(must be within a cite element for in-text attributions or within a footer element)であれば、blockquote要素内に置いても良い(may be placed inside the blockquote element)と書かれてますね。

色々とEXAMPLEが紹介されていますが、EXAMPLE13, 14に以下のコードが掲載されています。

<blockquote>
  <p>I contend that we are both atheists. I just believe in one fewer
  god than you do. When you understand why you dismiss all the other
  possible gods, you will understand why I dismiss yours.</p>
  <footer>— <cite>Stephen Roberts</cite></footer>
</blockquote>
<blockquote>
  The people recognize themselves in their commodities; they find their
  soul in their automobile, hi-fi set, split-level home, kitchen equipment.
  — <cite><a href="https://en.wikipedia.org/wiki/Herbert_Marcuse">Herbert Marcuse</a></cite>
</blockquote>

引用文はもちろんblockquote要素で囲む。

問題の引用元については、この通り、footer要素やcite要素内であれば、blockquote要素に含めて使用することが認められているようです。

The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a footer or cite element, and optionally with in-line changes such as annotations and abbreviations.

Content inside a blockquote other than citations and in-line changes must be quoted from another source, whose address, if it has one, may be cited in the cite attribute.

WHATWGではfigureとfigcaptionを使用する

対して、WHATWGではこの記載の仕方を許容する文言を見つけることはできません。

Content inside a blockquote must be quoted from another source, whose address, if it has one, may be cited in the cite attribute.

HTML Standardより

というより、以下の通り「引用元はblockquote要素の外にかけ」とはっきり名言されています。

Attribution for the quotation, if any, must be placed outside the blockquote element.

では、WHATWGでは引用元をどのように書けばよいのか?という話になるわけです。

HTML Standardに色々とEXAMPLEが示されていますが、以下のEXAMPLEが現実的でした。

<figure>
 <blockquote>
  <p>The truth may be puzzling. It may take some work to grapple with.
  It may be counterintuitive. It may contradict deeply held
  prejudices. It may not be consonant with what we desperately want to
  be true. But our preferences do not determine what's true. We have a
  method, and that method helps us to reach not absolute truth, only
  asymptotic approaches to the truth — never there, just closer
  and closer, always finding vast new oceans of undiscovered
  possibilities. Cleverly designed experiments are the key.</p>
 </blockquote>
 <figcaption>Carl Sagan, in "<cite>Wonder and Skepticism</cite>", from
 the <cite>Skeptical Inquirer</cite> Volume 19, Issue 1 (January-February
 1995)</figcaption>
</figure>

引用文はblockquoteに入れ、引用元はfigcaptionに入れる。そしてそれらをfigure要素で囲む。

この書き方であればW3Cにも違反しないわけですが、マークアップは面倒くさくなりますね…。

そしてcite要素もW3CとWHATWGで異なる

更に困ったことに、cite要素の考え方が両者で異なるようです。

W3CのHTML 5.1によるとcite要素は以下のように記述されており、

The cite element represents a reference to a creative work. It must include the title of the work or the name of the author (person, people or organization) or an URL reference, or a reference in abbreviated form as per the conventions used for the addition of citation metadata.

WHATWGのHTML Standard 日本語訳によると、以下のように記述されている。

cite要素は、作品(たとえば、本、新聞、エッセイ、詩、楽譜、歌、脚本、映画、テレビ番組、ゲーム、彫刻、絵画、映画、演劇、オペラ、ミュージカル、展示、訴訟事例報告、コンピュータープログラムなど)のタイトルを表す。これは、引用されるまたは詳細に参照される(すなわち引用文)作品かもしれず、またはそれは単に通りがかりに記載される作品かもしれない。

人名は作品のタイトルではない―たとえ人々がその人を作品の一部とみなすとしても―したがって要素は人名をマークアップするために使用してはならない。(一部の場合、b要素が名前に対して適切であるかもしれない。たとえば、有名人の名前が注意を引くために別のスタイルを使用してレンダリングされるキーワードであるようなゴシップ記事において。他の例では、要素が本当に必要である場合、span要素を使用できる。)

すなわち、W3Cでは作品タイトルだけでなく作者名やURL参照等も使用可能であるのに対し、WHATWGでは作品タイトルのみ認められている(特に、作者名に対しては使用できない旨が明示されている)。

結局どのようにマークアップすればよいのか

仕様が統一されていないとか勘弁してほしいですね。迷っちゃいますね… どうしようかなぁ。

少なくともWHATWGの方が厳しいルールを定めており、W3Cでも通用するルールですから、面倒くさくなければWHATWGに従えばいいですね。

Attribution for the quotation, may be be placed inside the blockquote element,
but must be within a cite element for in-text attributions or within a footer element.

HTML 5.1

このようにblockquoteの外に引用元が出る形で記載するわけです。こんなマークアップをしています。

<figure>
  <blockquote cite="https://www.w3.org/TR/html51/grouping-content.html#the-blockquote-element">
    <p>
      Attribution for the quotation, may be be placed inside the <code>blockquote</code> element, 
      but must be within a <code>cite</code> element for in-text attributions or within a <code>footer</code> element.
    </p>
  </blockquote>
  <figcaption>
      - <cite>HTML 5.1</cite>
  </figcaption>
</figure>

W3CにもWHATWGにも言えることですが、blockquoteのcite属性にURL載せる意味ね…笑

誰のために文章書いているかって、コンピューターの為じゃなくて人間の為ですからね。LaTeXみたいに勝手にビブリオグラフィを作ってくれるならまだ考えますが、現状の仕様だとcite属性にURL載せようとは絶対に思わないな。

話がそれましたが、W3Cが認めている方法を使えばこんな感じになりますね。

Attribution for the quotation, may be be placed inside the blockquote element,
but must be within a cite element for in-text attributions or within a footer element.

blockquoteの中に引用元が見える。こんなマークアップをしています。

<blockquote>
  <p>
    Attribution for the quotation, may be be placed inside the <code>blockquote</code> element, 
    but must be within a <code>cite</code> element for in-text attributions or within a <code>footer</code> element.
  </p>
  <footer>
    - <cite><a href="https://www.w3.org/TR/html51/grouping-content.html#the-blockquote-element">HTML 5.1</a></cite>
  </footer>
</blockquote>

念のため、HTML 5.2のWorking Draftの方を見てもこの書き方は許容されているようです。しかし、前述の通りWHATWGでは認められていない書き方になります。

しっかり書きたい方はfigureとfigcaptionを使ったほうがよさそうですね。

しかし、私のような泡沫ブロガーであれば、結局のところ、『引用元の情報が、引用文に含まれてしまっていること』に対して、自分自身気持ち悪くないかどうか… を考えて決めてしまえばいい気がしますね。

気持ち悪ければfigureで囲み、気持ち悪くなければblockquote内にfooter作ってそこに書く。

仕様レベルでバラバラになってしまっているのだから、自分がどう考えるのか、自分のスタンスに近い方をとればいいよ…もう(はなほじ

この件については、HTML5 Doctor(cite and blockquote – reloaded | HTML5 Doctor)のコメント欄でも色々と賛否両論書き込まれていますね。


最上部へ戻る