|
==============================================================
うちのホームページはどーなってるんだ！
Vol.030 発行／2004.06.17
==============================================================
▼アクセス解析はここを見ましょう！（１）
筆者／石井研二
長い間お休みしてしまって済みません。ようやく再刊です。
先日６月９日には「６月９日はログの日 アクセス解析カンファレンス」という
ものを東京・泉岳寺で実施しました。サイトトラッカー、クリックトラックス、
ウェブトレンズなど、優秀なアクセス解析ツールやサービスが初めて一堂に集ま
り、全１６セミナーがたちまち満席になってしまいました。アクセス解析への関
心の高さを改めて実感できたような次第です。
また、９月には『アクセスログの教科書』という単行本を出させていただくこと
になりました。
そんなこんなで、アクセス解析とサイト改善についての情報をもっとご提供して
いかなければと、筆を新たにした次第です。←古めかしい表現で済みません。
では、再刊第１回（通巻30号）、まずはとってもトリビア（ささい）なHTML上の
ノウハウからまいりましょう。
==============================================================
■ ソースを見る（ヘッダをいかに短くできるか？）
--------------------------------------------------------------
HTMLは、ご存知の通り、ブラウザの「表示」メニューから「ソースの表示」とい
うことができます。ブラウザが読み取ったものが表示されるので、完全に元のソ
ースと一致しているわけではありませんが、どのサイトがどんなHTMLを書いてい
るかおおむね分かるので、大変勉強しやすい（悪く言うとマネされやすい）メデ
ィアということができます。
人のサイトを読むより、まずは自分のサイトをしっかり見て、より良いソースに
なるようにチェックしておきましょう。プロに発注している企業サイトでも、ウ
ェブマスターがソースの善し悪しを見て、より良いソースを求めてプロ制作者と
会話できるようにすれば、何倍も良くなります。
特に、サーチエンジン向けの対策を行なうには、HTMLソースをきれいにしておく
ことが基本です。サーチエンジンのロボットはサイトを訪れると、必要なテキス
トを読んで、ページの情報を収集し、データベースに登録します。<a>（アンカ
ー）タグを見て次に巡回するべきリンク先ページを知りますから、膨大なタグに
<a>が埋もれて分かりにくくならないように、やさしいソースにしておくことが
肝要です。
ブラウザの「ソース表示」でHTMLを見てみましょう。特に、トップページに注目
です。まず、<html>というタグを見つけてください。
HTML文書は一般に<html>という指定から始まります。このデータはHTMLのルール
に従って書いてある、という宣言です。その次に、ブラウザに重要な情報を読ま
せる<head>（ヘッダ）〜</head>（ヘッダ終わり）と、来訪者にむかって表示す
る<body>（ボディ／本文）〜</body>（ボディ終わり）という２つの部分に分か
れていることが多いのです。
これについて、フレームを採用しているトップページの場合は探しにくいことが
多いので、例外とします。フレームサイトについては後日ご説明しますね。今、
ソースを見て、
という記述があって、すごく行数の短いページになって
いたりするトップページの方は、少々お待ちください。
さて、フレーム以外のサイトの方、これらのタグは、きっと次の順番で出てきま
す。間にさまざまな記述がはさまるのが普通なのでとびとびになっていますが、
<html>
<head>
</head>
<body>
</body>
</html>
すべて見つけることができましたか？
<html>や<body>では、同じ<>の間に他の指示も同居していることがありますが、
気にせずに見つけてください。<body>と<body bgcolor="#FFFFFF">はほぼ同じも
のです。
今回の注目ポイントは、<html>が出てきてから<body>が出てくるまで、その間に
どれだけの長さがあるか。<head>〜</head>部分の長さです。これが、短いほど
良いと覚えてください。
<head>〜</head>部分が1000行近くもある、といったサイトも実は少なくありま
せん。いろんなプログラムやレイアウトの定義が書き込まれて、最近どうもヘッ
ダ部が長くなる傾向にあります。
ヘッダの長いのは不利なことです。ブラウザはヘッダ部を読んでからボディ部の
表示にかかるのでどうしてもページの表示が遅くなりがちであること。肝心なこ
とは、サーチエンジンは早くボディ部を読んで内容を取得しようとしているのに
エンエンとヘッダ部が続くと、ページの情報をちゃんと読んでくれないことがあ
るのです。
できるだけヘッダは短くシンプルにすること。これはサーチエンジン対策に限ら
ず得することがたくさんあります。
次回から、なぜヘッダが長くなるのか？（ドリームウィーバーなどのソフトの責
任もあります）ということや、どうすれば短くできるのか、について解説してい
きましょう。
==============================================================
■ 今回の注目URL
--------------------------------------------------------------
このコーナーでは、毎回、私が発見した面白いサイトをご紹介していきます。
★ 慶應義塾大学湘南藤沢キャンパス
http://www.sfc.keio.ac.jp/
90年代後半、日本のインターネットの孵卵器という役割をになった学校、それが
慶應義塾大学湘南藤沢キャンパスですね。ここのサイトは現在実に面白いものと
なっています。
トップページにアクセスしてみてください。デザインスイッチというボタンが見
えますか？ これをクリックすると、デザインが変わります。（マッキントッシ
ュで見ている方は残念ながらボタンが表示されません）
単に他のデザインのHTMLページを呼びだしているのではありません。デザインは
全く変わりますが、ボタンなどの要素は変わっていないことにご注目ください。
つまり、全く同じHTMLを使って、別のスタイルシートを利用することにより、レ
イアウト指定をがらっと変えているのです。（マックではスタイルシートのキャ
ッシュが残ってしまうのでうまく動作しないのでしょう）
デザインは３種類用意されています。どのスタイルシートを使っているかが、ク
ッキーという仕組みで閲覧者のパソコンに記録されるので、次のページも同じス
タイルシートで、つまり同じデザインで見ることができます。行った先のページ
の「デザインスイッチ」でデザインを切り替えれば、トップページも変わり、他
のページも変わります。
こうしたデザイン変更が素晴らしい、というよりも、スタイルシートとはこうい
うものだ、と教えてくれる点で、このサイトは素晴らしいサイトです。皆さんの
ホームページも、よく計画してスタイルシートを徹底して使えば、このように美
しい見かけのサイトを全体的にコントロールすることができるのです。HTMLでは
細かなレイアウト指定をしませんから、HTMLが非常にシンプルなものになり、サ
ーチエンジン対策上も有利になります。
ブログやCMS（コンテンツマネジメントシステム）の時代、今やこうしたスタイ
ルシートの活用は常識のはずです。これからホームページ制作者になろうとする
人は、この技術を知らないでは商売になりません。
ぜひみなさんも、こうした先進事例を見て、スタイルシートをしっかり活用した
サイトに育てていきましょう。企業ホームページでデザインスイッチをやっても
あまりうれしくありませんが、サイトの作り方として、デザインは切り替えない
までも、スタイルシートを使うことは大切なことです。あとの更新運営がスムー
スになり、コストダウンでき、サーチエンジン対策上も有利なのです。
==============================================================
【筆者プロフィール】
石井研二（いしい・けんじ） 61年生まれ。有限会社いなかどっとコム代表。
アクセス解析サービス「サイトグラムPro」で年間3億ページビューを分析し、
多くのサイトのアクセス向上を指南する「日本一のログ読み男」。
==============================================================
▼▼▼▼▼▼▼▼
ＳＩＴＥＧＲＡＭメールマガジン「うちのホームページはどーなってるんだ！」
◆週刊発行 購読無料
◆転載はご自由にどうぞ。事後にご連絡いただければ幸いです。
◆購読登録／削除は、こちらから→ http://www.sitegram.com/
◆ご連絡／お問い合わせ等は → info@sitegram.com
編集発行／有限会社いなかどっとコム http://www.inaka.com/
〒530-0053 大阪市北区末広町3-7 矢崎ビル2F
PHONE 06-6316-7599 FAXIMILE 06-6316-7630
==============================================================
|
