今回はデータ整理と置き方のヒント「階層構造」について説明します。雑多にデータを置いてしまうと、サイトの構造はあっと言う間にごちゃごちゃになってしまいます。みなさんが普段パソコンでフォルダを作成するとき、ごく自然にやっていると思いますが、大まかなフォルダを作ってその中にファイルを格納していきますよね。それと同じく、Webサイトにもファイル分けが欠かせません。今回はこのファイル分けに使う「階層構造」について説明します。Webを構成するファイルがどのように置かれているかたとえば、あるサイトで企業情報の「会社概要」というページがあったとします。http://www.***.co.jp/company/profile.html最初の「http://www.***.co.jp」までが、Webサーバーの住所を表していると考えてください。その後ろが、サーバー内のファイルのありかを示しています。実際にサーバー内を見ると、以下の図のようになります。フォルダの中にさらにフォルダがあり、HTMLなどのファイルが置かれ、普段使っているパソコンの中の様子に似ています。〔図9-2〕ファイルが置かれている様子この図には3つのHTMLファイルがありますが、URLの形で書くと次の通りです。各フォルダには多くの場合「index.html」というファイル置いてがあります。これがフォルダの中を案内する目次になっていることが多いので、index(目次).htmlと呼びます。トップページや各コーナーのトップを表す場合は、以下のようにファイル名の「index.html」を略して書くことも多いです。http://www.***.co.jp/http://www.***.co.jp/company/略しても、サーバーの設定で、「/」で終わったリクエストが来たらそのフォルダにある「index.html」を呼びに行くようにできているので、問題なくアクセスできるのがありがたいところです。ドメインの後の「/」を数えて、それが階層になっていると考えてください。「/」「company/」と書いてあるとき、第1階層「/」の下に「company/」と名付けられたファイルがあるとわかります。パソコンと同じで、フォルダの中に複数のフォルダを作成することができて、フォルダの中にフォルダ、その中にフォルダ、その中にまたフォルダと、入れ子式にいくらでも階層を積み重ねることもできます。実際のWebサイトではどんな構造なのかを考えてみましょう。現実にこんな単純な階層構造になっているサイトは少ないですが、たとえば、「http://www.***.co.jp/」というウェブサイトの「製品情報」トップのページがあったとします。〔図9-4〕こんなグローバルナビゲーションがあるとすると......この図はよく見る構成のサイトのページを模式図にしたものです。グローバルナビゲーションの部分を見てください。いうコーナーがある、という構造です。ここで言う「グローバル」は「世界の」という意味ではなく、「サイト全体に共通する」というぐらいの意味です。右上の「お問い合わせ」も、全ページに現れるボタンですからグローバルナビゲーションの一部と考えて良いでしょう。上図のページは「製品情報」のトップページで、ここには3つの製品がどうやらあるようです。した構成になっているサイトでは、階層構造はこうなっています。〔図9-6〕URLを階層ごとに色分けとなります。同じ深さの階層なら、URLに出てくる「/」の数が同じですね。なっていることが割と多いというだけです。「こうしなきゃいけない」というものではありません。大切な製品は特別に製品情報フォルダから出して第2階層に格上げする、といったケースもあります。製品Bトップとなっていました。製品Bトップと、短くなりました。index.htmlは略せますので、人に教えるときは、http://www.***.co.jp/B/とだけ教えてあげればいいということです。階層構造は、自分で都合の良い並びを考えて決めれば良い、ということです。一貫性なく、思い付きであちこちにフォルダをつくってしまうと、あとになって「あのファイルはどこにあるんだ!」と探し回らなければならなくなります。「階層がごちゃごちゃになったからリニューアル」はしない多くのサイトは、運営していくうちに各担当者が思い思いに階層を作ることがあり、どこにどんなファイルがあるのかわからなくなります。どのページからもリンクされていない階層があったり、要らないページが残っていたりして、訳がわからなくなるのです。多くのWeb担当者が「昔の担当者が作って、今は不要だと思われるページがたくさんあるのですが、削除していいいかどうか判断できないんです!」と嘆いています。いうサイトはよく「増築を繰り返した田舎の温泉旅館」にたとえられます。旧館の2階と新館の3階が渡り廊下でつながっていたり、離れの温泉棟があったりして、お客様が迷子になってしまう。した亡霊ファイルを一掃するためにリニューアルを行うことがあります。それは予算を無駄に使ってしまう、あまりにも不毛なリニューアルです。こんな無駄をしないで良いように、きちんとサイトの階層構造を常に整理しておきましょう。これを整理するための方法をご紹介します。〔図9-8〕サイト構成図リニューアルを制作会社さんに頼むと、企画段階でこのような図を持ってきてくれることが多いです。どんなページをどれだけつくるか、整理するのに最適な図です。これを「サイト構成図」と呼んでいます。図9-4など階層構造の説明図に現れていたページが全部登場して、どんなつながりになっているかが整理されています。どこに「フォルダ」が省略されているかわかりますね。Webの情報はこのように階層的に整理しておくことが大切です。この図には注意点があります。サイト構成図はリンクの図ではない再び図9-7を見てください。お問い合わせに向かって線が伸びています。これを見ると、「なるほど、トップページには3つのリンクがあるんだな」とつい思ってしまいます。トップからは直接、製品A、製品B、製品Cにリンクすることもできるはず。会社概要にもリンクできますね。これを全部「線」で表そうとすると、以下の図のようにごちゃごちゃになります。〔図9-9〕リンクを全部表そうとすると......無理やりですね。実際のリンクはこれだけではありません。大切なリンクとして、製品Aや製品B、製品Cから「お問い合わせ」へのリンクが抜けています。この線を引こうと思うと、さらにゴチャゴチャになってしまいます。サイト構成図に描かれている線は、情報の従属関係を階層的に整理するための線であって、「リンク」ではないのです。最初の「サイト構成図(図9-8)」を見てください。この図には3つの落とし穴があります。〔図9-8〕サイト構成図(再掲)訪問者は必ずトップページから来るように見えるページ同士の繋がりを表す線が引かれていないどのページで集客を行うのかわからない以上の3点です。訪問者は必ずトップページから来るわけではない先ほども述べたように、サイト構成図に引かれている線はリンクの線ではありません。A」という順で閲覧するように感じられます。実際に、Web担当者の上司でWebに不慣れな方はこのように思いこんでいることが多いです。Webに不慣れな方はどれだけ広告をやっていても、SEOやコンテンツマーケティングに力を入れていても、「人はトップから来る」と思っています。「御社のサイトに来る全部の人を100%とすると、トップページから来る人は何パーセントだと思いますか?」と質問すると、かなり多くの方が「まあ、70%ぐらいかな」「うちは有名企業ではないが業界では良く知られているから、80%ぐらいあるかもしれない」と答えます。これは間違いで、トップページから来るのは全体の15~20%だと考えてください。広告やSEO、コンテンツマーケティングで成果を出すというのは、多くの場合トップ以外のページで集客を行うものです。集客施策を全く行っていない小さな企業サイトでさえ、自然検索訪問率が50%程度あり、トップ以外のページからも多く集客しています。「サイトを訪れる人はトップページから来る」という誤解を持ったままでは、Web運営は絶対にうまくいきません。ページ同士の繋がりでターゲットを誘導するまた、サイト構成図では「製品Aを見た人が製品Cも見ていく」「製品Aを見た人がお問い合わせに進む」というページ同士の線が引かれていないことも問題です。ページ同士のつながりを意識してWebサイトを作成しましょう。製品Aから別のページへのリンクがない場合、ユーザーが製品Aのページで帰ってしまうサイトができあがります。それではWebが成果を出せるわけがないのです。〔図9-10〕ページ同士のリンクができているイメージと、できていないイメージサイト構成図では、一番下に書かれたページが「行き止まり」に見えます。もどる」だけになってしまうサイトもあります。サイトを見ている人は「先に進みたい」のであって、「もどりたい」わけではありません。大半の訪問者が「もどる」リンクを見た瞬間に帰ってしまうのです。どのページで集客を行うのか考える一番下のページは「末端」に見えますが、実際にはこうした末端のページが自然検索からの訪問者を多く集めています。それに気がつかずにターゲットを逃しているサイトも少なくありません。いったサイトは、「どのページで集客をするか」が考えられていないことが多いです。末端ページにどのような役割を持たせ、どう集客するかを考えましょう。〔図9-11〕末端のページが検索で集客していることに気づかないここまではご説明のために簡易的なサイト構成にしてきましたが、もっと現実のサイトに近い構成図で考えていきましょう。実際のサイトに近い構成図ではページ数が増え、次の図のようになります。第1階層に1ページ、第2階層に8ページ、第3階層に24ページあり、全部で33ページの規模です。これでも、1つの図にすることは非常に困難です。リンクを全部描くのは不可能ですので、あくまでサイトの構成を考える図だということをもう一度念頭に置いてください。〔図9-12〕のサイトでは、どう集客することができるでしょうか。ユーザーに「お問い合わせ」してもらうことがゴールだと仮定します。すると、「お問い合わせ」にたどり着くまでのユーザーの道筋はざっと考えたただけでも以下のようになります。〔図9-13〕集客から目標到達までの道すじおそらく主力製品である製品Aの「特長」のページを見た人が一番多く「お問い合わせ」に進むでしょう。「技術情報」という製品それぞれに関連するコンテンツのコーナーでつくることで検索集客を狙いますが、実際にどう誘導するのかを考えるのにこの図は向いていません。Webサイトの集客はゴールまでの誘導図で考えることが大切Webサイトで集客をするときは、まずはゴールを決めて誘導図を考えてみましょう。「お問い合わせ」ページへの誘導を目標として、このサイトの誘導図を描くなら、次のようになるでしょう。上図のように、ユーザーに取ってほしい道筋を考えたら、次はどんなターゲットを、どう誘導するかを考えます。3つのステップに分けてみましょう。集客ページターゲットの興味を引くページ。次のページへのリンクも強化。説得ページターゲットにとってもメリットを盛り込み、この製品は自分の役に立つ」「この会社は良い」と感じるようなページにして、「お問い合わせ」に繋げる。考え、そこからどう動いてほしいのか、どうしたら動いてくれるのかを誘導図にして考えましょう。Web担当者や制作会社のディレクターが真っ先に作らなければならないのは、この「誘導図」です。この図を作っていないなら、今日作りましょう。集客まで考えやすい「サイト構成図」の描き方ここまで見てきたのは「上→下」に描く縦型のサイト構成図でした。この図は誤解も多く、また集客からゴールまでの道筋を描くのも難しくなります。おすすめは、次のような「左→右」に描く横型のサイト構成図です。〔図9-18〕サイト構成図は「横型」に描こうこれなら狭いスペースにたくさんページを描いても見やすいですし、端と端のページの距離が遠くなりすぎないので、矢印を描きやすくなります。左右にスペースを確保しやすいので、階層の上下に影響されずに、集客や誘導について考えられるようになるのです。したサイト構成図を一度描いて、集客と誘導について考えを整理しておくことをおすすめします。リニューアル時や今のサイトを整理しようというタイミングが好適です。「新しいページができた」「どんどん増やしていこう」といった運営の中では、この図を随時メンテナンスしていくのは大変です。ビジュアルなので会議やプレゼンテーションには向いていますが、Web管理・改善活動には適していません。継続的な運営・改善活動のためには、エクセルを使った「サイト構成表」を作成することが不可欠です。そこで、次回はサイト構成表の作成と活用の方法について解説していきましょう。カタログ企画を経て、95年からウェブプロデューサ。Web黎明期からアクセス解析を使い、多くの企業サイトを成功に導く。「直帰率」という言葉の生みの親として知られる。Webそのもののコンサルティングから、Webを絡めた売上向上やコスト削減など経営全般に関わるコンサルティングが増えてきたため、企業分析と企業Web分析を組み合わせて「すべてを見る」ことをコンセプトとした分析会社「ミルズ」を設立。株式会社ミルズ主任研究員。~便利テンプレートデータで実務を効率化!』(技術評論社)、『改訂新版アクセス解析の教科書』(翔泳社)等がある。(19/04/03)CSSはレイアウトの専門家。最近(過去90日間)の記事で、Facebookの「いいね!」が多かった記事をお見逃し無く。ネット広告への強い嫌悪感、テレビや新聞の倍以上に。いいね!私は変人コレクター。CEM」の提供を開始LINEのマーケ活用術――ナーチャリングからリピーター醸成まで解説するセミナー2/20開催MaaSが普及したら「自家用車を手放すことを検討する」48%【アクセンチュア調べ】2019年にもっとも注視されたテレビCMは、クボタ「壁がある。教育系】自社WEBサイトの運営および企画提案、リスティング広告・SNS広告などの広告出稿を中心に担当いただきます。2/19(水)@ステーションコンファレンス東京リピーターを呼び込む「究極の集客方法」。リピーターを呼び込む「究極の集客方法」。2019年12月すべて見るインフォメーションWeb担のメルマガを購読しませんか?Web担の記事がコンパクトに毎週届くメールマガジン「Web担ウィークリー」は、10万人が読んでいる人気メルマガ。忙しいあなたの情報収集力をアップさせる強い味方で、お得な情報もいち早く入手できます。編集後記サイトマップFAQ(よくある質問とその答)Web担に広告を掲載しませんか?購読者数10万人のメールマガジン広告をはじめとする広告サービスで、御社の認知向上やセミナー集客を強力にお手伝いいたします。