第205回WEB学校 | 新・WEB学校|WEB戦略マーケティング"超"実践型講座|株式会社ガーディアン | 初期無料のサブスク型ホームページ制作｜7万実績のWEB戦略とAIで成果を出す | 初期無料のサブスク型ホームページ制作｜7万実績のWEB戦略とAIで成果を出す

KNくん）
ヘッダーはナビゲーションの役割になる。
ロゴで会社のことをだし
Gnavで主要ページが出ている。
MVは会社のことを端的に示している。
事業紹介に関しては、
自分が何をしているのか
一覧でぱっと見で分かるようになっている。
自分たちが出来ることを並べている。
次にUSPコンテンツ、
自分たちの独自の強味を打ち出している。
事業紹介と異なり優位性が示せるものを出している。
こんなお悩みありませんかは、
自己紹介が終わった後の問いかけ
顧客の潜在的な悩みを打ち出し
自分当てはまるなということを認識して貰う。

ベネフィットは、
自分たちと関わるとどんな良いことがあるかを出している。
HSさん）
ベネフィットは、
漏れがないように沢山並べる。
権威付けコンテンツは、
私たちは私たちにお任せ下さいという自信のあるものを並べる。
お客様の声は、
喜びの声をしっかりタグ分けをして配置する。
FAQは、
お客様の不安を払拭する。
Whats Newで
会社やサービスの新着情報をお知らせする。
WHくん）
Whats Newでは、
会社やサービスである情報を訴求をして漏れがないようにする。
CONTACTで、
CVに向かって貰う。
AboutUSで、
この会社にもっと知りたい人は見てください。
採用情報は、
求職者は自分で情報を探すので最後に置く。
FOOTERは
CVまでの流れを誘導してあげる。

1.ホームぺージにおけるコンテンツの役割
1-1.戦略的な主要32コンテンツ一覧
1-2.コンテンツにはそれぞれの意図があり、目的がある！
1-3.戦略的であるためのコンテンツ・マーケティング
1-4.戦略的コンテンツの価値

青山さん）これらができるようになったら、どうなる？
Mさん）顧客に対し理路整然と説明でき、顧客対応もスムーズになる
Kさん）全員が共通認識を持ってスピードも一気に上がると思う
Kさん）顧客を勝たせることができ、仕事が楽しくなる
青山さん）同業他社と比較してレベチだよね。これ、学ばない奴バカじゃない？
Hさん）コミュニケーションもスパパンパンになる

①概要解説
Unique Selling Proposition＝『独自の強味』。USPコンテンツは、、、
②期待される機能(効果)
この『USP コンテンツ』に期待される機能(効能)は、、、
③適切な閲覧者のレベル状況【見るレベル】【読むレベル】
【見るレベル】★★★★★
　この『USP』コンテンツが適応できる閲覧者の状況フェーズは、、、
④適応できる閲覧者の状況フェーズ
　この『USP』コンテンツが適応できる閲覧者の状況フェーズは、、、
⑤コンテンツレイアウト例
　このコンテンツのレイアウト構成は、①見出し名、②サブ見出し名、③USPタイトル、、、、
⑥コンテンツ実用例！
　このコンテンツは、見るレベル＝TOPぺージ上部の位置に、、、
青）USPコンテンツは、個性の訴求であり、共感を得られるものでなければならない！
これ納得できるよね

青山さんの作成したUSPコンテンツの解説文を参考に、各コンテンツの文章を作っていきましょう。

≪作成ルール≫

①概要解説　≪200文字≫

②期待される機能（効果）　≪200文字≫

③適切な閲覧者のレベル状況 　【見るレベル】【読むレベル】　≪100文字≫

④適応できる閲覧者の状況フェーズ　≪100文字≫

⑤コンテンツレイアウト例　≪200文字≫

⑥コンテンツ実用例 （実際のSCSCサービスでの事例を紹介します）≪200文字≫

作成できたら1項目ずつ文章を送り、青山さんが直接採点！ OKが出るまでその場で修正していきます。

手順・流れコンテンツ

概要解説《267文字》
『手順・流れコンテンツ』とは、閲覧者に対してサービスやプロセスの「全体像」や「進め方」を具体的に示すことで、安心感・信頼感を与えるコンテンツです。このコンテンツは、ユーザーがサービス導入に際して抱く「不安」や「疑問」を払拭する効果が期待されます。特にTOPページの中部〜下部に配置されることが多く、「次に何が起こるのか」を明示することで、閲覧者の心理的ハードルを下げ、アクションへとつなげやすくなります。また、流れを見せることで「段取りが整っている印象」や「オペレーションの丁寧さ・効率性」を印象付けることができます。

期待される機能(効果)《236文字》
この『手順・流れコンテンツ』に期待される最大の効果は「不安の払拭」と「期待の明確化」です。閲覧者はサービスや商品を検討する際、「どうやって進むのか？」「何を準備すればいいのか？」という手続き上の不透明さに不安を感じています。これを「流れ」として可視化することで、未来をイメージしやすくなり、信頼感・納得感・安心感が高まります。また、段階ごとに「何をしてくれるのか」「どんな成果が得られるのか」を明示することで、サービス提供者側の“準備性”や“誠実性”も同時に訴求できます。

適切な閲覧者のレベル状況【見るレベル】【読むレベル】《203文字》
まずは見るレベルで訴求する必要があります。
【見るレベル】★★★★
この『手順・流れコンテンツ』は「流れ」を視覚的に見せることが重要であり、図やアイコンを使って直感的に手順・流れを理解できるようにする必要があります。
見るレベルを越えて、興味を持った方は詳細も見てくれるため、
【読むレベル】★★
各ステップでの「目的」や「ポイント」「所要時間」「担当範囲」などを丁寧に解説し、読み込むことで安心を深めてもらう役割を担います。

適応できる閲覧者の状況フェーズ《184文字》
このコンテンツは「基準設定」「比較検討」「意思決定直前」のフェーズに特に強く作用します。ユーザーは最終的に「このサービスで進んで問題ないか？」を判断する際、手順の具体性と自分との相性を無意識に見比べています。そのため、手順・流れコンテンツは、導入前の「不安払拭」や「期待調整」フェーズにも活躍し、決意後の「次のステップを確認したい」という行動にも自然にフィットします。

コンテンツレイアウト例《204文字》
このコンテンツのレイアウトは、①見出し名、②サブ見出し名、③フロータイトル（導入・準備・実施・完了など）、④各ステップの解説文、⑤ステップに対応した図解やアイコン構成になります。
フロー図のデザインは、横型か縦型かで見せ方が異なりますが、いずれにせよ「一目で全体像がわかる」こと、「ステップが明確に分かれていること」、「視線誘導が自然であること」が重要です。文字は簡潔・明瞭にしましょう。図や色分けで理解促進を図ります。

コンテンツ実用例（実際のSCSCサービスでの事例を紹介します）《274文字》
実際にSCSCでは、サービス導入までの手順を「STEP1：申し込み→STEP2：ヒアリング→STEP3：デザイン・制作→STEP4：納品→STEP5：運用」という5段階に分けて表示しています。各ステップには、アイコンと共に説明を加え、どのような目的でどんな作業が行われるかを明確に記載しています。これにより、初見の閲覧者にも「自分の状況に照らして考えやすい」「どう進めてもらえるか分かり易い」と感じてもらい、信頼感の醸成に寄与しています。また、再訪者に向けては、各ステップ詳細ページへのリンクも用意し、関心の深度に合わせた導線設計を実施しています。

青山さん）意外とできるでしょ？型Aの理解さえあればいい。 同じ時に同じ空間で、自分で選んだテーマでやったからできちゃう。 この生産性びっくりしない？ 一人でやる形で指示として振られたら「できない」になっちゃうけど「僕は優しいよ！」と予め言っただけ。細切れにチェックもしてもらえる。 AI使っていいよとヒントも与えた。報連相の型を決め、チェックも早く皆にリズムを与えた。 ポジティブゾーンで「やろう！」とモードに入って行動を起こしてしまえば、できちゃう。

M）最初はすごい焦った。できるか不安になった。そして普段、できないことを理由を並べてるだけだったと実体験した。これからは、ちゃんとチームで仕事をしていこうと思った。
S）始める前は何をするかもイメージできず、始まってからも不安だったが、皆がやってるから自分もやるぞ！という気持ちになった。
N）苦戦したのは文字量をどうクリアするかだった。自分は型が決まったところに弱いなと。そして人の動かし方。今まではポジティブな言葉を使って行動を促すことを意識していたが、それだけじゃどうにも進まないということもあった。今回の人の動かし方、めちゃくちゃ使えると思った。
H）チームとしての仕事の進め方を学んだ。設計は認識を統一した上で一気に進めることができると思った。
型Aの学び方、各コンテンツを細かく見ていくことでできるんだなと。
青）皆知らないうちに意外とすごいところにいるって気付いた？皆が気付かないうちに、すごいところに来させてるんだよね♪
Y）コンテンツの大事さ、一つひとつ積み重ねていけば勝てるサイトを設計できるんだなと。
どう理解したらいいのかのフォーマットもいただいたので、いろんなサイトで使えるなと。
メンバーの動かし方も学んだ。
青）今日は高等テクニックを使った。だから同じやり方真しようとしても、実際は絶対できないよ。
K）コンテンツの種類を体系化して示していただき、このパターンで見ていけば善し悪しを判断できる。
型を使って量産できるなと。型を作るための型をいただいた。
青）YES！！そこに至って欲しかった！
K）コーポレートサイトのコンテンツが一気にできた。
青）状況フェーズを絞り込んだ上で、コーポレートサイトのコンテンツ化をする必要がある。どこで使うか、位置のパターンは実はものすごい数がある。最大効果を発揮するのはここ！というのがあるんだよ。

KNくん）
ヘッダーはナビゲーションの役割になる。
ロゴで会社のことをだし
Gnavで主要ページが出ている。
MVは会社のことを端的に示している。
事業紹介に関しては、
自分が何をしているのか
一覧でぱっと見で分かるようになっている。
自分たちが出来ることを並べている。
次にUSPコンテンツ、
自分たちの独自の強味を打ち出している。
事業紹介と異なり優位性が示せるものを出している。
こんなお悩みありませんかは、
自己紹介が終わった後の問いかけ
顧客の潜在的な悩みを打ち出し
自分当てはまるなということを認識して貰う。

ベネフィットは、
自分たちと関わるとどんな良いことがあるかを出している。
HSさん）
ベネフィットは、
漏れがないように沢山並べる。
権威付けコンテンツは、
私たちは私たちにお任せ下さいという自信のあるものを並べる。
お客様の声は、
喜びの声をしっかりタグ分けをして配置する。
FAQは、
お客様の不安を払拭する。
Whats Newで
会社やサービスの新着情報をお知らせする。
WHくん）
Whats Newでは、
会社やサービスである情報を訴求をして漏れがないようにする。
CONTACTで、
CVに向かって貰う。
AboutUSで、
この会社にもっと知りたい人は見てください。
採用情報は、
求職者は自分で情報を探すので最後に置く。
FOOTERは
CVまでの流れを誘導してあげる。

1.ホームぺージにおけるコンテンツの役割
1-1.戦略的な主要32コンテンツ一覧
1-2.コンテンツにはそれぞれの意図があり、目的がある！
1-3.戦略的であるためのコンテンツ・マーケティング
1-4.戦略的コンテンツの価値

青山さん）これらができるようになったら、どうなる？
Mさん）顧客に対し理路整然と説明でき、顧客対応もスムーズになる
Kさん）全員が共通認識を持ってスピードも一気に上がると思う
Kさん）顧客を勝たせることができ、仕事が楽しくなる
青山さん）同業他社と比較してレベチだよね。これ、学ばない奴バカじゃない？
Hさん）コミュニケーションもスパパンパンになる

①概要解説
Unique Selling Proposition＝『独自の強味』。USPコンテンツは、、、
②期待される機能(効果)
この『USP コンテンツ』に期待される機能(効能)は、、、
③適切な閲覧者のレベル状況【見るレベル】【読むレベル】
【見るレベル】★★★★★
　この『USP』コンテンツが適応できる閲覧者の状況フェーズは、、、
④適応できる閲覧者の状況フェーズ
　この『USP』コンテンツが適応できる閲覧者の状況フェーズは、、、
⑤コンテンツレイアウト例
　このコンテンツのレイアウト構成は、①見出し名、②サブ見出し名、③USPタイトル、、、、
⑥コンテンツ実用例！
　このコンテンツは、見るレベル＝TOPぺージ上部の位置に、、、
青）USPコンテンツは、個性の訴求であり、共感を得られるものでなければならない！
これ納得できるよね

青山さんの作成したUSPコンテンツの解説文を参考に、各コンテンツの文章を作っていきましょう。

≪作成ルール≫

①概要解説　≪200文字≫

②期待される機能（効果）　≪200文字≫

③適切な閲覧者のレベル状況 　【見るレベル】【読むレベル】　≪100文字≫

④適応できる閲覧者の状況フェーズ　≪100文字≫

⑤コンテンツレイアウト例　≪200文字≫

⑥コンテンツ実用例 （実際のSCSCサービスでの事例を紹介します）≪200文字≫

作成できたら1項目ずつ文章を送り、青山さんが直接採点！ OKが出るまでその場で修正していきます。

手順・流れコンテンツ

概要解説《267文字》
『手順・流れコンテンツ』とは、閲覧者に対してサービスやプロセスの「全体像」や「進め方」を具体的に示すことで、安心感・信頼感を与えるコンテンツです。このコンテンツは、ユーザーがサービス導入に際して抱く「不安」や「疑問」を払拭する効果が期待されます。特にTOPページの中部〜下部に配置されることが多く、「次に何が起こるのか」を明示することで、閲覧者の心理的ハードルを下げ、アクションへとつなげやすくなります。また、流れを見せることで「段取りが整っている印象」や「オペレーションの丁寧さ・効率性」を印象付けることができます。

期待される機能(効果)《236文字》
この『手順・流れコンテンツ』に期待される最大の効果は「不安の払拭」と「期待の明確化」です。閲覧者はサービスや商品を検討する際、「どうやって進むのか？」「何を準備すればいいのか？」という手続き上の不透明さに不安を感じています。これを「流れ」として可視化することで、未来をイメージしやすくなり、信頼感・納得感・安心感が高まります。また、段階ごとに「何をしてくれるのか」「どんな成果が得られるのか」を明示することで、サービス提供者側の“準備性”や“誠実性”も同時に訴求できます。

適切な閲覧者のレベル状況【見るレベル】【読むレベル】《203文字》
まずは見るレベルで訴求する必要があります。
【見るレベル】★★★★
この『手順・流れコンテンツ』は「流れ」を視覚的に見せることが重要であり、図やアイコンを使って直感的に手順・流れを理解できるようにする必要があります。
見るレベルを越えて、興味を持った方は詳細も見てくれるため、
【読むレベル】★★
各ステップでの「目的」や「ポイント」「所要時間」「担当範囲」などを丁寧に解説し、読み込むことで安心を深めてもらう役割を担います。

適応できる閲覧者の状況フェーズ《184文字》
このコンテンツは「基準設定」「比較検討」「意思決定直前」のフェーズに特に強く作用します。ユーザーは最終的に「このサービスで進んで問題ないか？」を判断する際、手順の具体性と自分との相性を無意識に見比べています。そのため、手順・流れコンテンツは、導入前の「不安払拭」や「期待調整」フェーズにも活躍し、決意後の「次のステップを確認したい」という行動にも自然にフィットします。

コンテンツレイアウト例《204文字》
このコンテンツのレイアウトは、①見出し名、②サブ見出し名、③フロータイトル（導入・準備・実施・完了など）、④各ステップの解説文、⑤ステップに対応した図解やアイコン構成になります。
フロー図のデザインは、横型か縦型かで見せ方が異なりますが、いずれにせよ「一目で全体像がわかる」こと、「ステップが明確に分かれていること」、「視線誘導が自然であること」が重要です。文字は簡潔・明瞭にしましょう。図や色分けで理解促進を図ります。

コンテンツ実用例（実際のSCSCサービスでの事例を紹介します）《274文字》
実際にSCSCでは、サービス導入までの手順を「STEP1：申し込み→STEP2：ヒアリング→STEP3：デザイン・制作→STEP4：納品→STEP5：運用」という5段階に分けて表示しています。各ステップには、アイコンと共に説明を加え、どのような目的でどんな作業が行われるかを明確に記載しています。これにより、初見の閲覧者にも「自分の状況に照らして考えやすい」「どう進めてもらえるか分かり易い」と感じてもらい、信頼感の醸成に寄与しています。また、再訪者に向けては、各ステップ詳細ページへのリンクも用意し、関心の深度に合わせた導線設計を実施しています。

青山さん）意外とできるでしょ？型Aの理解さえあればいい。 同じ時に同じ空間で、自分で選んだテーマでやったからできちゃう。 この生産性びっくりしない？ 一人でやる形で指示として振られたら「できない」になっちゃうけど「僕は優しいよ！」と予め言っただけ。細切れにチェックもしてもらえる。 AI使っていいよとヒントも与えた。報連相の型を決め、チェックも早く皆にリズムを与えた。 ポジティブゾーンで「やろう！」とモードに入って行動を起こしてしまえば、できちゃう。

M）最初はすごい焦った。できるか不安になった。そして普段、できないことを理由を並べてるだけだったと実体験した。これからは、ちゃんとチームで仕事をしていこうと思った。
S）始める前は何をするかもイメージできず、始まってからも不安だったが、皆がやってるから自分もやるぞ！という気持ちになった。
N）苦戦したのは文字量をどうクリアするかだった。自分は型が決まったところに弱いなと。そして人の動かし方。今まではポジティブな言葉を使って行動を促すことを意識していたが、それだけじゃどうにも進まないということもあった。今回の人の動かし方、めちゃくちゃ使えると思った。
H）チームとしての仕事の進め方を学んだ。設計は認識を統一した上で一気に進めることができると思った。
型Aの学び方、各コンテンツを細かく見ていくことでできるんだなと。
青）皆知らないうちに意外とすごいところにいるって気付いた？皆が気付かないうちに、すごいところに来させてるんだよね♪
Y）コンテンツの大事さ、一つひとつ積み重ねていけば勝てるサイトを設計できるんだなと。
どう理解したらいいのかのフォーマットもいただいたので、いろんなサイトで使えるなと。
メンバーの動かし方も学んだ。
青）今日は高等テクニックを使った。だから同じやり方真しようとしても、実際は絶対できないよ。
K）コンテンツの種類を体系化して示していただき、このパターンで見ていけば善し悪しを判断できる。
型を使って量産できるなと。型を作るための型をいただいた。
青）YES！！そこに至って欲しかった！
K）コーポレートサイトのコンテンツが一気にできた。
青）状況フェーズを絞り込んだ上で、コーポレートサイトのコンテンツ化をする必要がある。どこで使うか、位置のパターンは実はものすごい数がある。最大効果を発揮するのはここ！というのがあるんだよ。