HTML <q>タグ：正しい理解と使い方

定義と使用方

<q>タグは
他の出典から引用した一部の文言を示します。

短いインライン引用文に使用され、ほとんどのブラウザではこのテキストの前後に引用符が付けられ、引用文であることが示されます。

HTML仕様書によると<q>タグは次のように使用する必要があります。

<q>タグを使用する際には、引用符のような記号を<q>タグの内部、外部、または周囲に直接置いてはいけません。これらの記号はブラウザがレンダリング時に自動で処理します。しかし、<q>タグを使用して引用文を表示することは完全に任意です。<q>タグを使用せずに明示的な引用符を使用することも正しい方法です。つまり、どちらの方法もHTMLでは正しい方法とみなされます。
<q>タグ内の内容は他の出典から直接引用したものでなければならず、この出典が存在する場合はcite属性を使用して出典を示すことができます。出典は小説や台本のような架空の出典であっても構いません。

インラインではない独立した引用区間を示す場合は、<blockquote>タグを使用してください。

`<q>`タグの使用と引用符

<q>タグを使用して引用文を表示することは完全に任意です。
<q>タグを使用せずに明示的な引用符を使用することも正しい方法です。 つまり、どちらの方法もHTMLでは正しい方法とみなされます。

HTML <q>タグを使用した引用文の例

<p>
    アルベルト・アインシュタインは述べました。<q>知識の唯一の源は経験です。</q>
</p>

HTML 明示的な引用符を使用した引用文の例

<p>
    アルベルト・アインシュタインは述べました。 "知識の唯一の源は経験です。"
</p>

これら二つの例はどちらも「知識の唯一の源は経験です。」という引用文を示しており、最初の例は<q>タグを使用して表示し、二つ目の例は明示的な引用符を使用して表示しています。これらの方法はいずれもHTML仕様書で正しい方法とみなされます。

`<q>`タグでの`cite`属性の使用方法

cite属性は引用された情報の元となる文書やメッセージを指定するURLです。

<q>タグにcite属性が必ずしも必要なわけではありません。<q>タグで引用する引用文自体が十分に明確であれば、cite属性を使用しなくても構いません。しかし、cite属性を使用すると、<q>タグで引用する引用文の出典を明示的に示すことができ、情報の信頼性を高めることができます。ウェブページの著作者、検索エンジン、ウェブ開発者などがこの情報を活用できます。

HTML

<p>
    次は有名な名言です。
    <q cite="https://www.brainyquote.com/quotes/albert_einstein_100134">
        想像力は無限です。知識は有限です。
    </q>
</p>

上の例を見ればわかるように、cite属性はブラウザ上で特別なスタイルを適用しません。cite属性はブラウザ画面には表示されず、ウェブページのソースコードやウェブ開発者ツールで確認することができます。ユーザーがウェブページを見る際には、cite属性の値は表示されません。

しかし、ウェブページの著作者やウェブ開発者、検索エンジンなどはこの情報を活用することができます。例えば、検索エンジンはcite属性を通じてウェブページのコンテンツの出典情報を収集し、検索結果ページに表示することができます。また、ウェブ開発者やウェブサイト管理者は、ウェブページの内容を追跡し、引用された情報の出典を管理するためにcite属性を使用することができます。

`<q>`と`<cite>`タグの違い

<q>と<cite>タグはどちらも引用を表す際に使用されますが、用途と意味はまったく異なります。

<q>タグは他の出典から引用した一部の文言を示し、citeタグは引用された作品のタイトルまたは名称を示します。

`<cite>`タグ

創作物のタイトル（例えば、書籍、ミュージカル、展示会、判例報告書、コンピュータプログラムなど）を示します。
文書や作品の名前、タイトルなどを強調または識別するために使用されます。citeタグは引用する創作物のタイトルを表示することが主な目的であり、通常はイタリック体で表示されます。

ブラウザ互換性

qタグのブラウザ互換性
タグ	デスクトップ Chrome	デスクトップデスクトップ Edge	デスクトップ Firefox	Safari
`<q>`	1	12	1	3

仕様書

タグの仕様書
仕様書
`<q>`	HTML Standard #the-q-element

参考資料

codingCourses：HTML q Tag – Proper Understanding and Usage

定義と使用方

<q>タグの使用と引用符

<q>タグでのcite属性の使用方法

<q>と<cite>タグの違い

<cite>タグ