ウェブブラウザのコンテキストでは、フレームは、コンテナとは独立してコンテンツを表示し、コンテンツを独立して読み込むことができるウェブページまたはブラウザウィンドウの一部です。フレーム内のHTMLまたはメディア要素は、囲んでいるコンテンツを提供するサイトとは別のWeb サイトから取得される場合があります。この方法はフレーミングとして知られており、[ 1 ]今日では、同一オリジンポリシー違反とみなされることがよくあります。
HTMLでは、フレームセットとは、Webページやメディアを配置できる名前付きフレームのグループです。iframeは、ドキュメントの本文内にフレームを配置するためのものです。
2000年代初頭以降、ユーザビリティとアクセシビリティへの懸念からフレームセットの使用は減少しており、HTML5規格ではフレームセットはサポートされていない。
HTML のフレームは、<frameset></frameset>タグ とタグ のペアを使用して作成されます。<frameset>タグ は、フレームを作成するために使用される他のすべてのタグを格納するコンテナ タグです。タグ は、フレームセット ドキュメントのタグ<frameset>を置き換えます。タグ は、ウィンドウをフレームに分割する方法を定義します。<body><frameset>
各フレームセットは、行または列のセットを定義します。ユーザーがrows属性を使用してフレームを定義すると、水平方向のフレームが作成されます。ユーザーがを使用してフレームを定義するとcols、垂直方向のフレームが作成されます。
この<noframes>要素を含めることで、フレームが無効になっているウェブブラウザ(またはフレームをサポートしていないブラウザ)でも、ユーザーに何かを表示できるようになります。次の例をご覧ください。
< frameset cols = " 85 % , 15%" > < frame src = "http://www.example.com/frame_1.html" name = "frame_1" > < frame src = "http://alt.example.com/frame_2.html" name = "frame_2" > <noframes> お使いのブラウザはフレームをサポートしていません。 <a href="http://www.example.com/frame_1.html">ここをクリックしてフレーム1を表示 </a> 。<a href="http://alt.example.com/frame_2.html">ここをクリックしてフレーム 2を表示</a> 。</noframes> </frameset>フレームセットにはborder属性があります。この属性を0より大きい整数に設定すると、noresizeフレーム要素に属性が存在しない限り、ユーザーはこの境界線をドラッグしてフレームのサイズを変更できます。境界線を0に設定すると、境界線は表示されず、異なるフレーム内のコンテンツは区別なく隣接します。
このiframe要素は通常の HTML 本文内にインラインで使用され、frame要素と同様に初期コンテンツと名前を定義します。タグペア内のテキストは、<iframe></iframe>iframe タグを理解しないブラウザでも表示されます。
< iframe src = "http://www.example.com/frame_1.html" height = " 480" width = " 640 " >お使いのブラウザはiframeを サポートしていません。<a href="http://www.example.com/frame_1.html">ここをクリックしてコンテンツを表示して ください。</a>Netscape Navigator 2.0 は、1996 年 3 月にフレームに使用される要素を導入しました。Apple の Cyberdog など他のブラウザベンダーも同年後半にこれに続きました。[ 2 ]当時、Netscape は HTML 3.0 標準に含めるために、フレームをWorld Wide Web Consortium (W3C) に提案しました。[ 3 ]
フレームは、初期のオンライン雑誌やウェブアプリ(ウェブメールサービスやウェブチャットサイトなど)の表示とナビゲーションに使用されていました。フレームの利点は、サーバーサイドインクルードやCGIサポートといったサーバー側の機能を必要とせずに、サイト全体に要素を表示できることでした。これらの機能は、一般公開されていた初期のウェブサーバーでは一般的ではありませんでした。
初期のウェブサイトでは、スクロールできないバナーを表示するために上部にフレームがよく使用されていました。これらのバナーフレームには、サイトのロゴや広告が含まれることもありました。[ 4 ]
HTML 4 の後継として意図されていたXHTML 1.1 では、すべてのフレームが削除されました。最終的な代替として意図されていたXFrames [ 5 ]は、フレームセットをアドレス指定するための複合URIを提供しました。
後のHTML5標準では、XHTMLとは異なる方法でフレームセットが削除されました。[ 6 ]この要素は、サイト間でコンテンツを共有するための「サンドボックスiframe」オプションをいくつか備えたまま残っています。[ 7 ]
フレームは、コンテンツを独立して読み込み、ナビゲートできるようにすることで、開発当初に使用されていたプレーンなHTMLに比べていくつかの利点を提供しました。
HTMLコンテンツをフレームで囲むという手法は、ユーザビリティとアクセシビリティに関する懸念を中心に、数多くの批判を招いた。それらには以下のようなものがある。
フレームは、同一オリジンポリシーの適用において、技術的およびユーザーインターフェース上の両面で困難を引き起こします。後者の例として、外側のページが、99%透明化された内側のページ(iframe要素を使用して読み込まれる)上でユーザーに何らかのアクションを実行させるように仕向ける場合があります。
ウェブ技術の発展に伴い、フレームが使用されていた多くの用途が、フレーム特有の問題を回避した方法で実現できるようになった。
overflowプロパティを使用)、他のコンテンツをスクロールしている間、画面上に保持したり (を使用position:fixed)することができました。フレーミングの特徴は、リンク先のウェブサイトにユーザーを移動させるのではなく、そのウェブサイトの情報が元のページにインポートされ、特別な「フレーム」内に表示される点です。技術的には、フレーム内の情報を表示しているとき、コンピューターはフレーム内にページが表示されるサイトではなく、フレーミングを行っているサイトに接続されています。