メールマガジン

==============================================================
うちのホームページはどーなってるんだ！

Vol.017　　　　　　　　　　　　　　　　　　　　　　 発行／2003.03.29
==============================================================

▼　困った「入り口ページ」たち　第４回
　　「フレームサイトは機会損失の巣（３）」
　　　　　　　　　　　　　　　　　　　　　　　　　　　　　筆者／石井研二

フレームの第３回、緊急対策の第２から入ります。

前回お話したのは、サーチエンジンで紹介されるときのフレームサイトのひどい状
態について。そこから、緊急対策の１をご説明しました。つまり、フレームを悪く
言うのは簡単なのですが、今現にフレームサイトをお持ちの企業さんが、どうして
いけばいいのか、ということです。

緊急対策の１は、ログ解析をして、より多く入り口となっているページを優先的に、
そのページにロゴを入れ、著作権表記を入れ、他のページへのナビゲーションを入
れれば、たくさんの来訪者を逃がすことがなくなる、というものでした。

では、緊急対策の２番目は？　ちょっと飛び道具です。


●２●　緊急対策２

フレームには２つの種類があります。つまり、ヘッダやフッタ、ナビゲーションを
入れた「いつでも表示されている常駐ページフレーム」と、本文内容が記載された
「コンテンツフレーム」です。

また絵にしましょう。

┏━━━━━━━━━━┓
┃  head.html        ┃←このフレームを定義しているのが
┠−−−┬−−−−−−┨　index.htmlです。
┃  n   │　　　　　　┃
┃  a   │ main.html ┃　常駐ページとは、ここではhead.htmlとnavi.html。
┃  v   │　　　　　　┃　いつでも表示されています。
┃  i   │(001.html) ┃
┃  ･   │　　　　　　┃　main.htmlがあるのが、コンテンツフレーム。
┃ html│　　　　　　┃　ここには来訪者の見たいページが次々に呼び出されま
┃      │　　　　　　┃　す。001.htmlもそうした本文ページの１つです。
┗━━━┷━━━━━━┛

常駐ページがサーチエンジンに直接呼び出されてしまうと、ルックスとしては目も
当てられません。ロゴだけ書かれたページだとか、ナビゲーションしかないページ
が広々としたブラウザウィンドウに現れるわけですから。ボタンを押しても、Java
Scriptなどを使ったリンクでは、何も起こらなかったりします。

しかし、どのコンテンツページとセットで呼ばれても不自然ではありませんから、
単独で呼び出されそうになったときには、とりあえずトップページにリダイレクト
しておけば簡単です。

つまり、head.htmlやnavi.htmlにJavaScriptを書いておきます。そのスクリプ
トでフレームの存在を調べ、もしフレームがなかったら単独で表示されそうになっ
ているということですから、ロケーションをindex.htmlに変えてしまえばいいの
です。そうすればちゃんと上にhead.html、左にnavi.html、右にはmain.htmlが
はまって表示されます。


難しいのはコンテンツページです。
main.htmlが単独で呼び出されそうになったら、index.htmlを呼べばいいのです。
そうすればちゃんと上にhead.html、左にnavi.html、右にはmain.htmlがはまっ
て表示されます。

が、例えば上の図のフレームで、main.htmlのはまっていた場所に呼び出されるべ
き「001.html」というページがあるとしましょう。これが単独で呼び出されるロ
ケーションをindex.htmlに変えてしまうと、同じフレームには、来訪者がサーチエ
ンジンで紹介されて見ようとしている001.htmlではなく、main.htmlがはめ込ま
れて表示されてしまいます。それでは来訪者はがっかりするし、一種の不正行為に
なってしまいます。

そこで、JavaScriptをひとひねり。

001.htmlが単独で呼び出されそうになったら、JavaScriptの力でロケーションを
index2.htmlに変えます。このindex2.htmlは上にhead.html、左にnavi.htmlを
はめ込み、コンテンツフレームには、JavaScriptの力で、そのページの呼び出し
元となった001.htmlをはめ込むのです。

もし別の「002.html」が単独で呼び出されそうになったら、やはりindex2.html
へリロケーション、今度はちゃんと002.htmlが呼び出される仕掛け。
inedx2.htmlは１つだけですべてのコンテンツページに対応することができます。

このJavaScriptさえあれば、フレームファイルが単独で呼び出されて困る、という
問題はクリアできます。


ただ、「この方法があるなら、フレームサイトもいいじゃないか」と思われると困
ります。フレームは廃止される方法論であること、サーチエンジン対策上不利であ
ることなどは変わりないのです。

そこで、じっくりとした対策が必要になります。


●３●　本格対策１　ライブラリの手軽さ

次に作るコンテンツからはフレームをやめましょう。これが一番の対策です。今あ
るコンテンツも少しずつ脱フレームの作業を進めていけば、やがてすべてが解消さ
れます。1000ページあるサイトでも、月に１コーナーずつ脱フレームしていきま
しょう。

フレームの良さは、どんなにたくさんページがあっても、ナビゲーションがフレー
ムになっているので、たとえばナビにコーナーを１つ増やしたい、というとき、ナ
ビフレームファイルを１つ直せば、簡単にボタンを追加することができる点。

フッタの著作権表記の年号が2002だったものを2003に直したい。ならばこれを
フレームにしておけば、foot.htmlを１つ書き直せば、それだけでOK。ヘッダも
フレームにして、ロゴ画像を変えたいときに一瞬で変えられる。

こういったハンドリングの楽さがあるおかげで、フレームは人気があったのです。
ついでに言えば、ヘッダもナビもフッタもないコンテンツページは、作成が楽で、
安上がり。難しいレイアウトがいらないからデータも軽く、素早く読み込まれる、
という長所もあります。

そうした良さを残したまま、脱フレームするにはどうすればいいでしょう。

管理のしやすさでいけば、制作ソフトの機能を活用することも考えるべきです。例
えばマクロメディア・ドリームウィーバーの「ライブラリ」機能。

これは、ナビゲーションやフッタ、ヘッダなど、多くのページで共有するパーツを
ライブラリ要素としてソフトに登録しておくもの。そうすれば、ライブラリファイ
ルを直すだけで、自動的に、そのライブラリを使っている全ページのデータが更新
される、というものです。

あとは、正しいライブラリを取り込んだページのひな形を作成しておけば作成も楽
だし、管理の楽さを維持することができます。


この方法の難点は、多くのページがあるサイトでこの方法を維持するためには、組
織全体でライブラリなどについての知識を共有する必要があるということでしょう
か。事業部ごとにバラバラの制作会社を使ったり、社内担当者が簡単な制作ソフト
を買ってきて作っていてHTMLの知識がなかったり、ウェブマスターが急に異動に
なって、引き継ぎをするヒマもなかったりすると、正しい方法が維持できなくなり
ます。

こうした混乱があると、ドリームウィーバーのライブラリが知らないままに削除さ
れてしまっていたりして、うまくいかないことがあるのです。

これは単にナビゲーションの管理だけの問題ではありません。デザインの維持など
も同じです。こうした組織的な問題は、日本の企業ホームページが抱えている一番
大きな問題かもしれませんね。

大企業のサイトで、会社のロゴが画像コピーを繰り返してぼろぼろになってしまい
っているのを何度も見てきましたし、せっかくデザインガイドラインがあっても各
部署が守らないのでサイトエクスペリエンスの質がひどく下がっていたりします。
これは別の話。別の、大きなテーマです。また、次の機会にお話しましょう。


●４●　本格対策２　Flashナビゲーションの威力

フレームと同じように、手軽なハンドリングをするためには、意外にFlashなどを
使うのも良いものです。

つまり、ナビゲーションやヘッダ周りをFlashで作っておけば、Flashはもともと個
々のHTMLに書き込むものではなく、外部ファイルですから、いつでも１つの外部フ
ァイルを更新すれば、ボタンを増やしたり、バックのデザインや動きを変えられた
り、非常に便利です。

Flashのやや面倒なところは、HTML上にFlashファイルのサイズを書いておかなけ
ればならないことです。もともと書いてあるサイズの中ならいくらでも変えられる
が、そのサイズを変えようとすると、全ページを変更しなければならないのです。

例えばナビゲーションにボタンを３つぐらい追加しようと思うと、どうしても同じ
サイズの中では処理しきれない、ということになります。１つ１つのボタンがあま
り窮屈に小さくなってしまうと、かえってユーザビリティが悪くなりますから。

それを変えるためには、Flash記述部分をJavaScript外部ファイルに書いておくこ
と。そうすれば、いつでもサイズやバックグラウンドカラーなどを完全に書き換え
られ、コントロールが自在になります。


Flashナビゲーションの泣き所は、サーチエンジンロボットが、Flash内部のリンク
をたどることができないことです。フルFlashサイトなどは、全くサーチエンジンに
登録されなかったり、いつまでたってもトップページしか認識されなかったりしま
す。それでは、本格的なナビゲーションにFlashを採用することはできません。

それを回避するために、今最も重要なページは充実した「サイトマップ」です。

サイトマップへのボタンはFlashにせず、普通のアンカータグによるリン
クで、トップページを初めとするほぼ全ページの上部に配置します。

そうすれば、サーチエンジンのロボットはサイトに入ってきて真っ先にサイトマッ
プを見つけることができます。

一般のページに載っているナビゲーションがFlashでも、サイトマップにサーチロ
ボットを導くことで、そこから全ページをロボットが巡回することができ、効率良
く多くのページがインデクスされるという仕組みです。

フレームを外すにあたっては、この配慮は是非とも大切にしてください。

大きなコーナーを１つ増やしたいときには、外部JavaScirptファイルとFlashファ
イルとサイトマップ。この３点をセットで更新することで、全ページに変更を反映
することができ、サーチエンジンにもスムースにサイト内を巡回させることができ
ます。


●５●　本格対策３　JavaScriptナビゲーション

私が最もお勧めしているのがこの方法です。

ナビゲーションをJavaScriptで記述し、それを外部ファイル化しておきます。ど
のHTMLにも、書いてあるのはそのスクリプトへのリンクだけ。あとは、その外部
ファイルをさわるだけで、あらゆる変更が可能です。

これはFlashナビゲーションでもできることですが、そのページのURLを読み込ん
で、例えば商品コーナーでは新商品情報へのリンクを表示したり、ショップコーナ
ーではクッキーを読みこんで、前回買った商品をもう一度購入できるボタンを表示
したり、たった１つのJavaScriptファイルで変幻自在なナビゲーションが作れま
す。

もちろん、JavaScriptもサーチロボットが読み込めないものですから、サイトマ
ップへのリンクは、Flashナビゲーション同様、しっかりやっておく必要がありま
す。

Flashと違って、JavaScriptは単なるテキストファイルなので、中身を変えるの
がより簡単だということです。

また、JavaScriptといっても、ナビゲーションの構成には古典的なスクリプトで
対処できますから、ブラウザのバージョンにほとんど左右されません。

こうした方法で、ナビゲーションをたった１行のリンク表記で書いてしまえば、
HTMLのソースはシンプルになり、全体のページ制作は簡単になり、サーチエンジ
ンも肝心のページ本文をしっかり読んでくれるようになります。


こういった方法でも、複数の制作会社や事業部が制作に携わる時には、ルールを決
めて、それがちゃんと引き継がれるようにしておかなければなりません。これはフ
レームサイトでも同様です。私は、フレームのナビゲーションを直したのに変更が
反映されないのでおかしいなと思ったら、フレームファイルがコピーされて、別の
ファイルになっていた、という経験があります。せっかくフレームを採用している
のにフレームナビゲーションが複数あったのでは、管理が楽にはなりません。どの
方法論を採用していても、ルールの維持は重要なのもなのです。

--------------------------------------------------------------

いくつかの方法で、脱フレームや
フレームのデメリットを減らすことを考えてきました。

ご理解いただけましたか？

ホームページ運営の基本は、つまるところ、「これがベスト」と決めた
運営方法とそれに基づくページのひな形をいかに美しく保つか、
人が変わっても維持されるように伝えていくか、ということです。

それがサイトを美しく保ち、メッセージを伝えやすくし、管理を楽にし、
コストパフォーマンスを高め、新たな情報の発信に専念しやすくするのです。

次回は「困った「入り口ページ」たち」シリーズ、いよいよ大詰め、
「用語集、Q&A、そしてレシピページ」です。


==============================================================
【筆者プロフィール】
石井研二（いしい・けんじ）　61年生まれ。有限会社いなかどっとコム代表。
95年から企業ウェブ構築／リニューアル、効果分析で実績を残す。
新製品『ライバルキーワード分析　クロールキャスト』では
正しいＳＥＯのためのプロセスを提供している。
==============================================================
▼▼▼▼▼▼▼▼
ＳＩＴＥＧＲＡＭメールマガジン「うちのホームページはどーなってるんだ！」

◆週刊発行　購読無料
◆転載はご自由にどうぞ。事後にご連絡いただければ幸いです。
◆購読登録／削除は、こちらから→ http://www.quickvalue.net/
◆ご連絡／お問い合わせ等は　　→ info@quickvalue.net

編集発行／有限会社いなかどっとコム http://www.inaka.com/
　　　　　〒530-0053　大阪市北区末広町3-7 矢崎ビル2F
　　　　　PHONE 06-6316-7599 FAXIMILE 06-6316-7630
==============================================================