隠しページ講座

フレーム編

フレームは、別々のページを1ページに表示する為に使用されます。Webサイトで頻繁に使われている形式ですが、隠しページの問題でもよく扱われる形式です。仕組みを始めに知って置いた方が問題を解く上でも理解しやすいと思うので、フレーム自体の説明を少し詳しくする事にします。例えば、下のリンク先にフレーム別けされたページがあります。まずは飛んでみて下さい。

フレームサンプル ](frameset.htm)に[ frame_a.htm ][ frame_b.htm ][ frame_c.htm ]三つのHTMLファイルが収められている形になります。当然これらは別々のファイルですから異なったソースが存在します。IEなら[ frame_a.htm ]の枠内で右クリックからソースを閲覧すれば[frame_a.htm]のソースを見る事になりますし、それは[ frame_b.htm ]や[ frame_c.htm ]にも同じ事がいえます。ちなみに、フレームに別けられたページ全て同じファイルにする事も可能です。

そこで[ フレームサンプル ](frameset.htm)自体のソースはどうやって閲覧するか問題になりますよね。そういう場合、普通IEならフレームページを開いた状態でメニューバーの「表示」→「ソース」から閲覧します。[ フレームサンプル ]の構成上必要なタグは以下の通りです。


<frameset rows="25%,*">
  <frameset cols="50%,*">
      <frame src="./frame_a.htm">
      <frame src="./frame_b.htm">
  </frameset>
  <frame src="./frame_c.htm">
</frameset>

フレームのソースを見る時何より重要な事は、まずフレーム自体のソースから見る事です。その後からそれぞれのHTMLファイルを見ていく方が確実です。このポイントさえ押さえれば、フレームを使った隠し方では大きく嵌まる事はないでしょう。ソースの記述方法に少し触れると、縦横の列はコンマで区切って幾らでもその数を増やせます。幅の指定方法はピクセル単位や%、相対的長さと色々あります。フレームの中にフレームを入れる事だって出来ちゃいますね。他にもフレームの為の属性タグはたくさんありますから、各自勉強されても良いかも知れません。

フレームはHTMLで頻繁に使用されていますが、普通に認識されている以上に扱いが難しいタグの一つです。フレーム機能がサポートされていないブラウザやその機能を停止している場合も考慮して、フレームが使えない場合でも閲覧者が利用に困らないようにnoframesタグで代替テキストを置く必要があります。例えば、上のリンク先はnoframesタグで代替処置をしていますが、フレームがサポートされていなければ以下のリンク先のように表示されます。

noframeの為の代替テキストは、フレームサポートしている人へは隠しにも映りますね。<frameset>には<body>の内容を書きます。この他にも使用上の注意点が色々あるタグなので色々勉強してみるのも良いかも知れません。

見えないフレーム

フレームを使ってこういう事が出来るという一例です。まずは3つのリンク先を見て下さい。

フレーム対応なら3つとも同じページに見えたと思います。しかし中味は違います。[ 見えないフレーム1 ]以外はフレームページです。[ 見えないフレーム2 ]では一方のページの指定幅を0設定にする事によって、[ 見えないフレーム3 ]ではフレームの枠を消す事によってフレームの存在を隠しています。上でも説明しましたがフレームに隠されている場合まずはフレーム自体のソースから見る事が何より大切です。

iframe

インライン・フレーム、これもフレームです。これはテキストの中にフレームを挿入したい場合使用します。当然フレームがサポートされていないと表示されません。下がiframeを使用した一例です。

フレーム内のファイルを[ frame_a.htm ]に指定してます。当然これもフレーム内のソースを見たければフレーム内のファイルを指定してソースを見なければいけません。

余談ですがフレームは使い方によって他サイトのページをあたかも自分のサイトのコンテンツに見せれるところに問題点が潜んでますね。余談多すぎる?

例題

ここまでフレームについて説明してしまったら隠しにくいですが、練習問題として挑戦して下さい。