ホームページを制作する前に知っておきたい13のこと

1

ジャストプレイヤー株式会社代表取締役社長

瀧　康史

ホームページを制作する前に知っておきたい13のこと

〜ウェブサイトを軌道に乗せるための知識〜

MICAN セミナー 2012.04.19

2

13個あるので秘密 :)

今日の議題（アジェンダ）

JUSTPLAYER → すぐに遊べるソフトウェアの開発When You Want Is When You Play → 欲しい時が、遊ぶ時

3

ジャストプレイヤー株式会社について

Usability

Contents Management

Server-SideProgram

Cloud Technology

事業内容 . WEB（ホームページ）制作事業 . WEB企画、デザイン制作 . WEBシステム開発 . クラウドソフトウェア制作事業 . クラウドインフラ賃貸事業、ホスティング賃貸事業

その他 . 第二種電気通信事業者届出届出番号 C-18-1421 . 静岡県中小企業新事業活動促進法に基づく、経営革新計画の承認

4

. ジャストプレイヤー株式会社代表取締役社長 . 出身地 . 静岡市（旧清水市） . 業務履歴 . ライター業（テクニカルライター）.. S社’X紙’（S社のパソコン向け雑誌） . S社にてS社用ゲーム機のゲームソフト開発.. ゲームディレクター、アシスタントプロデューサ−、プランナー等 . 有限会社ジャストプレイヤーを起業（2001年11月） . ジャストプレイヤー株式会社に改組（2006年7月） . その他 . 日本OpenSolarisUsersGroup Leader . 静岡WEBデベロッパーフォーラム

自己紹介 : 瀧　康史

やすし虫

5

「今更」感があるテーマですが、もう一度考えてみましょう。

自社（組織）がどんな相手に、どんなことを知らせたいのか？

どんなビジネス（仕事）を行っているのか

まずは、それから考えてみましょう

1. 自分の作りたいウェブサイトを知る

6

目的 . 何のためにウェブサイトを作るのですか？ . 会社のサイトなら、宣伝、販売促進、ユーザサポート等々。

ターゲット . 誰のためのウェブサイトか？どんな人が見るのですか？ . どんな人？ . 見込み客に見て欲しい等々。

自分が作りたいウェブを把握する

そんなことわかってるよ！と言いますが、案外、忘れそうになります。全ての根底であることをお忘れなく！

7

自社にとってのウェブとは？コンテンツ　ウェブの内容のこと。ターゲット　対象のこと。BtoB　Business to Business　事業者向けBtoC　Business to Consumer 　一般顧客向けOne to One　一人から一人へ、ロングテール・・・　

目的 • 宣伝 • サポート • 販売

ターゲット • BtoB • BtoC • One to One

コンテンツ • プロダクト、商品 • 会社の社会貢献 • 業界の動向

8

2. ウェブサイトに掲載すべき内容を知る

9

. プロダクト、商品 . 自社で取り扱うサービス、プロダクト、商品などの紹介。 . 会社の情報、社会貢献 . 会社概要、沿革、方針、ポリシー . アクセスマップ、場所を表す地図 . リクルート情報 . 業界全体の動向 . 業界の推移（読み物的な要素が増える） . 関連業種のコミュニティサイト、ポータル

ウェブに掲載したいことは？

って、書きましたが・・・・

10

具体例 . 目的が宣伝で、対象が見込み客ならば・・・・・・ . 自社がお客さんにしたいというクライアントを思い浮かべる。 . その方にパンフレットを配るならどんなことを書くのか考えてみましょう。 . 自社技術（できること）を紹介したい→技術概要 . 自社製品の紹介→商品概要 . 自社サービスの紹介→サービス概要 . 見込み客に対する類似事例の紹介→実績紹介 . じゃんじゃんアクセスがあって、じゃんじゃん問い合わせが欲しいですか？ . 目的がサポートで、対象が自社製品（サービス）の顧客なら・・・・・・ . 製品の使い方。マニュアル、チュートリアル、利用シーン等々。 . FAQ . 自助努力するユーザなら、勝手に調べて勝手に解決→サポートコスト圧縮.. これは見えないところで発生しますよね？ウェブの対価はわかりにくい！

11

ウェブのステージを考えてみる

宣伝

サポート

販売

情報ポータル

コミュニティ

ウェブサイトのステージ進化の図大抵のコーポレートサイトのファーストステップは宣伝から始まる。

それぞれのステージで、自分はなにをしたいのでしょう？

12

3. 会社概要の書き方を知る

会社概要

13

会社概要のページには、一般に次の事柄が書いてあります。 . 正式な社名、日本語、英語など。 . 事業内容 . 定款に書かれたものをベースに、もう少し柔らかい言葉で書いてみると良いでしょう。 . 役員の氏名など . 隠されてると事情がきになりますね。会社役員は公人なので、明らかになっても仕方がないのです。 . 住所、電話番号、所在地、アクセスマップなど。来訪者が困らないように。 . 資本金、差し支えなければ取引銀行。 . 差し支えなければ取引先。 . 会社の沿革 . 会社の歴史です。何年に創業し、どんな事業をやってきたのか。事業部の発足、サービス開始日やプロダクトの発売日等・々・・

会社概要のページ

14

. アクセスマップ . 最近はGoogleMapなどで簡単に作ることができます。 . 訪問者が困らないように地図をつけた方がいいでしょう。 . 絵を書く場合、絵を描くコストがそこそこかかります。 . 弊社のWIKIPLUSだと住所を入力するだけで簡単に張り込めます。 . 個人情報保護（プライバシーポリシー） . 個人情報を集める場合は、記載しておく必要があります。 . 当サイトのポリシー . 著作物、免責、動作環境（ブラウザ、OS）、リンク情報（リンク推奨箇所など）。もっとも、リンク不可ってのは無理ですが。 . 特定商取引法に基づく表記、サービス利用約款 . サービスや、ネットショップをする場合は必須です

その他必要な物

15

4.ウェブサイトの素材と集め方を知る

マーク全部併せてロゴ

16

社ロゴ、マーク . ロゴ（あったほうがウェブサイトがしっくり来るもの） . 名刺などに使っているロゴがあれば、そのベクター型データが必要.. ベクター型データ：Adobe.Illustratorなどで作られてることが多い。.. 案外、いつも頼んでいる名刺の印刷屋さんがもってたり（笑） . ロゴが無い会社なら…….. 自動ロゴ作成サイト（無料）などで作れなくはない→「検索：ロゴ作成サイト」.. デザイナーに作って貰う。お値段はものすごくピンキリ！.. お任せで作って貰う場合、イメージをちゃんと伝えないとイメージ通りにならない.. 方向性を定める素案を数種類作って貰う場合、お値段はそこそこします。

17

トップページの写真など・・・ . 写真 . ご自慢の社屋があれば撮った方がいいかも！ . ご自慢の製品の写真を撮ってみた方がいいかも！ . 工業製品でも利用してる人間の写真があると、なんとなく柔らかい感じがし

ます。 . どうしてもない場合は、イメージ写真を買いましょう！.. 写真素材集（一度買えば利用権を得られるもの）の販売サイトがあるので、好きな物を買ってみると良いでしょう。「検索：写真.素材」

写真を適度に調整（リサイズ、余白の切り落とし、輝度調整）したり、文言（キャッチコピーなど）をいれたりすることも重要。プロはAdobe Photoshopなどを利用しますが、gimpなどというフリーソフトでもできます。「検索：gimp」難しければ、写真調整を依頼することもできます。

18

. コーポレートカラー . 会社をイメージするカラーです。.. ジャストプレイヤー株式会社の場合は、上のタイトルなどにもあるオレンジです。.. 実は静岡で起業したので、「お茶の色→グリーン」、「ミカンの色→オレンジ」のどちらかで考えました。マークがグリーンよりもオレンジの方が合ったのでオレンジにしました。 . 大抵の会社は、名刺などに色が付いています。 . ウェブサイトのカラーも何となく会社のイメージとなるので重要です。 . 偉い人に聞いてみましょう。 . 「無いから四季折々で変えたい」という会社もあります。 . 色にはイメージがあります。赤→情熱、青→クールさ等々。 . ウェブデザインを外注する場合、カラーを最初に伝えた方が、イメージが伝

わりやすいでしょう。

コーポレートカラー

19

5. ウェブサイトに構成する物を知る

20

ウェブを構成するものまずは構成物を列挙します

. コンセプト . サイト構造 . デザイン . コンテンツ . マーケティング . システム、ミドルウェア . サーバー

21

サイトの目的、概念、方向性、概括的に考えます最も重要な部分です

. 様々なレイヤーにある . どんなサイトにすべきなのか？ . 何をしたいのか？ . 何を訴えたいのか？

. 最終的な着地点の決定！ . 「やりたいこと」と「あきらめること」をきちんと決めていく！

コンセプト

22

サイトの構造（サイトマップ）、ゾーニング（切り口） . サイトマップ . 何をどこに置くのか？ . ナビゲーション・ゾーニング . どうやって誘導するのか？ . トップページレイアウト・ゾーニング . どう見せるのか？ . ユーザビリティ、アクセシビリティ . 使いやすさ、ユニバーサルデザイン

どのコンテンツをどのように配置し、どのように見せるのか？コンテンツの棚卸しも必須！

サイト構造

23

. どのページに何を配置するのか、考えておく必要があります。 . 右の例は2階層ですが、大体3階層ぐらいまでで留めます。 . 目的のコンテンツまで3クリック程度で行けることが理想です。

サイトマップ

トップページ会社情報

サービス

事例紹介

資料請求

最新情報

個人情報保護方針

お問い合わせ

サイトマップ

Gloval navi

24

それぞれのエリアで何をさせるのか？

ワイヤフレームロゴマークサイトリード文

ヘッダーリンク

グローバルナビゲーション

トップページアイキャッチ画像

挨拶・サイト説明等

最新ニュース・イベント情報

サイドメニュー

会社情報

リンク・バナー

フッターリンクコピーライト

25

. 全体のデザインの方向性 . デザインコンセプト . 寒色、暖色、使って良い色 . クリックできる場所、強調など意味を持つ色 . 等々 . トップページのデザイン . デザインコンセプトを最大限表現する . 第2階層のデザイン . どのぐらい見せる物を用意するのか？ . デザインが多ければコストがかかる . 末端のページのデザイン . デザインコンセプトから外れないこと等

デザイン

26

どういうデザインになるのか？

どんなカラーか。スマフォだとどういう風になるか？

※左はWIKIPLUSでユーザが選択できるデザインの例

デザイン

27

何を書かないとならないのか、整理する。

. ニュースなどの新着情報 . プロダクト、サービス、商品 . 会社の情報、沿革、アクセスアップ . 業界の情報

. 自社のもっているコンテンツとはなにか？誰が持っているのか？ . 表示したいコンテンツとはなにか？

. ツイッター、Facebookなどとの連動はどうか？

コンテンツ内容

28

ウェブそのもののマーケティング . 検索エンジン対策（SEO） . 検索エンジンマーケティング（SEM） . ウェブ広告 . Google Adwords、Yahoo! リスティング . メルマガ . CGM（Consumer Geenrated Media） . ソーシャルメディア系の利用 . SNS、Facebook、Twitterの利用などどうやってユーザをウェブに誘導するのか？パンフレットを誰に配るのか？という考え方に近い。業界紙、雑誌広告、新聞、などなど。紙からネットの難易度は？

マーケティングと運営

29

特別なシステム（ツール）が必要か？ミドルウェア（無償・有償）は何を利用するのか？ . お問い合わせ機能が必要？ . 顧客はログインが必要？ . ショッピングカート機能が必要？ . 個人データの貯蓄は？ . どんな人が運用するのか？ . コンテンツの書き換えは？種類 . CMS、Wiki、Blog . 販売サイトツール . ショッピングカートツール . ポータルシステム

システム・ミドルウェア

30

サービスを担うサーバとインターネット接続。どのぐらいの品質が必要かは、「そのサービスが停止するときのインパクトはどの程度か？」で決めると良いでしょう。落とさないサーバは「コスト」がとてもかかります！ . サーバ . サービスを稼働させるためのコンピュータ。 . 機能による制約も多い。 . 安定性はどの程度、必要か？ . インターネット接続（サーバ） . 安定性 . 高速性これらを保守する人は誰？24時間365日対応は必要？

サーバー・インターネット接続

31

6. お金がかかることを知る

32

私（達）にできないことは全てお金がかかります。誰かにやって貰わないとならないので、人を動かすとお金がかかるのは当然。

人に頼むことになる範囲 . コンテンツ . デザイン . システム . サーバ . 運用

自社の規模感にあわせて、自分達でやる、発注する、知らないことにする（笑）など、色々な対策があります。

私にできないことはお金がかかる！

33

. ディレクション費 . 現場の進行に関する内容 . デザイン費 . デザイン費.. トータルデザイン.. TOPページデザイン.. ロゴ制作.. ページデザイン . ライティング費 . キャッチコピー . リード文章 . ページ原稿 . ページ作成費

費用の一例 . ページ単価ｘページ数.. ページに書く原稿がある場合の単価と、書き起こしする単価は別.. ページ単価はページのデザイン・レイアウトをどこまでこだわるかにも影響する . 図などの作成費 . システム開発費 . ソフトウェアライセンス費 . 開発費用（人月代）.. 基本設計費.. 詳細設計費.. 構築費.. テスト費用

34

費用の一例.. マニュアル作成費 . 導入支援（講習会）、納品対応 . サーバ、データセンター準備費 . サーバ準備費用.. クラウドになってからクラウド準備費用かわり安価になった傾向がある。 . サーバ設計構築費 . OS、ミドルウェアの購入費 . ウェブサイト運営費用 . ウェブチームの人件費 . 外注するなら修正費用 . コンテンツ（レンタルコンテンツ

の場合）

. マーケティング . アドワーズ、リスティング広告 . メルマガ発布。FAXDMなど . インターネット関連 . ドメイン費 . SSL証明書費 . サーバレンタル . 回線レンタル . クラウドレンタル . ネットワーク保守費用 . サーバ運用費用 . ASP、SaaSサービス利用料 .

35

費用の一例 . システム保守費用 . 不具合がでたときの修正.. 法的な瑕疵範囲は大体1年程度。 . 機能修正.. 普通、なかなか一発で必要な機能

の洗い出しなんてできないです。.. 次年度開発費の50％ぐらいは計上しておくと満足がいく物ができやすい。 . OS、ミドルウェアの更新が必要

になったときに、対応する費用.. アップデートしたら突然、システムが動かなくなることも・・・.. これらのテスト費用、テストサーバレンタル費用

. デザインリニューアル費用 . 新規機能追加費用

などなど。

36

7.システムを作るコストを知る

37

システムなしでできること

システム無しでできるウェブは、この程度です。

. 綺麗なデザイン . わかりやすいコンテンツ . 動画、動きのある画像（Flash等）

このような物を「静的」なウェブサイトといいます。動画があっても静的です。

ただし制作にはWEBの技術が必要で、HTMLやFTPなどといったことを知る必要があります。

38

最近は、様々な外部サービスがあり、これらを使うと様々なことができます。 . ウェブブラウザ経由で簡単にページが編集できるシステム . CMSなどと言われています「検索：CMS、Blog、Wiki を個別に検索」 . 弊社のWIKIPLUSも、この類いのシステムです。是非触ってみてください。 → http://www.wikiplus.jp/ 「検索：WIKIPLUS」 . ショッピングカート . 「検索：ショッピングカート」 . お問い合わせフォーム . 「検索：メールフォーム」 . メルマガシステム . 「検索：メルマガ」

これらの検索ワードと「ASP、レンタル」などといった言葉を一緒に検索します。

クラウド・SaaS・ASP でできること

39

メリット . システムを新たに構築する必要が無い . 色々あるので、ニーズに合わせて選ぶことができる . 比較的安価にサービスに導入できる . 大抵の物はすぐにスタートができるデメリット . 利用料が毎月発生する。 . 微妙〜〜〜に、目的と違っても大抵は余りカスタマイズはできない。 . この微妙な方向性の違いが、集客に大きな影響を及ぼすことも・・・・・・ . データが自分のところではなく、サービス業者に集まる。 . 物によっては自分のところには全く情報は残らないことに注意！.. 利用料が無料の物には多い。無料というメリットは大きいですけどね。.. ただし、最初の目的が、新規販路、営業網の開拓だとすると……。..目的重要！

クラウド・SaaS・ASP の特徴

40

あり物のシステムとは・・・ . 有料でライセンスを購入すると、自分のサーバにインストールできるもの . インストール、設定が社内でできなければ設定費などは必要 . オープンソース等、利用料が無料で使える物 . インストール、設定、場合によっては自分達にあわせて改修する必要が必要

メリット . 1から、作らなくても良いので安いデメリット . 有料の物は改修ができる範囲がすくない物がおおい。

あり物のシステム使う例

41

メリット . ベースがあるので、1から作るのに比べて開発費が安くなることが多い。 . すでに似てる物がある場合、そこをベースにすることで、最初から着地点の想像がつきやすい。 . これはシステム作成における大きなメリット！

デメリット . 誰かが作った物をベースにするため、元の物にある問題も全部引き受けなければならない。 . どっかで見たことがあるサイトになる恐れもある . そのサイトは、それでも構わないのか？勝算がそこにあるのか？ . 目的からもう一度考えなおしてみるとよい。

オープンソースのあり物を使う場合

42

オープンソースのソフトウェアを元にして、ウェブサイトを作るとき、元のソフトウェアを利用して、改修をすることが多々あります。ゼロベースから作るよりも安価にできるのがメリットです。どのぐらい安価かは物による。

こんな問題も・・・・

元のソフトウェア

1.0.0をベースに改修したウェブサイト

この改修の幅が、初期制作費

43




元のソフトウェアが、致命的なバグなどを修正し、Ver.2.0などになりました。

この差をどうやって埋めれば良いのでしょうか？深刻なセキュリティ修正だと、一刻も早く修正する必要があります。

タイミングが選べないという問題があります。

44




Ver.2.0

Ver2をベースにすると、初期制作費と同じだけコストがかかります。

Ver2ベースのウェブサイト

1.0ベースのウェブサイトをベースにすると、元のソフトウェアの開発チームが行った修正を取り入れる作業が必要です。

後にかかるコストまで見て、どの方法が自分に合ってるかを探る必要があります。まさに最初の目的次第！

45

自社専用で作ると、当然コストはかかります。しかし、自社専用で作るのは、こんな理由があります。 . ユーザに新しい体験をさせる。 . サイトにオリジナリティを持たせる必要がある。 . 目的が既存システムでは微妙に合致しない。 . 投資が必要になるサイクルが見えやすい。 . 等・々・・

どんな方法をとっても、取り入れた技術に対する責任はウェブマスターにあります。

自社専用システムを作る理由

46

. 自社専用に特化したシステムを用意。 . オリジナル性が高いサービスができますが、一発で気に入ったものができるのは「稀」です。.. 追加開発費用や保守もコストに含めておいた方が良いでしょう。また、不具合があっても、一般的には瑕疵範囲（保証期限）は1年未満です。 . 開発コストは高め。人件費に直結するので数百万〜数千万……です。 . 汎用ソフトウェアをカスタマイズ。 . 比較的安価に開発ができつつ、そこそこの機能、オリジナリティがある . ただし元となったソフトにアップデートがあったとき、どうするか？.. 「セキュリティ上の問題や致命的な不具合」が発生するとアップデートが必要。.. カスタマイズしたソフトのアップデートは「大変に困難」＝コストがかかる。 . 汎用のシステムをうまく利用する。 . コストは安価 . 自社のオリジナリティは低め。プラグインや設定である程度カバー可能か？

システムに関するまとめ

47

. サイト制作、運用系 . CMS . Blog . ショッピングカートシステム . ポータルエンジン . 解析系 . アクセス解析 . ユーザトラッキングツール . マーケティング系（ウェブサイトへの呼び水系） . SEO/SEM支援ツール . プレスリリースツール

などなど・・・・・・様々なものが世の中には存在します。

様々なシステム

48

. CMS（コンテンツマネジメントシステム） . ページの作成、更新、変更。 . サイトの管理や、ユーザー、ワークフロー管理 . ものすごくたくさんの種類があります。 . Blog（ウェブログ） . WEB日記的なものをベースに拡張されたもの . 最近は様々な派生があり、＊＊CMSといいながら、実は、Blogベースだったりもする。 . ポータルエンジン . ポータルサイトを簡単に作るためのエンジン . 会員管理システム . 顧客情報の管理などなど . ショッピングカートシステム

サイト構築の基盤となるもの

49

. アクセス解析ツール . 統計的にサイトへのアクセス情報管理したりする。無料で使える便利なソフトもおおい。 . ユーザートラッキングツール . 固定のユーザ単位でどんな傾向があるのかを調べるツールなど . サイト誘導ツール . SEOや、SEMを行うために使うもの . 広告用のツール . プレスリリース・ツール（SaaS）

様々なものがあり、日夜、いろいろなものが生まれています。

運営のときにつかうもの

50

8.ウェブサイトの見積の取り方を知る

51

見積をとるには・・・

なじみのホームページ屋さんがいる場合・・・・・・ . 取りあえず、やりたいことを色々話し合って決める。 . 相当話し合わないと、どうしても漏れがでてしまう。

様々なホームページ屋さんに見積を取る場合 . RFP（Request for Proposal ：ご提案のための要求条件をまとめた資料）をきちんとまとめないと、フェアな判断ができない。 . 提案を頂いたら、何でもって判断するか決めておく。

52

相見積をする場合は色々な方法があります。いずれにしてもRFPが非常に重要になります。

. プロポーザル型 . 提案内容とお値段を加味します。 . 一般的にご提案をプレゼンして頂き、その内容で決めます。 . あらかじめRFP何でもって決めるのか、きちんと決めておく方が良いでしょう。 . 入札型 . お値段だけの競争になります。

何で判断するのかきちんと決めておかないと、フェアな相見積はできません。結局社長が見た目で選んじゃって担当者としては存在価値がないなんてことも。

相見積をする場合

53

プロポーザル型の場合、全ての会社があなたの会社のために時間を割いて提案をしてくれます。それ故、フェアで誠実にやる必要があるでしょう。概ね一連に次のような手順で行います。 . 提案をしてくれそうなところ何社かに連絡する。多ければいいわけじゃない。 . RFPを社内で明確に作る。何をしたいのか、どうしたいのか。予算はどのぐらい

か。決めたくない会社も多いみたいですが、決めた方がフォーカスがあった物が出てきます。値段に対してどのぐらいの傾斜配点かも言っておくといいかも。 . オリエンをする日取りを決める。全社同時にやってもOKです。 . オリエン後から質問を受け付ける期間を決める。質問の回答は全員に返す。そっちの方がフェアなので。 . プレゼンの日を決める。順番は抽選で決めるのも良い。日によって気分が変わるので、一気にやった方が良いでしょう。この日までに、非公開で採点表（何で判断するのか）も決めておくと良いです。採点員がそれぞれ得点をつけ、合計得点で決めたりします。 . あらかじめ決めてあった日までに、結果の回答をします。

プロポーザル相見積の手順

54

ホームページ屋さんはプロなので、いろんな抜け道を考えることができます。

. 機能を最も安く作った方が大体勝ちです。 . 物によっては、揚げ足を取った方が勝ちです。 . 一例：会員全員にメールを簡単に配信できる機能をつけてください！ . 営業A：ワンクリックで使い慣れたメーラー使ってメールが送信できます。.. BCCに自動的に、配信先リストが入るリンクを作るだけ。 . 営業B：本文を入力して送信ボタンを押すだけで行けます！.. メールをとにかくサーバからどんどん出すだけ！相手が受け取ったのかしらない！ . 営業C：相手のメールサーバに確実に届くようにしています！.. 様々な機能をチューニングしメールを届くように作る一番下が一番機能的には良いのですが、こういうのを見破ることができますか？また、これらは悪意ではなく、それぞれそれがベストだと思って提案しています。

RFP と相見積の抜け道

55

9.ウェブサイトで分かることを知る

56

テレビのCMやポスター折り込みチラシ以上に、「ウェブだからこそ分かること」があります。

汎用的な物には次のようなことがあります。 . どのぐらいの人が見ているのか？人気のコンテンツはなにか？ . どこから来たのか？検索エンジン？人様のブログ？まとめサイト？ブックマーク？ . どのページで離脱したのか？ . どんな人が見てるのか？組織、地方、時間帯、その他・・・・・・ . 使ってるブラウザ、OS、解像度 . 等・々・・・

ウェブサイトだから分かること

57

ログに残されるもの訪問者があなたの「ウェブ」にアクセスするとどうなるか・・・・・・

「ログ」といわれる「アクセス記録」が、サーバに記録されます。ログには、アクセス者の様々な情報が記録されています。

ログの例59.84.158.116 - - [26/Nov/2010:04:17:03 +0900] “GET / HTTP/1.1”

200 16054 “http://www.wikiplus.jp/” “Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; ja-JP-mac; rv:1.9.2.12) Gecko/20101026 Firefox/3.6.12”

インターネット

アクセス

WEBサーバ

58

ログに残されるもの59.84.158.116 - - [26/Nov/2010:04:17:03 +0900] “GET / HTTP/1.1” 200 16054

“http://www.wikiplus.jp/” “Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; ja-JP-mac; rv:1.9.2.12) Gecko/20101026 Firefox/3.6.12”

. 59.84.158.116 . 訪問者のIPアドレス . IPアドレスからは、訪問者が利用しているプロバイダや、会社名などが分かったりする。状況次第。 . [26/Nov/2010:04:17:03 +0900] . アクセスした時間 . “GET / HTTP/1.1” 200 16054 . アクセス方法(GET)、コンテンツ名「/」、プロトコル「HTTP/1.1」。 . アクセス結果「２００（正常終了）」、コンテンツサイズ「16054バイト」

59

ログに残されるもの . “http://www.wikiplus.jp/” . リファラ、どこのページからリンクされてきたか？.. 空っぽの時は、手で入力したり、ブックマークから。.. セキュリティソフトの設定により、空っぽの時もあり。 . これは、弊社のWikiPlusサイトからのリンクをたぐってきたことがわかる。 . ただし、偽造可能 . “Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.6; ja-JP-mac; rv:1.9.2.12) Gecko/20101026 Firefox/3.6.12” . ユーザエージェント、どんなシステムからアクセスしたか？ . ブラウザの種類（Firefox） . OSの種類（MacOSX 10.6） . 言語コード（日本語） . ただし、偽造可能

たった「これだけ」です！この程度？と、思った人、いますか？

60

「見える化」する「ログ解析ソフト」によって、次のことがわかります。 . アクセス数 . 単純なアクセス数.. ページ内に画像やスタイルシートなどがあっても、1アクセスと数える。1ページを構成する要素の数が多いと増える。用意するサーバの性能の指標にもなる。 . ページビュー.. そのページが見られた回数。要素数が増えても変わらない。ただし、同じ人が行ったり来たり、リロード（F5キー、MacだとCmd+R）しまくると増える。 . セッション数、ビジット数.. 同一IPから同じ時間帯（概ね30分）で来た場合は、同じユーザとして見なす等。 . サイズ.. どのくらいのファイル転送をしていたのか？用意するサーバの性能の指標に。

ログ解析でわかること（１）

61

ログ解析でわかること（２） . 時間帯ごと、日ごと、週ごと、月ごとの、平均的なアクセス傾向分析 . 何時頃にアクセスが多い？夜型サイト？昼型サイト？ . 何曜日にアクセスが多い？などなど・・・ . コンテンツ毎（URL毎）のアクセス数 . 人気のコンテンツはどれ？ . 企業サイトは大抵はTOPですが、他のページかも！ . 入口調査（LPOともいう）、出口調査 . どのページから入り、どこを経由し、どこから出て行ったのか？ . 直帰率。複数ページを見たのか、それとも1ページだけ見て去ったのか？ . 滞在時間 . どれだけ時間をかけてみているか？（読んだのか？）

62

ログ解析でわかること（3） . リンク元（リファラーという、リンクを張ってくれているページのこと) . どこからリンクされ、アクセスされてきたか？.. だれかのブログからのリンク？.. 2chなどの掲示板からのアクセスした場合は、場所まではわからない。.. ちなみにウェブは公開されているものなので「リンク禁止」は通用しません。 . アクセス元（IPアドレス）の調査 . 利用しているプロバイダ、会社名、市町村ぐらいまでは何とかわかる。 . 検索ワード調査 . 検索エンジンで、どんなワードで検索し、アクセスしてきたか？

63

さまざまなタイプの解析ツールがあります。

. ログ解析型 . ビーコン型（ウェブサイトにjavascriptというプログラムを埋め込む） . サーバプログラム型

コスト面でも次のタイプがあります

. 無料のもの . 汎用品で有償のもの . 汎用品だが特殊なプログラムを差し込むもの . そのサイトならではの、特殊な実装

ログ以外の方法

下に行くほど、効果的ですが、高コストです

64

ウェブ解析には、ビーコン型もあります。ブラウザ上で動くプログラムをあらかじめ設置し、そのプログラムが「解析システム」に情報を送ります。

ログ以上に分かるビーコン

プログラム

訪問者のブラウザ

情報の送信

ビーコン型のプログラムは、セッション情報（特定のブラウザか？）から、パソコンの解像度、マウスを動かした場所、クリックした場所、それにかかった時間などを送っています。

解析システム

65

サーバプログラム型の場合は、様々なページに仕掛けをおき、ビーコン型のようなプログラムと併せて、情報を送りあいます。

サーバプログラム型

WEB サーバ

プログラム

訪問者のブラウザ

情報の送受信プログラム

販売サイトなら、誰が、どこで購入を躊躇したのか？とか、立ち上げるサイトの内容に合わせた情報を分析するために情報を集めます。特化した情報取得が可能ですが、その分、特注でつくるため、大抵、コストはかかります。

66

ウェブを運営するには、具体的な目的をたてた方がわかりやすくなります。

それには、コンバージョン（Conversion：転換点）を言うものを定めます。つまりただの訪問者が、お客様になる瞬間です。その判断は、たとえば、

. お問い合わせが欲しい . 資料請求が欲しい . ダウンロードして欲しい . 購入して欲しい . リンクを踏んで欲しい等・々・・

実際に、そこに導く流れを考えると、運営もかなり明確になりますよね。

データをどう生かすか？

67

よく、「ホームページは24時間365日働く営業マンのようなものだ」と言われますが、「いまいち押しが弱いのが玉にキズ」ではあります。

. あくまで「プル型メディア」であって、「プッシュ型メディア」ではない。 . プル＝ユーザ側が見たいときにみる。プッシュ＝押しつける . 一度訪問してくれた相手に対し、再びアクションを起こすのは難しい。 . 会員サイトにしてメールアドレスを貰う.. 現実的にはよっぽどメリットがないとアカウントを作ってくれない . ソーシャル系サイトのIDでログイン（Facebook、Twitter等）させ、最低限、その2つの連絡先を集める。.. これもユーザーに十分なメリットが必要 . その他、サイト独自で知りたいことは、システム系の人間と話し合うとできたり

できなかったりしますね・・・・・・。

ウェブサイトでわかりにくいこと

68

10. SNSは銀の玉ではないことを知る

69

話題の Facebook とか・・・

70

よく「いいね」を集めると、その人に情報をプッシュできるユーザの意見を得ることができるとか言いますが・・・・BtoBの企業でユーザサイドにそう言うニーズってありますか？

そこで、ジャストプレイヤーでは、Pagesにおくコンセプトを決めてみました。 . 自分がユーザとして考えたときに、ウォッチするモチベーションがない・・・・・・。 . とりあえず、サポート窓口には簡単になるか・・・・・・。 . ウォッチしてメリットがある物を書くしかないよね・・・・・・。 . こう言うウェブ講座の記事をちょっとづつ出しますか・・・・・。 . たまーに宣伝入れさせてもらって、僕らを知って貰うことにしましょう。

現在、実験中です。

企業のページって見ますか？

71

11.青写真は誰が作るのか？を知る

72

大きなサイトでも小さなサイトでも、作りたいサイトを知ってるのは、自分達です。

どんな技術を使っても、どんな外注を使っても、責任を取るのは自分達です。

自分のサイトは自分のお客様のために提供しています。お客様への誠実なアプローチは重要です。

ウェブはそのための道具に過ぎません。

作りたいサイトを知ってるのはだれ？

73

12.協力者は誰か知る

74

たとえば、様々な方法があります。 . コンサルを雇う。 . 頼りになりそうなホームページ屋さんを探す . 勉強をして色んな人と出会い自分がリードする . 等々

実は大切なのは、発注者、受託者の関係にするのではなく、全員でコントリビュータ（協力者）になれる関係を築いていくのが一番の近道です。

目的を共有し、良い到着点を探すことができるのが一番ベストです。良い縁があれば、相見積も実は要らないんですよね。

自分達だけできますか？

75

13.ウェブサイトは完成しないことを知る

76

そもそも、ウェブサイトの立ち上げ目的は何だったでしょうか？ . 宣伝、サポート、販売、ポータル、コミュニティ・・・・

宣伝ならつまり・・・ . 自社（自分の組織）、自社の業務内容、自社の商品、サービス、活動、技術等々を広く知らしめるのが目的。

どんな組織でも、業務内容は、時流に合わせて刻々と変化します。

ウェブ運営の目的は、 . 絶えず変化する自社組織の情報を時流に合わせて宣伝するため、正しい情報を伝えつづけることにある！

じゃあ、何をすればいいのでしょう？

ウェブサイトの目的を考え直す

77

PDCA を考えよう

Plan （計画）従来の実績や将来の予測などを

もとにして業務計画を

作成する

（実施・実行） Do計画に沿って

業務を行う

Act （処置・改善）実施が計画に沿っていない

部分を調べて処置をする

（点検・評価） Check業務の実施が

計画に沿っているかどうかを

確認する

ウェブの運営が、これらにどう当てはめるか、考えていきましょう！

78

何を知りたいの？自分のDo（実行したこと）の結果ですよね？ . コンテンツを増やしたなら・・・・・・ . どれだけの人に読んでもらってる？ . 興味深かったのはどこ？ . 書き方を変えてみたなら・・・・・・ . わかりやすくなった？検索エンジン経由の人が増えたか？ . サイトマップの構造をかえてみたなら・・・・・・ . 末端のコンテンツまで、ちゃんとたどり着いてもらえたか？ . デザインを変えてみたなら・・・・・・ . 訪問者が迷わなくなったかどうか？反応は？ . 販売サイトの申し込みの場所、流れを変えたなら・・・・・・ . カートに入れたけど買ってない人の確率は？ . 購入で踏みとどまってるのはなぜなの？

「ウェブ解析」Check に使うツール

79

自分たちが、見て欲しい人に対して露出を増やす！一見、アクセス数を増やすことに近しいが、微妙に違う！

どんなことがするのか？ . コンテンツを増やす！ . ウェブに来て貰うように広告する！ . お得意様にメルマガを出してみる！ . 検索エンジンからアクセスしてもらうように工夫する！ . Twitterでつぶやいてみる。Facebookを作ってみる！ . ブログを書いている人に、リンクを張ってもらう！

いずれの方法をとっても、様々な工夫をしつつ、どれが効果があったのか、再びPDCAを回し、きちんと考察する！

Act! 次にするべきこと

80

ウェブでは何を PDCA とするか？

Plan （計画）運営ミーティング

・コンバージョンとは？・どのような方法で？・誰がやるのか？

（実施・実行） Do誘導方法を考える

サイトの見せ方を変える

解析ツールを設置

Act （処置・改善）コンバージョン率の改善？アクセス数不足？誘導路を増やす。宣伝？メルマガ？検索エンジン対策をするべき？

（点検・評価） Check解析ソフトで結果をみる

コンバージョン率を測定する

ユーザ層は？

このように、様々なことを考察すると、どのような指標でウェブを成長させて良いかがわかります！

81

. 宣伝 . 広告を出す。CMを打つ。ポスターを貼る。などなど . コストはかかる。認知度は上がるが、アクセスはなかなか直結しない。 . プレスリリースを打つ . 様々なプレスのメールアドレスを押さえておけば、自分でメールを打つだけ。ウェブプレスなら、ウェブ上に受付窓口がだいたい公開されています。 . プレスの受付窓口には、たくさんのメールを受け取っているはずなので、メールの件名を受け取る人がわかりやすいように！ . 一斉にプレスを打つことができる有料サービスサイトもある。この場合、プレスにメールするコンサルもついていたりする。 . 同じ商品で3回はPRは打たないと、記者が名前を覚えてくれないと思った方がよい。 . 目新しければ、「一時的に」アクセスがそこそこ増える。

アクセスを増やすために（１）

82

アクセスを増やすために（2） . メルマガ . 自分たちのお客様候補に近いユーザを集めることができれば効果が高い . メルマガを出すには、メールアドレスを集める必要あり . メールアドレスをどうやって集めるかはルールがある。.. 登録すると、登録者にお得な情報が届く。.. 会員サイトなら、登録しないとつかえない。.. 変なところからメールアドレスを収集すると、悲惨な結果にもつながる！注意！ . 検索エンジンからアクセスしてもらう？ . SEO。SEM。LPO（入り口調査と最適化）などの技術を学ぶ必要あり . どんな言葉（ワード）で検索してほしいのか？検索ワードの選定。 . 検索エンジンに広告を出すという方法もある。.. 競争率が高い言葉は、アドワーズ広告は高い！しかも直帰率が高い！ . 複数組み合わせは競争率が割と低め。「静岡駅周辺コーヒー」など。コン

バージョン率も高め。

83

アクセスを増やすために（3） . CGM（Consumer Generated Media） . ブロガーにリンクを張ってもらう.. ブログは一般的に、普通の企業サイトよりもアクセスは多いが、そのブロガーの読

者層が、自社のお客様候補にあっているかはわからない。.. ブロガーはプロではないので、マイナスのことを書かれる恐れもある。 . Twitterでつぶやく、FacebookなどのSNSを利用する.. 最近人気のインターネットのコミュニケーションツール。大抵は無料。.. Twitterの場合、フォロワーといって、自分のポストしたメッセージを受信してくれるユーザを増やす必要がある。.. 自分がフォローするとフォローしてくれるユーザは多い。.. ユーザの利用ニーズの変化は速い。仕組みはシンプルだが、ユーザに好印象を持ってもらえるかはわからない。

CGMは受け手の立場になることが大事。お得な情報情報は欲しいけれど、不要な情報はいらないでしょ？

84

訪問者が、検索エンジン（GoogleとかYahooなど）から、とあるキーワードで検索を行った際、自分のサイトにうまく誘導するようにする「努力」のこと

まず、こんな事実があります。 . 多くの人は、インターネットで調べごとをするときには、最初に検索エンジンを利用しています。そのサイトが日本では、Yahoo、Googleが圧倒的に多い。 . ほとんどのユーザーは調べたい事柄をキーワード検索して、1ページ目の1番上に表示されたものを、最初に見ます。 . 2段目、3段目・・・となる度に、見る確率は下がります。検索が次ページ以降になると「壊滅的」に見てくれません。 . それ故、1ページ目に何とかして載せる必要が出てくるのですが・・・・・・。

それには、「工夫と努力」が必要です。

S)earch E)ngine O)ptimization

85

検索エンジンとは、何のためのサイトなのでしょう？

■ たぶん普遍的 . ユーザが調べごとをしたいときに、利用してもらいたいサイト . そのためには、確実で鮮度の高い情報を届ける必要がある。 . 利便性もあげちゃったりして、いろんな用途に使って欲しい！

たとえば、Googleなどでは・・・ . 良いサイトにリンクされているサイトは良いサイトである。

Yahooなどでは、 . 人力で良いサイトを登録する。 . なければ提携した検索エンジンをつかう

検索エンジンはどうやって順番を決める？

86

実はとてもシンプル！ . 検索エンジンは、あなたのサイトを順位外にしたいわけではない！ . 有用な情報は、どんどん表示させたいのです！ . WEBサイト内に有用な情報があれば、検索をしてもらえます。 . 古い情報よりも新しい情報の方が普通は有効！

つまり・・・・・・ . 有用な情報を掲載する . 有用な情報なら、誰かがリンクを張ってくれる！ . 鮮度の高い情報をどんどん掲載する . 更新が多ければ、検索エンジンは定期的にあなたのサイトに調査に来る。 . コンテンツ量が増えると確率も上がる！ . 2倍のページがあれば、2倍アクセスがくる理論：）

最大にして基本の SEO

87

運用体制をどう整えるか？

. 運営チームの立ち上げ . タスクフォースの作成。 . ウェブに掲載するべき内容を精査する。 . 社内での情報共有。 . メーリングリストなどの作成し、ウェブに掲載すべき内容を集められるようにする。 . 運営会議 . 定期的に行う . イベントごとに行う . 社内で出来るタスクと出来ないタスクを分析する。

運用体制をどう整えるか？

88

ジャストプレイヤー株式会社

代表取締役社長瀧　康史

http://www.justplayer.co.jp/TEL: 054-203-5535

Mail: info @ justplayer.com

ご静聴ありがとうございました。

ホームページを制作する前に知っておきたい13のこと

Documents