前回は、AIによって「自作サイト」の前提が変わった、という話をしました。
前回の記事はこちらです。
AIでサイト制作はどう変わる？自作サイトのメリットと注意点とは？
今回は、その続きです。
テーマは、コーポレートサイトの構成です。
サイト制作というと、最初にデザインを考えたくなります。
もちろん、デザインは大切です。
でも、先に考えるべきことがあります。
それが、サイト全体の構成です。
コーポレートサイト制作は、まず構成から考える
コーポレートサイトを作るとき、いきなりトップページの見た目から考えると、迷いやすくなります。
先に整理した方が良いのは、次のようなことです。
- 誰に見てもらうサイトなのか？
- 何を伝えるサイトなのか？
- どんなページが必要なのか？
- どの順番で読んでもらうのか？
- 最終的に、どこへ進んでもらうのか？
ここを決めずに作り始めると、ページが増えるほど、全体がぼやけます。
見た目はきれいでも、何を伝えたいのか分かりにくいサイトになってしまいます。
大切なのは、デザインの前に設計することです。
このは屋のコーポレートサイトも、まず構成から整理しました。
AIに最初に相談したこと
今回の制作では、まず既存のページをもとに、サイト全体の方向性を整理しました。
最初に確認したのは、次のような内容です。
- 現在のコーポレートサイトには、どんなページがあるのか？
- 新しいHTMLサイトでは、どのページを作るのか？
- 既存ページへリンクするだけで良いページはあるのか？
- 新しく作った方が良いページはあるのか？
- トップページでは、何を一番伝えるべきか？
- このは屋らしさを、どう表現するか？
いきなり「かっこいいサイトを作って」とお願いしたわけではありません。
まずは、材料を整理しました。
AIは、構成整理が得意です。
ページの役割を分けたり、全体の流れを考えたりするときに、かなり役立ちます。
今回作成したページ一覧
今回のコーポレートサイトでは、最終的に次のページを作りました。
基本ページ
規約・問い合わせ系ページ
こうして見ると、かなりのページ数です。
ただ、最初から全部を完璧に決めていたわけではありません。
作りながら、必要なページが見えてきました。
この「作りながら整理できる」のも、AIと一緒に進める良さです。
コーポレートサイトに必要なページとは？
コーポレートサイトに必要なページは、会社や事業によって変わります。
ただし、基本となるページはあります。
基本的に用意したいページ
- トップページ
- サービス紹介ページ
- 選ばれる理由
- 会社概要
- よくある質問
- お問い合わせ
- 利用規約
- 個人情報保護方針
これらは、多くのコーポレートサイトで必要になります。
特にスモールビジネスの場合、サイトを見る人は不安を持っています。
- どんな会社なのか？
- 何を提供しているのか？
- 信頼できるのか？
- 自分に合っているのか？
- 問い合わせても大丈夫なのか？
こうした不安に答えるのが、コーポレートサイトの役割です。
このは屋の場合に必要だったページ
このは屋の場合は、単なる会社紹介だけでは足りませんでした。
大切にしている考え方が、あるからです。
具体的には、次のような考え方です。
- 自分の商売を、自分で育てる
- 外注に依存しない
- 小さく始めて、少しずつ整える
- 学びながら実践する
- 鼻歌まじりの商売を目指す
- AI時代のDIYを実践する
これらは、サービス内容だけを説明しても伝わりません。
だから、思想や用語を説明するページも必要でした。
そのため、使命・理念、哲学・用語集、鼻歌まじりの商売とは？といったページを用意しました。
トップページの役割
トップページは、サイト全体の入口です。
ただし、すべてを詳しく説明する場所ではありません。
トップページの役割は、全体像を伝えることです。
トップページで伝えること
今回のトップページでは、次の内容を入れています。
- このは屋が大切にしている考え方
- AI時代のDIYというテーマ
- 各ページへの入口
- 進め方の流れ
- 無料テンプレートへの導線
- 会社としての空気感
詳しい説明は、下層ページに任せています。
トップページですべて説明しようとすると、長くなりすぎます。
読者も迷います。
だから、トップページでは「入口」を作る意識にしました。
トップページから下層ページへ流す
トップページを見た人が、気になる内容へ進めるようにしました。
- 進め方を知りたい人は、進め方ガイドへ
- 他サービスとの違いを知りたい人は、他のサービスとの違いへ
- 選ばれる理由を知りたい人は、選ばれる理由へ
- 思想を知りたい人は、使命・理念へ
- 会社情報を知りたい人は、会社概要へ
コーポレートサイトでは、トップページだけで完結させる必要はありません。
大切なのは、必要なページへ自然に進めることです。
下層ページの役割
下層ページは、詳しく説明する場所です。
トップページでは伝えきれない内容を、ページごとに分けて伝えます。
進め方ガイド
進め方ガイドでは、このは屋の学び方や進め方を説明しています。
初めて見る人にとって、全体の流れが分かるページです。
伝えている内容は、主に次の通りです。
- まず小さな型を手に入れる
- セミナーや動画で全体像をつかむ
- 日々の商売で試し、整える
- 必要なら、交通整理をする
他のサービスとの違い
他のサービスとの違いでは、このは屋の立ち位置を説明しています。
- ただの教材販売では、ありません。
- ただの制作代行でも、ありません。
大切にしているのは、自分でできるようになることです。
選ばれる理由
選ばれる理由では、このは屋が大切にしている特徴を整理しています。
- スモールビジネスだけを見ている
- 部分ではなく、全体を見る
- 依存ではなく、自走を育てる
- AI時代のDIYを実践する
単なる強みの羅列ではなく、考え方が伝わるようにしています。
使命・理念
使命・理念では、このは屋の根っこにある考え方を伝えています。
コーポレートサイトでは、理念ページは軽く見られがちです。
でも、スモールビジネスほど、理念は大切です。
- 誰に届けたいのか？
- 何を大切にしているのか？
- どんな未来を目指しているのか？
ここが伝わると、サイト全体の印象が変わります。
哲学・用語集
哲学・用語集では、このは屋独自の言葉を整理しています。
独自の言葉は、説明しないと伝わりません。
例えば、次のような言葉です。
- 鼻歌まじりの商売
- 内製化
- 自分の商売を、自分で育てる
- 小さな型
- 商売全体の交通整理
言葉の意味を共有することで、読者との理解のズレを減らせます。
最初はリンクだけの予定だったページもHTML化した
制作の初期段階では、一部のページは既存サイトへリンクするだけでも良いと考えていました。
対象は、次のようなページです。
- 利用規約
- 個人情報保護方針
- 特定商取引法に基づく表記
- お問い合わせ
ただ、最終的には、これらも新しいサイト側で作りました。
理由は、サイト全体の統一感を保ちたかったからです。
デザインが整っていても、規約ページや問い合わせページだけ急に古い見た目になると、印象が途切れます。
細かい部分ですが、信頼感に関わります。
問い合わせページもデザインを整えた
お問い合わせページでは、フォームを設置しています。
フォームは、どうしても見た目が固くなりがちです。
今回は、サイト全体の雰囲気に合うように調整しました。
具体的には、次の点を整えています。
- 入力欄の余白
- 角丸
- 文字サイズ
- ボタンの見た目
- reCAPTCHAの案内文
- スマホでの見やすさ
問い合わせページは、最後に見られることが多いページです。
ここが雑に見えると、少しもったいないです。
無料テンプレートページも作成した
今回、無料テンプレート申込ページも作成しました。
これは、コーポレートサイト内のCTAとして使えるページです。
CTAとは、読者に次の行動を促す導線のことです。
今回の場合は、無料テンプレートの受け取りです。
CTAを一本化した
サイト内で複数のCTAを出しすぎると、読者が迷います。
そのため、今回のCTAは基本的に「無料テンプレート」に寄せました。
具体的には、こちらです。
ただし、コーポレートサイトなので、CTAを強く出しすぎないようにもしました。
今回の主役は、売り込みではありません。
このは屋の考え方や空気感を伝えることです。
あとから追加した2つのページ
制作途中で、追加したページもあります。
それが、次の2つです。
サービス・提供内容
最初は、コーポレートサイトなので、サービス内容は抽象的でも良いと考えていました。
詳しい訴求は、既存のオウンドメディアである、このサイトで行えば良いと考えていたからです。
ただ、見る人によっては、提供内容が分かるページもあった方が親切です。
そこで、サービス・提供内容ページを作成しました。
このページでは、次のような内容をまとめています。
- テンプレート
- セミナー
- 動画講座
- 実践環境
- 商売全体の交通整理
AI時代のDIY
AI時代のDIYページでは、このサイト自体の作り方を紹介しています。
今回のコーポレートサイトは、AIと人が対話しながら作ったものです。
そのため、ただの会社サイトではありません。
AI時代のDIYを実物で示すページでもあります。
このページがあることで、今回のリニューアルの意味がより伝わりやすくなりました。
AIに構成を相談するときのポイント
ここからは、AIにコーポレートサイトの構成を相談するときのポイントをまとめます。
1. 既存ページを洗い出す
まず、今あるページを洗い出します。
- トップページ
- サービスページ
- 会社概要
- 問い合わせ
- 規約ページ
- ブログ記事
- LP
すべてを新しく作る必要はありません。
残すページ、作り直すページ、リンクするページを分けます。
2. 各ページの役割を決める
次に、各ページの役割を決めます。
- トップページは、全体像を伝える
- サービスページは、提供内容を伝える
- 理念ページは、考え方を伝える
- FAQは、不安を減らす
- 会社概要は、信頼感を補う
- 問い合わせは、行動しやすくする
ページの役割が決まると、文章も書きやすくなります。
3. 読者の疑問から逆算する
コーポレートサイトは、自分たちが言いたいことだけを書く場所ではありません。
読者の疑問に答える場所でもあります。
読者は、次のようなことを気にしています。
- 何をしている会社なのか？
- 自分に関係があるのか？
- 他と何が違うのか？
- 信頼できるのか？
- どんな考え方を持っているのか？
- 問い合わせても大丈夫なのか？
この疑問に答えるように、ページを用意します。
4. サイト内リンクを設計する
ページを作ったら、ページ同士をつなぎます。
これが、サイト内リンクです。
サイト内リンクがあると、読者が必要なページへ進みやすくなります。
例えば、この記事でも実際のページへリンクしています。
読者にとっても便利です。
検索エンジンにとっても、ページ同士の関係が分かりやすくなります。
構成を決めると、デザインも決めやすくなる
サイト構成が決まると、デザインも決めやすくなります。
伝える内容が分かるからです。
ページの役割が決まっていない状態でデザインを考えると、雰囲気だけのサイトになりがちです。
でも、構成が決まっていれば、デザインにも理由が生まれます。
- トップページは、印象と全体像を重視する
- ガイドページは、流れが分かるようにする
- FAQページは、読みやすさを重視する
- 理念ページは、余白と文章の強さを大切にする
- 問い合わせページは、入力しやすさを優先する
デザインは、飾りではありません。
伝える内容を、伝わりやすくするためのものです。
まとめ
今回は、AIを使ってコーポレートサイトの構成を設計する方法についてお話ししました。
要点をまとめます。
- コーポレートサイト制作では、デザインの前に構成を考える
- AIは、ページ構成や役割整理に役立つ
- 必要なページは、会社や事業によって変わる
- トップページは、全体像と入口を作るページ
- 下層ページは、詳しい説明をするページ
- 規約や問い合わせページも、デザインをそろえると信頼感が上がる
- サイト内リンクを整えると、読者にも検索エンジンにも分かりやすい
今回のコーポレートサイトでは、ページを作りながら、少しずつ構成を整えていきました。
最初から、完璧な設計図があったわけではありません。
AIと相談しながら、必要なページを追加し、役割を整理していきました。
これが、AIと一緒に作る良さです。
あなたがコーポレートサイトを作る場合も、まずはページ構成から考えてみてください。
いきなり、デザインに入らなくて大丈夫です。
まずは、次の問いを整理してみることをおすすめします。
- 誰に見てもらうサイトなのか？
- 何を伝えるサイトなのか？
- どんな不安に答える必要があるのか？
- どのページが必要なのか？
- どのページへ進んでもらいたいのか？
ここが整理できると、サイト制作は、かなり進めやすくなります。
次回は、AIと一緒にサイトデザインをどう作り込んでいったのか？
余白、色、文字、スマホ表示など、デザイン面の実践についてお話しします。
