連載「技術ブログの収益化準備」第1回

ステマ規制に対応したブログの PR 表記|microCMS のチェック1つで記事の冒頭に「広告」表示を出す

この連載について

このサイト cyber-blow.com では、今後 Google アドセンスの広告や、アフィリエイトのリンクを使う予定です。この連載「技術ブログの収益化準備」では、広告やアフィリエイトを始める前に、サイト側で整えたことをまとめていきます。

アドセンスの審査やアフィリエイトの話は、実際に進めたら回を追加していきます。

この回でやること

  • 2023年10月1日に始まった、いわゆる「ステマ規制」の中身を、消費者庁の資料で確認する
  • 広告を含む記事にだけ、冒頭に PR 表記を出す仕組みを作る(microCMS + Astro)

サイトは Astro で静的生成し、記事は microCMS で管理しています。構成の全体像は総集編にまとめています。

なお、この記事は消費者庁が公開している資料を読んで整理したもので、法律上の判断を示すものではありません。実際の判断は、記事内でリンクしている一次情報を確認してください。

ステマ規制とは

告示と施行日

ステマ規制は、景品表示法(不当景品類及び不当表示防止法)第5条第3号に基づく告示「一般消費者が事業者の表示であることを判別することが困難である表示」(令和5年3月28日内閣府告示第19号)のことです。令和5年(2023年)10月1日から施行されています。

告示の本文は短く、規制される表示を次のように定めています。

事業者が自己の供給する商品又は役務の取引について行う表示であって、一般消費者が当該表示であることを判別することが困難であると認められるもの

つまり、広告なのに広告だと分からない表示が対象です。消費者庁のページでは、これを「広告であるにもかかわらず、広告であることを隠す」いわゆるステルスマーケティングと説明しています。

参考:令和5年10月1日からステルスマーケティングは景品表示法違反となります。| 消費者庁

規制の対象は広告主

消費者庁の Q&A(Q1)では、規制の対象は表示の内容の決定に関与した事業者、いわゆる広告主だとしています。広告主から依頼を受けて投稿するインフルエンサーやアフィリエイターは、規制の対象外です(広告主と共同して商品などを供給している例外的な場合を除く)。

一方で、運用基準では、広告主がアフィリエイトプログラムを使ってアフィリエイターに委託し、自社の商品やサービスについて表示させる場合は「事業者の表示」に当たる例として挙げています。そのうえで、アフィリエイトサイトに事業者の表示であることを記載していない場合を、事業者の表示であることが明瞭になっていない例としています。

運用基準は、この関係を次のように説明しています。

事業者が第三者の表示において、事業者の表示であることを明瞭にしなければならないことの結果として、第三者の表示に対しても一定の制約が事実上課せられることとなる

ブログの運営者自身は規制の対象ではなくても、アフィリエイトの記事は広告主の表示として扱われうるので、広告であることが分かる書き方が求められる、ということです。

参考:ステルスマーケティングに関するQ&A | 消費者庁

「明瞭」とされる表記、されない表記

運用基準では、事業者の表示であることが明瞭になっている例として、次のものを挙げています。

  • 「広告」「宣伝」「プロモーション」「PR」といった文言による表示
  • 「A社から商品の提供を受けて投稿している」といった文章による表示

ただし、これらの文言を使っていても、表示内容全体から明瞭とは認められない場合もある、という注記が付いています。

逆に、明瞭でない例としては、次のようなものが挙げられています(抜粋)。

  • 部分的にしか表示していない
  • 冒頭に「広告」と書きながら、文中に「第三者としての感想」のような分かりにくい表示をする
  • 視認しにくい末尾の位置に表示する
  • 周囲の文字と比べて小さく表示し、認識しにくくなっている
  • 長文や薄い色の文字など、認識しにくい表示になっている
  • 大量のハッシュタグなど、他の情報に紛れ込ませる

Q&A の Q13 では、アフィリエイトサイトの冒頭に「このサイトはアフィリエイト広告を利用しています。」などと書いていても、文字のサイズや色なども踏まえて、明瞭になっている必要があるとしています。

参考:「一般消費者が事業者の表示であることを判別することが困難である表示」の運用基準(PDF)| 消費者庁

違反した場合

Q&A の Q2 によると、違反が認められた場合、消費者庁は違反行為を行っている事業者(広告主)に「措置命令」(行政処分)を行います。違反のおそれがある段階でも「指導」(行政指導)が行われることがあります。

このサイトの方針

このサイトでは、PR表記を次のようにしています。

決めたこと

内容

表記を出す単位

記事ごと。広告・アフィリエイトを含む記事だけに出す

表記の位置

記事タイトルのすぐ下(アイキャッチ画像や本文より前)

文言

「本記事にはプロモーション(広告)が含まれています。」

見た目

黄色の背景と枠線で囲む

切り替え方

microCMS の記事の「PR表記」をチェックするだけ

文言には、運用基準で明瞭な例に挙がっている「プロモーション」と「広告」の両方が入っています。位置は記事の冒頭です。運用基準では、末尾など視認しにくい位置への表示が、明瞭でない例に挙がっています。

プライバシーポリシーにも「広告を含む記事には、記事の冒頭に表記します」と書いています(第2回で紹介します)。

実装

1. microCMS に「PR表記」フィールドを追加する

microCMS の記事の API(blogs)に、真偽値のフィールドを1つ追加します。

フィールドID

表示名

種類

備考

pr

PR表記

真偽値

広告・アフィリエイトを含む記事は ON

管理画面では、記事の編集画面にスイッチが1つ増えるだけです。広告を含む記事を書いたら、ここを ON にして公開します。

2. 型にフィールドを足す

microCMS から取得する記事の型に、pr を追加します。未入力の記事もあるので、省略可能(?)にしています。

src/lib/microcms.ts
export type Blog = MicroCMSListContent & {
	title: string;
	// …(省略)…
	/** 広告・アフィリエイトを含む記事なら true(PR表記を出す) */
	pr?: boolean;
	// …(省略)…
};

一覧ページ用に取得するフィールドを絞っている場合は、そのリストにも pr を足しておきます(このサイトでは SUMMARY_FIELDS)。記事一覧の取得方法は連載「Astro × microCMS でブログを作る」の第2回で紹介しています。

3. 記事ページの冒頭に表記を出す

記事詳細ページで、pr が true のときだけ表記を出します。位置はタイトル(h1)のすぐ下で、アイキャッチ画像より前です。

src/pages/blog/[id].astro
			<h1 class="post-title">{blog.title}</h1>
			{blog.pr && <p class="pr-notice">本記事にはプロモーション(広告)が含まれています。</p>}
			{/* この下にアイキャッチ画像(省略) */}

blog.pr が undefined(未入力)や false のときは何も出力されません。記事ごとにチェックを付けるだけなので、広告を含まない記事に表記が出ることもありません。

4. 見た目を整える

表記は、黄色の背景と枠線で囲んで、本文と区別がつくようにしています。

src/styles/global.css
:root {
	/* …(省略)… */
	--color-pr-bg: #fff8c5;
	--color-pr-border: #d4a72c;
	/* …(省略)… */
}

/* …(省略)… */

.pr-notice {
	margin: 0 0 16px;
	padding: 8px 12px;
	border: 1px solid var(--color-pr-border);
	border-radius: var(--radius);
	background: var(--color-pr-bg);
	font-size: 0.85rem;
}

色は CSS 変数(:root に定義)にしているので、あとでデザインを変えるときも1か所で済みます。

5. Markdown で書く記事の場合

このサイトでは、記事を Markdown で書いて、スクリプトで microCMS に下書き登録することもできるようにしています。その場合は、ファイル先頭の frontmatter に pr: true と書きます。

---
title: 記事のタイトル
pr: true
---

スクリプト側では、pr を省略すると OFF として送るようにしています。

scripts/post-draft.mjs
	pr: meta.pr ?? false,

注意点

文字の大きさや色を変えるとき

表記の文字は、本文より少し小さめ(0.85rem)にしたうえで、背景色と枠線で囲んでいます。運用基準には「周囲の文字と比較して小さく表示した結果、一般消費者が認識しにくい表示となった場合」や「他の文字より薄い色を使用した結果」認識しにくくなる場合が、明瞭でない例として挙がっています。デザインを変えるときは、表記が目立たなくならないように気をつける必要があります。

チェックの付け忘れ

この仕組みでは、記事ごとのチェックを付け忘れると、表記もそのまま出ません。アフィリエイトのリンクを入れた記事は、公開前に「PR表記」が ON になっているかを確認する必要があります。

表記を出しているのは記事ページだけ

現在、表記を出しているのは記事の詳細ページだけで、記事一覧のカードには出していません。

まとめ

  • ステマ規制は、景品表示法に基づく告示で、2023年10月1日から施行されている
  • 規制の対象は広告主だが、アフィリエイトの記事は広告主の表示として扱われうるので、広告であることを明瞭にする必要がある
  • 運用基準では「広告」「宣伝」「プロモーション」「PR」などの文言が明瞭な例として挙がっている。末尾や小さい文字、薄い色は明瞭でない例
  • このサイトでは、microCMS の真偽値フィールド pr を ON にすると、記事タイトルのすぐ下に「本記事にはプロモーション(広告)が含まれています。」と出るようにした

規制の細かい内容は、本文中でリンクした消費者庁の告示・運用基準・Q&A を確認してください。

次回は、プライバシーポリシーと Amazon アソシエイトの表記を用意した話です。