少し昔にはフレームページというものが流行った時期があります。現在も使っているページを時々見ますね。ところがこのフレームページは利点もあれば欠点もあるのです。そのことについて例を挙げてメモしてみたいと思います(少し話題的には古い気がしますが)。
フレームページとは?(念のため)
フレームページとは、主に3つのhtmlファイルから成ります。次に構成例を挙げてみます。
frame.html | フレーム部分に表示されるhtmlです。通常通りのhtmlと同じように、<html>などから書き始めなければなりません。 |
---|---|
main.html | 実際に内容が表示されるhtmlです。最初のページでは前口上などが書いてある場合が多いです。 |
index.html | フレーム部分とメイン部分を引っ張ってきて表示させるhtmlです。ここに書かれた内容は、実際に目に見えることはありませんが、ページ全体をそれぞれのフレームやメインに割り当てる処理を記述します。 |
<!-- index.html --> <frameset cols="200px,*"> <frame src="frame.html" name="frame"> <frame src="main.html" name="main"> </frameset>
<!-- frame.html --> <ul> <li><a target="main" href="main.html">home</a></li> <li><a target="main" href="main2.html">main2</a></li> <li><a target="main" href="main3.html">main3</a></li> </ul>
<!-- main.html --> <h1>てすとぺーじ</h1> <p>aaaaaaaaaa</p> <p>aaaaaaaaaa</p> <p>aaaaaaaaaa</p>
このように、aタグのtarget属性にindex.htmlのframeタグのnameを指定することで、目的の場所で表示することが出来ます。まぁ、ここまでは当たり前ですね。
フレームページの利点と欠点
利点
なんといっても、手軽ですね。メーカーPCにプリインストールされたIBMのホームページビルダーなどを過去に触ったことがあるんですが、普通にフレームページを作成できる機能が付いてました。フレーム部分を作ってしまえば、後はメイン部分を作る作業に集中できますから、そういう意味で非常に作業効率が良いということです。
フレームページにしない場合、それぞれのページに一々メニュー部分を書き足す必要がありますね。最初はコピペで良いんですが、もしページ数が増えると、全てのページのフレーム部に関して追記しなければなりません。
後、無理矢理利点をこじつけるとするなら、内容部分だけ取って来て表示すればよいので、フレーム部分のコストが少なくて済みます(ダウンロードしてくる通信部のコストと、表示するためのレンダリングコスト)。
欠点
世間的によく言われるSEOというものが関係してきます。通常、あるページにたどり着く手段としては、Googleなどの検索が一番多いでしょう。その際、検索ワードでヒットする可能性のあるのは、常にメイン部のhtmlのみになります。ということは、結果的に表示されるのはindex.htmlではなく、main.htmlなわけです。このように、見る上で非常に不便となります。
代替案
という訳で、一般的な回避策(メニュー部のような機能を残しながら、SEOにも配慮したい)として、一時期はテーブルでレイアウトを配置するというものが用いられていました。テーブルの線を消してしまえば、セルの結合や分割などで望みの場所に望みのものを配置することが可能です。結論から言ってしまえば、これらのテーブルレイアウトは悪しき慣習でした。
本来、htmlにおいてのタグとは、囲む要素の意味を表すものでなければなりません。しかし、レイアウトするというデザイン上の目的のためだけにtableタグが用いられてしまいました。というわけで、最近のスタンダードはスタイルシートでメニュー部を表現する方法です。このページも右部にメニューが表示されていると思いますが、これはフレームを使っているわけではありませんが、自然ですよね。
例外
何事にも例外がつき物ですが、この場合も例外があります。
ところで、2ちゃんねるをご存知でしょうか。あのトップページはフレームページですが、検索でヒットするのがメイン部のみというのが逆に利点となっています。フレーム部は、閲覧者にとってあまり要らない情報です。そのため、表示されないことが逆に利点となることもありそうです。
フレームを用いない場合、各ページにメニュー部を追記していく必要があると言いましたが、この問題点はサーバサイドスクリプトなどを用いることによって解決します。つまり、フレーム用のhtmlとメイン用のhtmlを用意しておいて、適宜リクエストに応じるレスポンスとしてくっつけた状態を返すということです。現実にはcgiなどを実行できないレンタルサーバなどもあるので、一概にこれで良いとは言い切れません(ちなみに、私は力技で各ページにメニュー部を貼り付けるウェブページを作成・管理したことがありますが、保守性はやっぱり良くありませんでした)。