HTML の引用マークアップとは何ですか?

HTMLの引用タグについて

HTMLでは、文章中に引用を正しくマークアップするために、いくつかのタグが用意されています。本稿では、その中でも特に重要な「引用符タグ」について詳しく解説します。

引用符タグの種類

HTMLでは、主に以下の2種類の引用符タグが使用されます。

タグ	説明	使用例	表示例
<q>	短い引用をマークアップする	<p>彼女は<q>`おはよう`</q>と挨拶した。</p>	彼女は「おはよう」と挨拶した。
<blockquote>	長い引用、または段落全体を引用する	<blockquote><p>これは長い引用の例です。複数行に渡って引用することができます。</p></blockquote>	これは長い引用の例です。複数行に渡って引用することができます。

<blockquote>
<p>これは長い引用の例です。複数行に渡って引用することができます。</p>
</blockquote>

<q>タグは、文章中における短い引用、特に一行で完結するような引用をマークアップするために使用されます。ブラウザは通常、<q>タグで囲まれた部分を自動的に二重引用符（" "）で囲んで表示します。

使用例:

<p>彼は<q>明日こそ頑張る</q>と決意した。</p>

表示例:

彼は「明日こそ頑張る」と決意した。

<blockquote>タグは、長い引用や段落全体の引用をマークアップするために使用されます。ブラウザは通常、<blockquote>タグで囲まれた部分をインデントして表示します。

使用例:

<blockquote>
  <p>これは長い引用の例です。複数行に渡って引用することができます。</p>
  <p>引用部分を明確に区別するために、インデントが適用されます。</p>
</blockquote>

表示例:

これは長い引用の例です。複数行に渡って引用することができます。

引用部分を明確に区別するために、インデントが適用されます。

<q>タグと<blockquote>タグには、引用元を明記するためのcite属性を指定することができます。cite属性には、引用元となるWebページのURLなどを指定します。ただし、cite属性は引用元を記述するためのメタデータであり、ブラウザ上には表示されません。

使用例:

<p>アインシュタインは、<q cite="https://www.example.com/einstein">想像力は知識よりも重要である</q>と言った。</p>

HTMLでは、<q>タグと<blockquote>タグを用いることで、短い引用と長い引用をそれぞれ適切にマークアップすることができます。これらのタグを使い分けることで、文章の可読性を高め、引用部分を明確に示すことが可能になります。

Q1: <q>タグと二重引用符（" "）の違いは何ですか？

A1: <q>タグは、引用部分をHTMLとして意味的にマークアップする際に使用します。一方、二重引用符は、あくまで視覚的な記号として機能します。HTMLとして意味を明確にするためには、<q>タグを使用することが推奨されます。

Q2: <blockquote>タグの中に他のHTMLタグを含めることはできますか？

A2: はい、<blockquote>タグの中に段落タグ(<p>)などを含めて、引用部分を構造化することができます。

Q3: cite属性で指定した引用元は、ブラウザ上にどのように表示されますか？

A3: cite属性は、ブラウザ上に直接表示されるわけではありません。cite属性は、検索エンジンや支援技術などが引用元情報を取得するために使用されます。