Updated / Published

cite要素(citation)は出典元や引用元など他のリソース(情報資源)の参照を明示します。出典元や引用元のリソースはウェブ上のものだけを示すのに限らず、書籍や論文など紙媒体を示す場合にも使われます。視覚環境のUAにおけるデフォルトの表示は要素内のテキストをイタリック体(斜体)で表示します。

バージョン
  • HTML4.01(S,T,F)
  • XHTML1.0(S,T,F)
  • XHTML1.1
要素分類
インライン要素
開始タグ
必須
終了タグ
必須
非推奨
-
内容モデル

cite要素に指定できる属性

共通属性
イベント属性

引用を示す要素と組み合わせる場合

引用を示す場合は、ブロックレベル要素を含む・含まないに応じてblockquote要素、またはq要素を用いることになります。blockquoteq要素では、cite属性で引用元のURI(リソースの所在や名前)と、title属性で引用元の説明情報を示すことになっているのですが、主要な視覚環境のUAにおいてはcite属性、title属性で示された情報が視覚的に表され、それをハイパーリンク等で利用できるようにはなっていません。

そこで、cite要素と組み合わせて視覚的に出典元や引用元を示したい場合、blockquote要素やq要素内に引用ではない出典元・引用元についての情報を含めることなく、それでいて引用のブロックとして関連付けられるようなマーク付けをおこなうのが妥当です。

<p class="quote"><cite>HTML 4.01 Specification</cite>にはcite要素について
<q cite="http://www.w3.org/TR/html401/struct/text.html#h-9.2.1" title="9.2.1 Phrase elements">
Contains a citation or a reference to other sources
</q>と説明があります。</p>
<dl class="quote">
<dt>Barack Obama氏の<cite>2004年7月27日 民主党全国大会 基調演説</cite>より抜粋</dt>
<dd>
    <blockquote title="Barack Obama氏の2004年7月27日 民主党全国大会 基調演説">
    <p>I say to them tonight, there's not a liberal America and a conservative America.</p>
    <p>There's the United States of America.</p>
    <p>There's not a black America and white America and Latino America and Asian America.</p>
    <p>There's the United States of America.</p>
    </blockquote>
</dd>
</dl>

また、blockquote要素においては上記のサンプルのような示し方をスクリプトを通して実現できる、blockquote要素単体から引用元を視覚化するスクリプトも公開していますので、参考にしてみてください。

HTML5のcite要素

これまでcite要素は定義が曖昧であったため、制作者によって認識、及びその使用方法がバラバラでした。そのため、HTML5ではcite要素は引用の有無に関らず広く用いられる事を想定し、書籍や詩、映画、テレビ番組、演劇、ミュージカルなどのタイトルやテーマを示すと定義が変更されました。これまで使用方法がバラバラであったために、人名や出版元の会社名なども含めてマークされていることが多かったのですが、人名や会社名はタイトルやテーマではないので、cite要素には含めるのは適切ではありません(人名や会社名をマーク付けする必要があるとすれば、b要素を用いるのが妥当でしょう)。

間違った使用例

これは人名までcite要素内に含められている間違った使い方の例です。

<p><q>ああ、ロミオ。どうしてあなたはロミオなの?</q>は、<cite>ウィリアム・シェイクスピアの戯曲ロミオとジュリエット</cite>に出てくる有名なセリフです。</p>

正しい使用例

cite要素は、戯曲の題名を示すために使用し、作家名はb要素にclass属性を伴って、作家名のキーワードであることを示した例です。

<p><q>ああ、ロミオ。どうしてあなたはロミオなの?</q>は、<b class="author">ウィリアム・シェイクスピア</b>の戯曲<cite>ロミオとジュリエット</cite>に出てくる有名なセリフです。</p>