blockquoteタグ(引用タグ)とは？htmlの書き方も解説

Web制作初心者の方のなかには、「blockquoteタグとは何か気になっている」「blockquoteタグがいまいちよくわからない」などといった悩みがあるのではないでしょうか。

この記事では、blockquoteタグの概要や使い方、重要性、そしてSEO効果について解説していきます。この記事を読めば、blockquoteタグについて理解ができるため、知識をWeb制作に活かせるようになります。ぜひ最後までお読みください。

監修者

石田 哲也

Twitter：@te2319
株式会社ニュートラルワークス 取締役CMO。1984年生まれ。高校卒業後にISD株式会社を起業。その後、株式会社オプトでWebマーケティングを学び、株式会社メタップスなど複数のベンチャー企業にて事業立ち上げを経験。前職はワンダープラネット株式会社でゲームプロデューサーとしてスマホゲームアプリの制作に従事。2018年に地元の神奈川へ戻り、ニュートラルワークスに入社。SEO/Web広告運用/サイト分析・改善など、Webサイトの運用改善～ゲームアプリ制作や数十万フォロワーのSNSアカウントの運用経験などWebビジネス全般を守備範囲とする。

■経歴
2003年　ISD株式会社/起業
2009年　株式会社オプト/SEMコンサルタント
2011年　株式会社メタップス/シニアディレクター
2013年　ライブエイド株式会社/執行役
2016年　ワンダープラネット株式会社/プロデューサー・BizDev
2018年　株式会社ニュートラルワークス/取締役CMO

■得意領域
Webサイト改善
SEO対策
コンテンツマーケティング
リスティング広告

■保有資格
Google アナリティクス認定資格（GAIQ）
Google 広告検索認定資格
Google 広告ディスプレイ認定資格
Google 広告モバイル認定資格

執筆者

株式会社ニュートラルワークス

QUERYY(クエリー)編集部

QUERYY(クエリー)は、株式会社ニュートラルワークスが運営するデジタルマーケティング情報メディアです。

blockquoteタグ（引用タグ）とは？

blockquoteタグとは、他のサイトや文献から文章の一部を引用する際に使用するタグのことです。一般的にWebサイトのコンテンツはオリジナルであることが望ましいです。ただし、場合によってはそのままの文章を掲載した方が、ユーザーにとって伝わりやすいこともあるのです。

例えば、SEO施策について解説する際、Googleが発表しているガイドラインをそのままのテキストで読んでもらうと分かりやすいです。このような場合に、引用元を明記してコピペではないことを表明するためにblockquoteタグ（引用タグ）を使用します。

blockquoteタグが必要な理由

blockquoteタグが必要なのは、以下のように2つの理由があるからです。

• コピーコンテンツではないことを示すため
• Webにおけるマナーであるため

ここからはそれぞれの理由について、詳細を解説していきます。

コピーコンテンツではないことを示すため

1つ目の理由は、コピーコンテンツではないことを示すためです。これは、検索エンジンを意識した考え方です。たとえ引用部分に「出典」や「引用」というテキストを添えてたとしても、検索エンジンはテキストを引用しているとは認識してくれません。そのため、コピーコンテンツとみなされてしまうのです。

そこで引用したことをblockquoteタグで表示することで、コピーコンテンツだと誤認されるのを防ぐことができます。検索エンジンにコピーコンテンツだと認識されてしまうと、ペナルティが発生したり、検索順位が下がってしまったりしてしまいます。自社サイトを上位に表示させるためにも、blockquoteタグは重要です。

Webにおけるマナーであるため

2つ目の理由は、Webにおけるマナーであるためです。これはユーザーを意識した考え方で、Webコンテンツは常にオリジナルであることが望ましいです。他社サイトのコンテンツを「引用」や「出典」などとソースを明かさずに使用した場合、コピペだと判断されてしまいます。

コピペを行っていることが判明すると、ユーザーに不信感を持たれてしまい、サイトだけでなく、運営会社の信用も失ってしまうのです。こうした考え方から、Webコンテンツ制作において、引用したものは引用したと表すのは重要なマナーだと言えます。そこで、検索エンジンには認識されないとしても、出典や引用元については明かす必要があるのです。

blockquoteタグによるSEO効果について

blockquoteタグがSEO効果を発揮するかどうかについては、直接的な効果はあまりないといわれています。しかし他のサイトからテキストを引用しているのにblockquoteタグを入れていないと、Googleからコピーコンテンツとしてみなされてしまうことがあります。上記でも触れたように、コピペを行なってしまうとサイトの掲載順位が下がってしまうため、非常に大きなハンデとなってしまうのです。

そこでblockquoteタグを用いてコピペではなく引用タグで示すことで、ユーザーに有益なコンテンツであることを証明することにつながります。以上を踏まえると、blockquoteタグは間接的にSEO効果があるといえます。

qタグやciteタグとの違いは？使い方やhtmlの書き方を紹介

引用タグには以下のようにいくつかの種類があります。

• blockquoteタグ
• qタグ
• citeタグ

ここからは、それぞれのタグについて解説していきましょう。

ある程度まとまった文に使用するblockquoteタグ

blockquoteタグは、長い文章など、ある程度まとまったテキストに用いるタグです。例えば、以下のように記述します。

<blockquote cite=”https://n-works.link/services”>
 <p>WEB サイトを作る目的は、お客様のビジネスの課題を解決することです。そのためには、ただサイトを構築するだけでなく、きちんとお客様のビジネスを理解した上で、WEB のプロとしてお客様の課題を解決する戦略の提案を行います。</p>
</blockquote>

すると以下のように表示されます。

この<blockquote cite=”https://n-works.link/services”></blockquote>というタグでは、引用サイトを明記しています。すると検索エンジンはどのサイトの文章を引用しているのか、認識してくれるのです。

短文に使用するqタグ

qタグは短い文章に用いられることが多いです。例えば、以下のように用いることができます。

<p>シェークスピアはこのような名言を残しています。<q>生きるべきか死すべきか、それが問題だ</q></p>

上記のタグは、以下のように表示されます。

このように、<q>生きるべきか死すべきか、それが問題だ</q>というタグを用いると、囲っている部分がクォーテーションマークで括られるようになります。こうすることで、文章のどの部分が引用されているのかが明確になります。

引用元の表示に使用するciteタグ

citeタグは引用元の表示に使用する際に使用されます。こちらのタグは単体で用いられることは少なく、多くの場合blockquoteタグと一緒に用いられます。例として、以下のように使用できます。

<blockquote cite=”https://n-works.link/services”>
 <p>WEB サイトを作る目的は、お客様のビジネスの課題を解決することです。そのためには、ただサイトを構築するだけでなく、きちんとお客様のビジネスを理解した上で、WEB のプロとしてお客様の課題を解決する戦略の提案を行います。</p>
引用元：<cite><a href=”https://n-works.link/services”>サービス</a></cite>
</blockquote>

すると以下のように表示されます。

この<blockquote cite=”https://n-works.link/services”></blockquote>というタグは検索エンジン向けに記載しているのに対し、<cite><a href=”https://n-works.link/services“>サービス</a></cite>というタグでは、ユーザーがどこから引用しているのかが分かるようになっています。citeタグがあるとユーザーがソースを確認できるため、親切なサイトになります。

blockquoteタグは使いすぎに注意が必要

他のサイトや文献からテキストを引用した場合は、blockquoteタグを使うのがルールだと説明しました。しかし、blockquoteタグを使いすぎるのはよくありません。そのため、引用の際は注意が必要です。

その理由は、引用コンテンツが多いと自社のコンテンツは質が低い・内容が薄いという風に捉えられてしまうからです。引用テキストのつぎはぎでは、オリジナリティは発揮できません。そしてオリジナリティが低いと、結果的に検索エンジンからの評価も下がってしまうので、検索結果の上位表示も難しくなるでしょう。

そこで引用のしすぎを防ぐために、引用テキストは補足や根拠提示に使うようにしましょう。独自コンテンツを充実させることを優先し、引用テキストは説得力を持たせるための手段として捉えてください。

CSSで見た目の工夫をすることも重要

CSSを用いて、視覚的に引用だとわかるように工夫することも重要です。先ほど引用サイトを表示させるためのタグについて紹介しました。ただし他のテキストと同じように表示してしまうと、ユーザーが見逃してしまう可能性があります。ユーザーが一目で引用だと分かるようにするためにも、CSSで表示デザインを変えることが望ましいです。

引用されるようなコンテンツ作りも意識しよう

他のサイトのテキストを引用するだけでなく、自サイトのコンテンツが引用されるようなものにすることも重要です。というのも、他のサイトからテキストを引用されると、被リンク獲得につながります。被リンクが増えるということは、検索エンジンから別のサイトから参照されていると認識されるため、サイトの評価が高まるのです。このように、引用されるようなコンテンツを作ると、SEO効果が期待できます。

blockquoteタグのまとめ

この記事では、blockquoteタグの概要や使い方について解説していきました。blockquoteタグとは他のサイトや文献から文章の一部を引用する際に使用するタグのことで、コピペではないことを証明するために重要な役割を果たしています。そして引用タグには3つの種類があり、シチュエーションに応じて使い分けることが大切です。

ただし、blockquoteタグを使いすぎてしまうと、オリジナリティに欠けたサイトになってしまいます。すると結果的に検索エンジンからの評価も下がってしまうため、検索結果の上位表示も難しくなります。そこでオリジナリティのあるコンテンツにすることを優先しましょう。また、他のサイトが引用したくなるような、充実したコンテンツ作りもSEO施策には大切です。