狠狠撸

MICAN セミナー 2012.04.19

ホームページを制作する前に
知っておきたい13のこと
?ウェブサイトを軌道に乗せるための知識?

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

1

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

13個あるので秘密 :)

2

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

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

..
Usability 事業内容

..
WEB
（ホームページ）制作事業

..
WEB企画、デザイン制作

..
Contents Server-Side WEBシステム開発

..
Management Program
クラウドソフトウェア制作事業
クラウドインフラ賃貸事業、ホスティ
ング賃貸事業

..
Cloud Technology その他

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

自己紹介 : 瀧　康史
..
..
ジャストプレイヤー株式会社代表取締役社長

..
出身地

..
静岡市（旧清水市）

..
業務履歴

..
ライター業（テクニカルライター）

..
S社’X紙’
（S社のパソコン向け雑誌）

..
S社にてS社用ゲーム機のゲームソフト開発

..
ゲームディレクター、アシスタントプロデューサ?、プランナー等

..
有限会社ジャストプレイヤーを起業（2001年11月）

..
ジャストプレイヤー株式会社に改組（2006年7月）

..
その他

..
日本OpenSolarisUsersGroup Leader
静岡WEBデベロッパーフォーラムやすし虫

4

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

「今更」感があるテーマですが、う一度考えてみまょ
もしう。
自社（組織）
がどんな相手に、
どんなこを知らせたいのか
と？
どんなビジネス
（仕事）
を行っているのか
まずは、
それから考えてみまょ
しう

5

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

..
目的

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

..
ターゲット

..
誰のためのウェブサイトか？どんな人が見るのですか？

..
どんな人？
見込み客に見て欲しい等々。

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

6

自社にとってのウェブとは？
コンテンツ
　ウェブの内容のこと。
目的ターゲット
??宣伝
　対象のこと。
??サポート
??販売 BtoB
　Business to Business
　事業者向け

コンテンツターゲット BtoC
??プロダクト、商品 ??BtoB 　Business to Consumer
??会社の社会貢献 ??BtoC
??業界の動向 ??One to One 　一般顧客向け
One to One
　一人から一人へ、ロングテ
ール?　
??

7

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

8

ウェブに掲載したいことは？
..
..
プロダク商品
ト、

..
自社で取り扱うサービス、プロダクト、商品などの紹介。

..
会社の情報、社会貢献

..
会社概要、沿革、方針、ポリシー

..
アクセスマップ、場所を表す地図

..
リクルート情報

..
業界全体の動向

..
業界の推移（読み物的な要素が増える）
関連業種のコミュニティサイポータル
ト、

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

9

具体例
..
..
目的が宣伝で、対象が見込み客ならば??
??
??

..
自社がお客さんにしたいというクライアントを思い浮かべる。

..
その方にパンフレットを配るならどんなことを書くのか考えてみましょう。

..
自社技術（できること）を紹介したい→技術概要

..
自社製品の紹介→商品概要

..
自社サービスの紹介→サービス概要

..
見込み客に対する類似事例の紹介→実績紹介

..
じゃんじゃんアクセスがあって、じゃんじゃん問い合わせが欲しいですか？

..
目的がサポートで、対象が自社製品（サービス）の顧客なら??
??
??

..
製品の使い方。マニュアル、チュートリアル、利用シーン等々。

..
FAQ

..
自助努力するユーザなら、勝手に調べて勝手に解決→サポートコスト圧縮
これは見えないところで発生しますよね？
ウェブの対価はわかりにくい！
10

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

サポート

販売

情報ポータル

コミュニティ

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

会社概要

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

12

会社概要のページ

..
会社概要のページには、一般に次の事柄が書いてあります。

..
正式な社名、日本語、英語など。

..
事業内容
定款に書かれたものをベースに、もう少し柔らかい言葉で書いてみると良い

..
でしょう。

..
役員の氏名など
隠されてると事情がきになりますね。会社役員は公人なので、明らかになっ

..
ても仕方がないのです。

..
住所、電話番号、所在地、アクセスマップなど。来訪者が困らないように。

..
資本金、差し支えなければ取引銀行。

..
差し支えなければ取引先。

..
会社の沿革
会社の歴史です。何年に創業し、どんな事業をやってきたのか。事業部の発
足、サービス開始日やプロダクトの発売日等々 ?
??
13

その他必要な物
..
..
アクセスマップ

..
最近はGoogleMapなどで簡単に作ることができます。

..
訪問者が困らないように地図をつけた方がいいでしょう。

..
絵を書く場合、絵を描くコストがそこそこかかります。

..
弊社のWIKIPLUSだと住所を入力するだけで簡単に張り込めます。

..
個人情報保護（プライバシーポリシー）

..
個人情報を集める場合は、記載しておく必要があります。

..
当サイトのポリシー
著作物、免責、動作環境（ブラウザ、OS）リンク情報
、（リンク推奨箇所な

..
ど）もっとも、
。リンク不可ってのは無理ですが。

..
特定商取引法に基づく表記、サービス利用約款
サービスや、ネットショップをする場合は必須です

14

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

15

社ロゴ、マーク
..
..
ロゴ
（あったほうがウェブサイトがしっくり来るもの）

..
名刺などに使っているロゴがあれば、そのベクター型データが必要

..
ベクター型データ：Adobe Illustratorなどで作られてることが多い。

..
案外、いつも頼んでいる名刺の印刷屋さんがもってたり（笑）

..
ロゴが無い会社なら……

..
自動ロゴ作成サイト（無料）などで作れなくはない→「検索：ロゴ作成サイト」

..
デザイナーに作って貰う。お値段はものすごくピンキリ！

..
お任せで作って貰う場合、イメージをちゃんと伝えないとイメージ通りにならない
方向性を定める素案を数種類作って貰う場合、お値段はそこそこします。

マーク全部併せてロゴ

16

トップページの写真など???
..
..
写真

..
ご自慢の社屋があれば撮った方がいいかも！

..
ご自慢の製品の写真を撮ってみた方がいいかも！
工業製品でも利用してる人間の写真があると、なんとなく柔らかい感じがし

..
ます。

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

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

17

コーポレートカラー
..
..
コーポレートカラー

..
会社をイメージするカラーです。

..
ジャストプレイヤー株式会社の場合は、上のタイトルなどにもあるオレンジです。
実は静岡で起業したので、「お茶の色→グリーン」「ミカンの色→オレンジ」
、のど
ちらかで考えました。マークがグリーンよりもオレンジの方が合ったのでオレンジ

..
にしました。

..
大抵の会社は、名刺などに色が付いています。

..
ウェブサイトのカラーも何となく会社のイメージとなるので重要です。

..
偉い人に聞いてみましょう。

..
「無いから四季折々で変えたい」という会社もあります。

..
色にはイメージがあります。赤→情熱、青→クールさ等々。
ウェブデザインを外注する場合、カラーを最初に伝えた方が、イメージが伝
わりやすいでしょう。

18

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

19

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

..
..
コンセプト

..
サイト构造

..
デザイン

..
コンテンツ

..
マーケティング

..
システム、ドルウェア
ミ
サーバー

20

コンセプト

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

..
..
様々なレイヤーにある

..
どんなサイトにすべきなのか？

..
何をしたいのか？
何を訴えたいのか？

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

21

サイト构造

..
サイトの構造（サイトマップ）ゾーニング
、（切り口）

..
サイトマップ

..
何をどこに置くのか？

..
ナビゲーションゾーニング
?

..
どうやって誘導するのか？

..
トップページレイアウ ?
トゾーニング

..
どう見せるのか？

..
ユーザビリティ、アクセシビリティ
使いやすさ、ユニバーサルデザイン

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

22

サイトマップ
Gloval navi

..
どのページに何を配置するのか、考え
トップページ会社情報

..
ておく必要があります。サービス

右の例は2階層ですが、大体3階層ぐ

..
事例紹介
らいまでで留めます。
目的のコンテンツまで3クリック程度資料請求

で行けることが理想です。
最新情報

個人情報保護方針

お問い合わせ

サイトマップ

23

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

グローバルナビゲーション
それぞれのエリアで何をさ
せるのか？
サイドメニュー
トップページアイキャッチ画像

会社情報
挨拶?サイト説明等

リンク?バナー

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

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

24

デザイン
..
..
全体のデザインの方向性

..
デザインコンセプト

..
寒色、暖色、使って良い色

..
クリックできる場所、強調など意味を持つ色

..
等々

..
トップページのデザイン

..
デザインコンセプトを最大限表現する

..
第2階層のデザイン

..
どのぐらい見せる物を用意するのか？

..
デザインが多ければコストがかかる

..
末端のページのデザイン
デザインコンセプトから外れないこと等

25

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

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

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

26

コンテンツ内容
何を書かないとならないのか、整理する。

..
..
ニュースなどの新着情報

..
プロダクサービス、
ト、商品

..
会社の情報、沿革、アクセスアップ
業界の情報

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

..
っているのか？
表示したいコンテンツとはなにか？

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

27

マーケティングと运営

..
ウェブそのもののマーケティング

..
検索エンジン対策（SEO）

..
検索エンジンマーケティング
（SEM）

..
ウェブ広告

..
Google Adwords、Yahoo! リスティング

..
メルマガ

..
CGM
（Consumer Geenrated Media）

..
ソーシャルメディア系の利用
SNS、Facebook、Twitterの利用など
どうやってユーザをウェブに誘導するのか？
パンフレットを誰に配るのか？という考え方に近
い。業界紙、雑誌広告、新聞、などなど。
紙からネットの難易度は？

28

システム?ミドルウェア
特別なシステム（ツール）が必要か？ドルウェア
ミ（

..
無償有償）
? は何を利用するのか？

..
お問い合わせ機能が必要？

..
顧客はログインが必要？

..
ショッピングカート機能が必要？

..
個人データの貯蓄は？

..
どんな人が運用するのか？
コンテンツの書き換えは？

..
種類

..
CMS、Wiki、Blog

..
販売サイトツール

..
ショッピングカートツール
ポータルシステム

29

サーバー?インターネット接続
サービスを担うサーバとインターネット接続。
どのぐらいの品質が必要かは、そのサービスが停
「
止するときのインパクトはどの程度か？」で決める
と良いでしょう。

..
落とさないサーバは「コスがとてもかかります
ト」！

..
サーバ

..
サービスを稼働させるためのコンピュータ。

..
機能による制約も多い。

..
安定性はどの程度、必要か？

..
インターネット接続（サーバ）

..
安定性
高速性
これらを保守する人は誰？24時間365日対応は必要？

30

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

31

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

..
人に頼むことになる範囲

..
コンテンツ

..
デザイン

..
システム

..
サーバ
運用

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

32

费用の一例
.. ..
.. ..
ディレクション費ページ単価ｘページ数

..
現場の進行に関する内容ページに書く原稿がある場合の単

..
価と、書き起こしする単価は別

..
デザイン費
ページ単価はページのデザインレ
?

..
デザイン費イアウトをどこまでこだわるかに

.. ..
トータルデザインも影響する

.. ..
TOPページデザイン図などの作成費

.. ..
ロゴ制作システム開発費

.. ..
ページデザインソフトウェアライセンス費

.. ..
ライティング費開発費用（人月代）

.. ..
キャッチコピー基本設計費

.. ..
リード文章詳細設計費

.. ..
ページ原稿構築費
テスト費用
ページ作成費

33

费用の一例
.. ..
.. ..
マニュアル作成費マーケティング

.. ..
導入支援（講習会）納品対応
、アドワーズ、リスティング広告

.. ..
サーバ、
データセンター準備費メルマガ発布。FAXDMなど

.. ..
サーバ準備費用インターネット関連

..
クラウドになってからクラウド準ドメイン費
備費用かわり安価になった傾向が

.. ..
ある。 SSL証明書費

.. ..
サーバ設計構築費サーバレンタル

.. ..
OS、ミドルウェアの購入費回線レンタル

.. ..
ウェブサイト運営費用クラウドレンタル

.. ..
ウェブチームの人件費ネットワーク保守費用

.. ..
外注するなら修正費用サーバ運用費用

..
コンテンツ（レンタルコンテンツ ASP、SaaSサービス利用料
の場合）

34

费用の一例
.. ..
.. ..
システム保守費用デザインリニューアル費用

..
不具合がでたときの修正新規機能追加費用

..
法的な瑕疵範囲は大体1年程度。

..
機能修正
普通、なかなか一発で必要な機能

..
の洗い出しなんてできないです。
次年度開発費の50％ぐらいは計
上しておくと満足がいく物ができ

..
やすい。
などなど。
OS、ミドルウェアの更新が必要

..
になったときに、対応する費用
アップデートしたら突然、システ

..
ムが動かなくなることも? ?
?
これらのテスト費用、テストサー
バレンタル費用

35

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

36

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

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

..
..
綺麗なデザイン

..
わかりやすいコンテンツ
動画、動きのある画像（Flash等）

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

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

37

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

..
最近は、様々な外部サービスがあり、
これらを使うと様々なことができます。

..
ウェブブラウザ経由で簡単にページが編集できるシステム

..
CMSなどと言われています「検索：CMS、Blog、Wiki を個別に検索」
弊社のWIKIPLUSも、この類いのシステムです。是非触ってみてください。

..
→ http://www.wikiplus.jp/ 「検索：WIKIPLUS」

..
ショッピングカート

..
「検索：ショッピングカート」

..
お問い合わせフォーム

..
「検索：メールフォーム」

..
メルマガシステム
「検索：メルマガ」

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

38

クラウド?SaaS?ASP の特徴

..
メリト
ッ

..
システムを新たに構築する必要が無い

..
色々あるので、ニーズに合わせて選ぶことができる

..
比較的安価にサービスに導入できる
大抵の物はすぐにスタートができる

..
デメリト
ッ

..
利用料が毎月発生する。

..
微妙???に、目的と違っても大抵は余りカスタマイズはできない。

..
この微妙な方向性の違いが、集客に大きな影響を及ぼすことも? ? ?
???

..
データが自分のところではなく、サービス業者に集まる。

..
物によっては自分のところには全く情報は残らないことに注意！

..
利用料が無料の物には多い。無料というメリットは大きいですけどね。
ただし、最初の目的が、新規販路、営業網の開拓だとすると……。目的重要！

39

あり物のシステム使う例

..
あり物のシステムとは?
??

..
有料でライセンスを購入すると、自分のサーバにインストールできるもの

..
インストール、設定が社内でできなければ設定費などは必要

..
オープンソース等、利用料が無料で使える物
インストール、設定、場合によっては自分達にあわせて改修する必要が必要

..
メリト
ッ
1から、作らなくても良いので安い

..
デメリト
ッ
有料の物は改修ができる範囲がすくない物がおおい。

40

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

..
メリト
ッ

..
ベースがあるので、1から作るのに比べて開発費が安くなることが多い。
すでに似てる物がある場合、そこをベースにすることで、最初から着地点の想

..
像がつきやすい。
これはシステム作成における大きなメリット！

..
デメリト
ッ
誰かが作った物をベースにするため、元の物にある問題も全部引き受けなけれ

..
ばならない。

..
どっかで見たことがあるサイトになる恐れもある

..
そのサイトは、それでも構わないのか？勝算がそこにあるのか？
目的からもう一度考えなおしてみるとよい。

41

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

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

1.0.0をベースに
改修したウェブサイト
元のソフトウェア

42

この差をどうやって埋めれば良い
のでしょうか？
元のソフトウェアが、
致命的なバグなどを深刻なセキュリティ修正だと、一刻
修正し、Ver.2.0なども早く修正する必要があります。
になりました。

タイミングが選べないという問題
があります。
この改修の幅が、初期制作費


43

痴别谤2をベースにすると、初期 Ver2ベースの
制作費と同じだけコストがかウェブサイト
かります。
1.0ベースのウェ
Ver.2.0
ブサイトをベース
にすると、元のソ
フトウェアの開発
チームが行った
この改修の幅が、初期制作費修正を取り入れ
る作業が必要で
す。

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

44

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

自社専用で作ると、当然コストはかかります。

..
しかし、自社専用で作るのは、
こんな理由があります。

..
ユーザに新しい体験をさせる。

..
サイトにオリジナリティを持たせる必要がある。

..
目的が既存システムでは微妙に合致しない。

..
投資が必要になるサイクルが見えやすい。
等々?
??

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

45

システムに関するまとめ
..
..
自社専用に特化したシステムを用意。
オリジナル性が高いサービスができますが、一発で気に入ったものができ

..
るのは「稀」です。
追加開発費用や保守もコストに含めておいた方が良いでしょう。また、不具合があ

..
っても、一般的には瑕疵範囲（保証期限）は1年未満です。

..
開発コストは高め。人件費に直結するので数百万?数千万……です。

..
汎用ソフトウェアをカスタマイズ。

..
比較的安価に開発ができつつ、そこそこの機能、オリジナリティがある

..
ただし元となったソフトにアップデートがあったとき、どうするか？

..
「セキュリティ上の問題や致命的な不具合」が発生するとアップデートが必要。

..
カスタマイズしたソフトのアップデートは「大変に困難」＝コストがかかる。

..
汎用のシステムをうまく利用する。

..
コストは安価
自社のオリジナリティは低め。プラグインや設定である程度カバー可能か？
46

様々なシステム
..
..
サイト制作、運用系

..
CMS

..
Blog

..
ショッピングカートシステム

..
ポータルエンジン

..
解析系

..
アクセス解析

..
ユーザトラッキングツール

..
マーケティング系（ウェブサイトへの呼び水系）

..
SEO/SEM支援ツール
プレスリリースツール

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

サイト構築の基盤となるもの
..
..
CMS
（コンテンツマネジメントシステム）

..
ページの作成、更新、変更。

..
サイトの管理や、ユーザー、ワークフロー管理

..
ものすごくたくさんの種類があります。

..
Blog
（ウェブログ）

..
WEB日記的なものをベースに拡張されたもの
最近は様々な派生があり、＊＊CMSといいながら、実は、Blogベースだった

..
りもする。

..
ポータルエンジン

..
ポータルサイトを簡単に作るためのエンジン

..
会員管理システム

..
顧客情報の管理などなど
ショッピングカートシステム

48

運営のときにつかうもの
..
..
アクセス解析ツール
統計的にサイトへのアクセス情報管理したりする。無料で使える便利なソフ

..
トもおおい。

..
ユーザートラッキングツール

..
固定のユーザ単位でどんな傾向があるのかを調べるツールなど

..
サイト誘導ツール

..
SEOや、SEMを行うために使うもの

..
広告用のツール
プレスリリースツール
? （SaaS）

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

49

8.ウェブサイトの见积の取り方を知る

50

見積をとるには???

..
なじみのホームページ屋さんがいる場合??
??
??

..
取りあえず、
やりたいことを色々話し合って決める。
相当話し合わないと、
どうしても漏れがでてしまう。

..
様々なホームページ屋さんに見積を取る場合
RFP
（Request for Proposal ：ご提案のための要求条件をまとめた資料）
を

..
きちんとまとめないと、フェアな判断ができない。
提案を頂いたら、何でもって判断するか決めておく。

51

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

..
..
プロポーザル型

..
提案内容とお値段を加味します。

..
一般的にご提案をプレゼンして頂き、その内容で決めます。
あらかじめRFP何でもって決めるのか、きちんと決めておく方が良いでしょ

..
う。

..
入札型
お値段だけの競争になります。

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

52

プロポーザル相見積の手順
プロポーザル型の場合、全ての会社があなたの会社のために時間を割いて提案
をしてくれます。それ故、
フェアで誠実にやる必要があるでしょう。

..
概ね一連に次のような手順で行います。

..
提案をしてくれそうなところ何社かに連絡する。多ければいいわけじゃない。
RFPを社内で明確に作る。何をしたいのか、
どうしたいのか。予算はどのぐらい
か。決めたくない会社も多いみたいですが、決めた方がフォーカスがあった物

..
が出てきます。値段に対してどのぐらいの傾斜配点かも言っておくといいかも。

..
オリエンをする日取りを決める。全社同時にやってもOKです。
オリエン後から質問を受け付ける期間を決める。質問の回答は全員に返す。そ

..
っちの方がフェアなので。
プレゼンの日を決める。順番は抽選で決めるのも良い。日によって気分が変わ
るので、一気にやった方が良いでしょこの日までに、
う。非公開で採点表（何で判
断するのか）も決めておくと良いです。採点員がそれぞれ得点をつけ、合計得点

..
で決めたりします。
あらかじめ決めてあった日までに、結果の回答をします。

53

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

..
..
機能を最も安く作った方が大体勝ちです。

..
物によっては、揚げ足を取った方が勝ちです。

..
一例会員全員にメールを簡単に配信できる機能をつけてください
：！

..
営業A：ワンクリックで使い慣れたメーラー使ってメールが送信できます。

..
BCCに自動的に、配信先リストが入るリンクを作るだけ。

..
営業B：本文を入力して送信ボタンを押すだけで行けます！

..
メールをとにかくサーバからどんどん出すだけ！相手が受け取ったのかしらない！

..
営業C：相手のメールサーバに確実に届くようにしています！
様々な機能をチューニングしメールを届くように作る
一番下が一番機能的には良いのですが、
こういうのを見破ることができますか？
また、
これらは悪意ではなく、それぞれそれがベストだと思って提案しています。

54

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

55

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

..
汎用的な物には次のようなことがあります。

..
どのぐらいの人が見ているのか？人気のコンテンツはなにか？

..
どこから来たのか？検索エンジン？人様のブログまとめサイ？
？トブックマーク？

..
どのページで離脱したのか？

..
どんな人が見てるのか？組織、地方、時間帯、その他??
??
??

..
使ってるブラウザ、OS、解像度
等々?
??
?

56

ログに残されるもの
訪問者があなたの「ウェブ」にアクセスするとどうなるか??
??
??
「ログ」
といわれる
「アクセス記録」サーバに記録されます。
が、
ログには、アクセス者の様々な情報が記録されています。

インターネット

アクセス

WEBサーバ

ログの例
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”

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”

..
..
59.84.158.116

..
訪問者のIPアドレス
IPアドレスからは、訪問者が利用しているプロバイダや、会社名などが分か

..
ったりする。状況次第。

..
[26/Nov/2010:04:17:03 +0900]

..
アクセスした時間

..
“GET / HTTP/1.1”200 16054

..
アクセス方法(GET)、コンテンツ名「/」プロトコル
、「HTTP/1.1 。
」
アクセス結果「２００（正常終了）、
」コンテンツサイズ「16054バイト」

58

..
..
“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）

..
言語コード（日本語）
たった「これだけ」！
です
ただし、偽造可能
この程度？と、思った人、いますか？

59

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

..
「見える化」「ログ解析ソフによって、
するト」次のことがわかります。

..
アクセス数

..
単純なアクセス数
ページ内に画像やスタイルシートなどがあっても、1アクセスと数える。1ページを

..
構成する要素の数が多いと増える。用意するサーバの性能の指標にもなる。

..
ページビュー
そのページが見られた回数。要素数が増えても変わらない。ただし、同じ人が行っ

..
たり来たり、リロード（F5キー、MacだとCmd+R）しまくると増える。

..
セッション数、ビジット数

..
同一IPから同じ時間帯（概ね30分）で来た場合は、同じユーザとして見なす等。

..
サイズ
どのくらいのファイル転送をしていたのか？用意するサーバの性能の指標に。

60

ログ解析でわかること（２）
..
..
時間帯ごと、日ごと、週ごと、月ごとの、平均的なアクセス傾向分析

..
何時頃にアクセスが多い？夜型サイト？昼型サイト？

..
何曜日にアクセスが多い？などなど ?
??

..
コンテンツ毎（URL毎）のアクセス数

..
人気のコンテンツはどれ？

..
企業サイトは大抵はTOPですが、他のページかも！

..
入口調査（LPOともいう）出口調査
、

..
どのページから入り、どこを経由し、どこから出て行ったのか？

..
直帰率。複数ページを見たのか、それとも1ページだけ見て去ったのか？

..
滞在時間
どれだけ時間をかけてみているか？（読んだのか？）

61

ログ解析でわかること（3）
..
..
リンク元（リファラーという、
リンクを張ってくれているページのこと)

..
どこからリンクされ、アクセスされてきたか？

..
だれかのブログからのリンク？

..
2chなどの掲示板からのアクセスした場合は、場所まではわからない。

..
ちなみにウェブは公開されているものなので「リンク禁止」は通用しません。

..
アクセス元（IPアドレス）の調査

..
利用しているプロバイダ、会社名、市町村ぐらいまでは何とかわかる。

..
検索ワード調査
検索エンジンで、どんなワードで検索し、アクセスしてきたか？

62

ログ以外の方法
さまざまなタイプの解析ツールがあります。

..
..
ログ解析型

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

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

..
..
無料のもの下に行くほど、

..
汎用品で有償のもの効果的ですが、

..
汎用品だが特殊なプログラムを差し込むもの高コストです
そのサイトならではの、特殊な実装

63

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

プログラム情報の送信

解析システム
訪問者のブラウザ

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

64

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

プログラム情報の送受信プログラム

WEB サーバ
訪問者のブラウザ

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

65

データをどう生かすか？
ウェブを運営するには、具体的な目的をたてた方がわかりやすくなります。

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

..
..
お問い合わせが欲しい

..
資料請求が欲しい

..
ダウンロードして欲しい

..
購入して欲しい
リンクを踏んで欲しい等々?
??

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

66

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

..
..
あくまで「プル型メディア」であって、プッシュ型メディア」
「ではない。

..
プル＝ユーザ側が見たいときにみる。プッシュ＝押しつける

..
一度訪問してくれた相手に対し、再びアクションを起こすのは難しい。

..
会員サイトにしてメールアドレスを貰う

..
現実的にはよっぽどメリットがないとアカウントを作ってくれない
ソーシャル系サイトのIDでログイン（Facebook、Twitter等）させ、最低限、

..
その2つの連絡先を集める。

..
これもユーザーに十分なメリットが必要
その他、ト独自で知りたいことは、
サイシステム系の人間と話し合うとできたり
できなかったりしますね??。
??
??

67

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

68

話題の Facebook とか???

69

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

..
そこで、
ジャストプレイヤーでは、Pagesにおくコンセプトを決めてみました。

..
自分がユーザとして考えたときに、ッチするモチベーションがない??。
ウォ ??
??

..
とりあえず、サポート窓口には簡単になるか??。
??
??

..
ウォッチしてメリトがある物を書く
ッしかないよね??。
??
??

..
こう言うウェブ講座の記事をちょっとづつ出しますか??
??。
?
たまーに宣伝入れさせてもらって、僕らを知って貰うことにしましょう。

現在、実験中です。

70

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

71

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

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

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

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

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

72

12.协力者は谁か知る

73

自分達だけできますか？

..
たとえば、様々な方法があります。

..
コンサルを雇う。

..
頼りになりそうなホームページ屋さんを探す

..
勉強をして色んな人と出会い自分がリードする
等々

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

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

74

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

75

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

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

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

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

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

76

PDCA を考えよう

Plan（計画）（実施実行）Do
?
従来の実績や将来の予測などを計画に沿って
もとにして業務計画を業務を行う
作成する

Act（処置改善）
? （点検評価）Check
?
実施が計画に沿っていない業務の実施が
部分を調べて処置をする計画に沿っているかどうかを
確認する

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

77

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

..
何を知りたいの？自分のDo
（実行したこと）の結果ですよね？

..
コンテンツを増やしたなら??
??
??

..
どれだけの人に読んでもらってる？

..
興味深かったのはどこ？

..
書き方を変えてみたなら??
??
??

..
わかりやすくなった？検索エンジン経由の人が増えたか？

..
サイトマップの構造をかえてみたなら??
??
??

..
末端のコンテンツまで、ちゃんとたどり着いてもらえたか？

..
デザインを変えてみたなら??
??
??

..
訪問者が迷わなくなったかどうか？反応は？

..
販売サイトの申し込みの場所、流れを変えたなら??
??
??

..
カートに入れたけど買ってない人の確率は？
購入で踏みとどまってるのはなぜなの？
78

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

..
どんなことがするのか？

..
コンテンツを増やす！

..
ウェブに来て貰うように広告する！

..
お得意様にメルマガを出してみる！

..
検索エンジンからアクセスしてもらうように工夫する！

..
Twitterでつぶやいてみる。Facebookを作ってみる！
ブログを書いている人に、
リンクを張ってもらう！

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

79

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

Plan（計画）（実施実行）Do
?
運営ミーティング誘導方法を考える
?コンバージョンとは？サイトの見せ方を変える
?どのような方法で？
解析ツールを設置
?誰がやるのか？

Act（処置改善）
? （点検評価）Check
?
コンバージョン率の改善？解析ソフトで結果をみる
アクセス数不足？
コンバージョン率を測定する
誘導路を増やす。宣伝？メルマガ？
ユーザ層は？
検索エンジン対策をするべき？

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

80

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

..
広告を出す。CMを打つ。ポスターを貼る。などなど

..
コストはかかる。認知度は上がるが、アクセスはなかなか直結しない。

..
プレスリリースを打つ
様々なプレスのメールアドレスを押さえておけば、自分でメールを打つだけ。

..
ウェブプレスなら、ウェブ上に受付窓口がだいたい公開されています。
プレスの受付窓口には、たくさんのメールを受け取っているはずなので、メ

..
ールの件名を受け取る人がわかりやすいように！
一斉にプレスを打つことができる有料サービスサイトもある。この場合、プ

..
レスにメールするコンサルもついていたりする。
同じ商品で3回はPRは打たないと、記者が名前を覚えてくれないと思った方

..
がよい。
目新しければ、一時的に」
「アクセスがそこそこ増える。

81

アクセスを増やすために（2）
..
..
メルマガ

..
自分たちのお客様候補に近いユーザを集めることができれば効果が高い

..
メルマガを出すには、メールアドレスを集める必要あり

..
メールアドレスをどうやって集めるかはルールがある。

..
登録すると、登録者にお得な情報が届く。

..
会員サイトなら、登録しないとつかえない。

..
変なところからメールアドレスを収集すると、悲惨な結果にもつながる！注意！

..
検索エンジンからアクセスしてもらう？

..
SEO。SEM。LPO（入り口調査と最適化）などの技術を学ぶ必要あり

..
どんな言葉（ワード）で検索してほしいのか？検索ワードの選定。

..
検索エンジンに広告を出すという方法もある。

..
競争率が高い言葉は、アドワーズ広告は高い！しかも直帰率が高い！
複数組み合わせは競争率が割と低め。
「静岡駅周辺コーヒー」など。コン
バージョン率も高め。

82

アクセスを増やすために（3）
..
..
CGM
（Consumer Generated Media）

..
ブロガーにリンクを張ってもらう
ブログは一般的に、普通の企業サイトよりもアクセスは多いが、そのブロガーの読

..
者層が、自社のお客様候補にあっているかはわからない。

..
ブロガーはプロではないので、
マイナスのことを書かれる恐れもある。

..
Twitterでつぶやく、FacebookなどのSNSを利用する

..
最近人気のインターネットのコミュニケーションツール。大抵は無料。
Twitterの場合、フォロワーといって、自分のポストしたメッセージを受信してくれ

..
るユーザを増やす必要がある。

..
自分がフォローするとフォローしてくれるユーザは多い。
ユーザの利用ニーズの変化は速い。仕組みはシンプルだが、ユーザに好印象を持っ
てもらえるかはわからない。

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

83

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

..
まず、
こんな事実があります。
多くの人は、インターネットで調べごとをするときには、最初に検索エンジンを

..
利用しています。そのサイトが日本では、Yahoo、Googleが圧倒的に多い。
ほとんどのユーザーは調べたい事柄をキーワード検索して、1ページ目の1番

..
上に表示されたものを、最初に見ます。
2段目、3段目?となる度に、
?? 見る確率は下がります。検索が次ページ以降にな

..
ると「壊滅的」に見てくれません。
それ故、1ページ目に何とかして載せる必要が出てくるのですが??。
??
??

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

84

検索エンジンはどうやって順番を決める？
検索エンジンとは、何のためのサイトなのでしょ？
う

..
■ たぶん普遍的

..
ユーザが調べごとをしたいときに、利用してもらいたいサイト

..
そのためには、確実で鮮度の高い情報を届ける必要がある。
利便性もあげちゃったりして、いろんな用途に使って欲しい！

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

..
Yahooなどでは、

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

最大にして基本の SEO

..
実はとてもシンプル！

..
検索エンジンは、あなたのサイトを順位外にしたいわけではない！

..
有用な情報は、
どんどん表示させたいのです！

..
WEBサイト内に有用な情報があれば、検索をしてもらえます。
古い情報よりも新しい情報の方が普通は有効！

..
つまり??
??
??

..
有用な情報を掲載する

..
有用な情報なら、誰かがリンクを張ってくれる！

..
鮮度の高い情報をどんどん掲載する

..
更新が多ければ、検索エンジンは定期的にあなたのサイトに調査に来る。

..
コンテンツ量が増えると確率も上がる！
2倍のページがあれば、2倍アクセスがくる理論：）
86

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

..
..
運営チームの立ち上げ

..
タスクフォースの作成。

..
ウェブに掲載するべき内容を精査する。

..
社内での情報共有。
メーリングリストなどの作成し、ウェブに掲

..
載すべき内容を集められるようにする。

..
運営会議

..
定期的に行う

..
イベントごとに行う
社内で出来るタスクと出来ないタスクを分
析する。

87

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

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

代表取締役社長
瀧　康史

http://www.justplayer.co.jp/
TEL: 054-203-5535
Mail: info @ justplayer.com

88

狠狠撸

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

Recommended

More Related Content

Viewers also liked (6)

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

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