この内容は古いバージョンです。最新バージョンを表示するには、戻るボタンを押してください。
バージョン:4
ページ更新者:guest
更新日時:2026-06-11 07:07:02

タイトル: q要素
SEOタイトル: HTML q要素(インライン引用 / blockquote との違い / cite属性の使い方)

この記事の要点
  • インライン(短い)引用を表す意味タグ。文章の途中に差し込む形で使う
  • ブラウザが自動で引用符(日本語環境は「」、英語環境は "")を付けてくれる
  • 長文・段落単位の引用は
    、短いインライン引用は という棲み分け
  • cite 属性に出典 URL を書ける(画面には出ないが、機械可読なメタデータになる)
  • 見た目だけ引用符が欲しいなら直接「」を書く方がシンプル。意味付けが必要なら

q 要素とは

は HTML のインライン引用 (inline quotation) を表す意味タグです。文章の途中で「誰かの発言や別の文献から短く引用する」場面に使います。ブラウザは中身を引用符で自動的に囲んで表示します。

基本構文

アインシュタインは God does not play dice. と語ったとされる。

表示はブラウザの言語設定に応じて、英語環境なら "God does not play dice."、日本語環境なら 「God does not play dice.」 のように引用符が自動付与されます。

cite 属性 — 出典 URL

cite 属性で引用元の URL を指定できます。画面には表示されませんが、検索エンジンや支援技術がメタデータとして読み取れます。

仕様書では The q element represents some phrasing content quoted from another source. と定義されている。

blockquote との違い

引用を表す要素は

の 2 つで、長さ・位置で使い分けます。

要素長さカテゴリ引用符典型用途
短い(1 文程度)インラインブラウザが自動付与本文中に挟む発言・フレーズ
長い(段落以上)ブロック自動付与なし(CSS や手動で)段落丸ごとの引用、長い文章の抜粋

CSS で引用符をカスタマイズ

ブラウザのデフォルト引用符を変えたい場合は quotes プロパティでスタイル指定します。

q {
  quotes: "\201C" "\201D" "\2018" "\2019";  /* “ ” ‘ ’ */
}
q::before { content: open-quote;  }
q::after  { content: close-quote; }

ネストした引用(引用の中の引用)も quotes プロパティの 2 組目以降で制御できます。

使うべきでないケース

  • 強調したい単語を囲みたいだけ — 引用ではないので を使う。
  • 専門用語の初出 が適切。
  • UI のラベル風に括弧で囲みたい — 引用ではないので素直に「」を書く方が読みやすい。

よくある質問

Q: q を使うと自動で「」が付くのが二重になる
A: 「」を手書きせず、 の中身だけ書くのが正しい使い方です。引用符付与は の役割なので二重になりません。

Q: cite 属性は SEO に効くの?
A: 直接的なランキング要素ではありませんが、Google などの検索エンジンが「この文章は他サイトからの正当な引用」と認識する手がかりになります。コピーコンテンツ判定を避ける意味で書いておくと安心。

Q: 日本語の引用に q は使える?
A: 使えます。ただし日本語の場合は本文中に直接「」を書く方が読みやすいケースも多いので、機械可読性が要らないなら無理に使う必要はありません。