定義と使用方

cite属性は、
引用文や変更内容の出典を示すURL値を持ちます。

この属性は、<q>、<blockquote>、 <ins>、<del> などのタグで使用され、
引用文や変更内容の出典情報を提供することで、情報の信頼性を高め、ウェブページの作者や検索エンジンなどがこの情報を活用できます。

基本の例

HTML 
<p>
    ティム・バーナーズ＝リーが述べました。
    <q cite="https://example.com/example">
        インターネットはすぐに人権です
    </q>
</p>
ブラウザで実際に表示された様子

cite属性の適用要素と用途

cite属性の適用要素と用途
<q> 引用された情報の元となる文書やメッセージを示すURLです。
<blockquote> 引用された情報の元となる文書やメッセージを指定するURLです。
<ins> 追加された内容に関する説明を提供するリソースのURLです。
<del> 削除された内容に関する説明を提供するリソースのURLです。

cite属性は必ずしも必要な属性ではありません。ユーザーがウェブページを閲覧する際にはcite属性の値は表示されません。しかし、cite属性を使用することで、引用文や変更内容の出典を明示的に提供でき、情報の信頼性を高めるとともに、ウェブページの作者、ウェブ開発者、検索エンジンなどがこの情報を活用できます。

使用例

cite属性が<q>、<blockquote>、 <ins>、<del>タグでどのように使用されるか、例で確認してみましょう！

<q>でのcite属性使用例

HTML 
<p>
    次は有名な名言です。
    <q cite="https://www.brainyquote.com/quotes/albert_einstein_100134">
        想像力は無限である。知識には限りがある。
    </q>
</p>
ブラウザで実際に表示された様子

上の例では、cite属性が<q>タグに引用された情報の元となる文書ページのURLを提供しています。

<blockquote>でのcite属性使用例

HTML 
<p>次はウィキペディアからの引用です。</p>
<blockquote cite="https://ja.wikipedia.org/wiki/Romeo_and_Juliet">
    <p>
        シェイクスピアの『ロミオとジュリエット』は、アーサー・ブルックの叙事詩『ロミオとジュリエットの悲劇』を基にしたものです。
        アーサー・ブルックの叙事詩は1562年に出版されました。
        シェイクスピアはアーサー・ブルックの叙事詩から筋書きを取りました。
        しかし、多くの登場人物や細部の物語はシェイクスピアの独創的な創作です。
    </p>
</blockquote>
ブラウザで実際に表示された様子

上の例では、cite属性が<blockquote>タグに引用された情報の元となる文書ページのURLを提供しています。

<ins>でのcite属性使用例

HTML 
<p>
    最新のアップデートに関する説明です。
    <ins cite="https://example.com/changelog">
        最新のアップデート内容.....
    </ins>
</p>
ブラウザで実際に表示された様子

上の例では、cite属性が<ins>タグに元のリソースである「最新アップデート内容」ページのURLを提供しています。

<del>でのcite属性使用例

HTML 
<p>
    次の機能は削除されました。
    <del cite="https://example.com/changelog">
        削除された機能の詳細.....
    </del>
</p>
ブラウザで実際に表示された様子

上の例では、cite属性が<del>タグに元のリソースである「削除された機能の詳細」ページのURLを提供しています。

ブラウザ互換性

cite属性は、各要素に対して次のようなブラウザ互換性があります。

cite属性のブラウザ互換性
属性
デスクトップ Chrome
Chrome
デスクトップデスクトップ Edge
Edge
デスクトップ Firefox
Firefox
Safari
Safari
<q> cite 1 12 1 3
<blockquote> cite 1 12 1 4
<ins> cite 1 12 1 3
<del> cite 1 12 1 4

仕様書

cite属性の仕様書
仕様書
<q> cite HTML Standard
#attr-q-cite
<blockquote> cite HTML Standard
#attr-blockquote-cite
<ins>,<del> cite HTML Standard
#attributes-common-to-ins-and-del-elements

参考資料

関連項目