• ベストアンサー

IFRAMEでポートレット作成

ウェブアプリケーションのトップページ等にポートレットを設置する場合、 各ポートレットの中身の記述にはIFRAMEを使う方法と直接HTMLを記述する方法があると思います。 この2種類の方法、それぞれメリットとデメリットがあるのでしょうか。 それと、何となく世の中でIFRAMEが避けられている印象があるのですが 何か実用上の理由があるのでしょうか（漠然とした印象なので気のせいかも） 個人的にはIFRAMEの方が親ページとポートレットの中身の明確な分離ができて良いと思うのですが。 皆さんならどちらを使いますか？ そしてその理由は何でしょうか？

  • mokpok
  • お礼率62% (154/245)
  • HTML
  • 回答数4
  • ありがとう数3

質問者が選んだベストアンサー

  • ベストアンサー
回答No.4

ポートレートと勘違いしていました。すみません。 「ポートレット」はサーバー側で処理し、 パーツ（ポートレット）を組み立てて１つのHTMLドキュメント全体を生成する、その一過程となると思いますから、 １つのHTMLファイルに埋め込む方がいいと思います。 そうしないと、フレームの数だけリクエストが増え、サーバーの負荷も増えると思います。 リクエスト開始 ↓ <head>タグ出力 <body>タグ、およびヘッダ出力 <div>ポートレット</div> ← ポートレット取得 <div>ポートレット</div> ← ポートレット取得 <div>ポートレット</div> ← ポートレット取得 ↓ クライアントへ -----フレームにした場合 リクエスト開始 ↓ <head>タグ出力 <body>タグ、およびヘッダ出力 <iframe 1>タグ出力 <iframe 2>タグ出力 <iframe 3>タグ出力 ↓ クライアントへ ・<iframe 1>より リクエスト開始 ↓ <head>出力 <body>、およびヘッダ出力 <div>ポートレット</div> ← ポートレット取得 ↓ クライアントへ ・<iframe 2>より リクエスト開始 ↓ <head>出力 <body>、およびヘッダ出力 <div>ポートレット</div> ← ポートレット取得 ↓ クライアントへ ・<iframe 3>より リクエスト開始 ↓ <head>出力 <body>、およびヘッダ出力 <div>ポートレット</div> ← ポートレット取得 ↓ クライアントへ

mokpok
質問者

お礼

ありがとうございます。 確かにリクエスト数の問題は無視するわけにいかないですね。 ＃SPDYが速く普及しないかなぁ・・・

その他の回答 (3)

回答No.3

>もし良ければフレームを使った方が良いケースを教えて頂けると嬉しいです。 使った方が「良い」かどうかはわかりません。 No.2に書いた通り、ファイルを個別に管理できるメリットがありますから、 CGI系が使えないときで、ファイルを個別に管理したいときに使用しています。 また、専用のCGI（ニュースCGI、RSS表示CGIなど）などを既存ページに入れることができない、しにくい時など（CGIアプリの改変ができない、禁止されているなど）も、 <iframe>などでCGIを個別に呼び出した方が作りやすくなります。 SSIとCGIを併用することで既存ページに入れることは可能な場合もありますが、<head>などの重複出力などの問題も出てきます。 No.1参考サイトのフレームの問題にも上げられている通り、デメリットは多いですから、 （問題に対応するための作り方というのはありますが、煩雑になりやすい。） 可能ならフレームを使わない方がいいと思います。 オーサリングソフトを使えるなら、 Dreamweaverならライブラリやテンプレートを使用することで、CMSと同じ処理をオーサリングソフトに行わせることが可能ですから、フレームを使う必要はなくなります。

回答No.2

ポートレートだけを更新したい場合、フレームを使用していればポートレートだけ更新すればいいですが、 フレームのないページに埋め込んでいる場合、そのページからポートレートの部分を探し出して更新する必要があります。 CMSでは、そういう作業（ファイルのどの部分にポートレートが書かれているかを探す）はすべてCMSが行ってくれますから、 更新作業の手間を省くことができます。 >個人的にはIFRAMEの方が親ページとポートレットの中身の明確な分離ができて良いと思うのですが。 本来のフレームの目的はその通りですが、 CMSが一般化して、個別に管理する必要がなくなったから、フレームも使われなくなりました。 >皆さんならどちらを使いますか？ 状況次第ですね。 フレームを使う必要がなければ使いませんし、使う方が良ければ使います。

mokpok
質問者

お礼

ありがとうございます。 > CMSが一般化して、個別に管理する必要がなくなったから、フレームも使われなくなりました。 つまり、デフォルトはフレーム不使用なんですね。 もし良ければフレームを使った方が良いケースを教えて頂けると嬉しいです。

  • ORUKA1951
  • ベストアンサー率45% (5062/11036)
回答No.1

まずiframeは、HTML4.01strict・XHTML1.0strict、XHTML1.1では使えません。HTML4.01frameset・HTML4.01strictでは使えます。 　そして、 【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから 著者 　・・・【中略】・・・ 　HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。 ￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［4 適合条件: 必須事項と推奨事項( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html )］より 　これが一番の根拠でしょう。 　iframeに限らず、frameには多くの問題を抱えています。 ★frame 問題 html - Google 検索 ( http://www.google.co.jp/#sclient=psy-ab&hl=ja&safe=off&source=hp&q=frame+%E5%95%8F%E9%A1%8C+HTML&pbx=1&oq=frame+%E5%95%8F%E9%A1%8C+HTML&aq=f&aqi=&aql=&gs_sm=3&gs_upl=2824l5263l9l5728l6l4l2l0l0l0l133l524l0.4l6l0&bav=on.2,or.r_gc.r_pw.,cf.osb&fp=b54df16a16f56cd7&biw=1016&bih=603 ) 　これが実用的な面での問題点です。 　基本的にiframeは使いません。 ＞個人的にはIFRAMEの方が親ページとポートレットの中身の明確な分離ができて良いと思うのですが。 　これは、HTMLをきちんと文書構造にしたがってマークアップすれば済みます。 <div class="section"> 　<h2>本文見出し</h2> 　<p>段落</p> 　<div class="article"> 　　<div class="header"> 　　　・・・ヘッダ・・・ 　　</div> 　　<div class="section"> 　　　・・・本文・・・ 　　</div> 　　<div class="footer"> 　　</div> 　</div> </div> HTML5だと <section> 　<h2>本文見出し</h2> 　<p>段落</p> 　<article> 　　<header> 　　　・・・ヘッダ・・・ 　　</header> 　　<section> 　　　・・・本文・・・ 　　</section> 　　<footer> 　　</footer> 　</article> </section> になります。 　ここで例示したclass名については、 HTML4.01仕様書 【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから DIV要素とSPAN要素は、id属性及び class属性と併用することで、文書に構造を付加するための一般機構を提供する。 ￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［The global structure of an HTML document (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/global.html#h-7.5.4 )］より ★HTML5 における HTML4 からの変更点/新しい要素 ( http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/#new-elements )の要素名とその意味を参考にしています。

mokpok
質問者

お礼

ありがとうございます。 一番にくるのはやはり、非推奨要素であるという一種の思想的な問題ですよね。 実用面については、作成するウェブアプリケーションの性格上・・・ ・プリントアウトすることは無い ・ページではなくポートレットでの使用なのでブックマークとは関係なし ・公開サービスではないので検索エンジンとは関係なし ・サポートするブラウザは制限して販売しているので非対応ブラウザは関係なし ということで、私が調べた限りでは実用上の問題が見つかりませんでした。 どれも、ウェブアプリケーションのポートレットとして使うIFRAME、 という観点では関係無さそうです。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. HTML

関連するQ&A

  • iPhoneでiframeのように表示したい

    HPの新着情報にiframeを使っており、iPhoneで見るとiframeの中身が全て表示されてしまうことに気付きました。 タイトルの通り、iPhoneでiframeのようにテキストボックス枠を指定し、その枠内で表示・スクロールできるようにし、別ページで管理したいと思っています。 現在、iPhoneで自作のウェブサイトを閲覧した際に、iframeの中身が全て表示されてしまい、 サイトが伸びて表示されていることが分かったのですが、どう修正したら良いのか分からず悩んでいます。 ネットで調べて色々試しましたが、iframeは未対応ということばかりで、 代打案、修正方法はわかりませんでした。 新着情報を残しておきたいので別ファイルでの読み込みで考えています。 HTMLに直接書き込む方法などは拝見しましたが、【 http://jsdo.it/piayo/c2jr 】 それですと、HTMLが長くなってしまうので別ファイルでの読み込みが良いです。 スクロールバーが出なきゃダメ等のデザイン的なこだわりは特にありませんが、 (1)別ページでの管理、(2)中身が全て表示されないことでお願い致します。 PHPやジャバスクリプトはまだ理解不足なため、なるべく簡単な方法ですと嬉しいです。 私で方法が思いつきませんので、どなたか詳しい方がいましたら原因と解決策を教えて頂きたいです。 アドバイスお待ちしていますので、よろしくお願いします！

  • iframeの中でページ内リンクはできますか？

    iframeを使って下記のようなつくりでHTMLを組んでみましたが、Chromeでリンクに飛ぶことができません。（(1)をクリックすると(2)の位置に飛んでほしい） =　A.html　= <html> <body> <iframe src="B.html" scrolling="no" frameborder="0" width="750" height="2000"></iframe> </body> </html> =　B.html　= <html> <body> <a href="#CCC"><img src="xxx.jpg" /></a>…(1) 　　・ 　　・ 　　・ <a href="C.html" name="CCC">あいうえお </a>…(2) </body> </html> ざっくりと書いてしまいましたが、親HTML（ここでいうA.html）では指示をせず、あくまでiframe中の子HTML（ここでいうB.html）の中でページ内リンクをしたいと思っています。 ちなみにiframeを使っていますが、ブラウザ上の見え方としては、A.htmlに1ページで組んでいるかのような形にしたいと思っています。 ネットでいろいろ調べてみましたがよくわからず、記述が悪いのか、Chromeではうまくいかないのか、悩んでおります。（Sarfari等、うまくいったブラウザもあるのですが…） よい方法がございましたら教えてください。 宜しくお願いします。

  • HTMLのIFRAMEについて教えて

    HTMLのIFRAMEについて教えて欲しいのですが、 例えば、cgiの入力項目で、数字の１を入力した場合、aaa.htmlというページ内にあるIFRAMEで囲まれた エリア内に、１の写真が表示できるようにしたいのです。 現在、以下のような記述をしているのですが、IFRAMEの部分がエラーになってしまうのです。(>_<) noには、数字の変数が入っています。 他の方法でも結構なのですが、数字によってIFRAME内に表示される写真を変えたいのです。 どなたか、宜しくおねがいします。 <script type="text/javascript"> <!-- switch(no){ case 0: id = "01.jpg"; break; case 1: id = "02.jpg"; break; case 2: id = "03.jpg"; break; default : id = "00.jpg"; break; } // --> </script> <iframe src="id" name="picture" width="300" height="300"></iframe>

    • ベストアンサー
    • HTML
  • IFRAME内のフォームをRequestしたい

    こんばんわ。 ＡＳＰで簡単なウェブページを作っています。 あるアンケートフォームがあるＨＴＭＬ（親ページとします）があります、その中に一部IFRAMEでこれまた別の設問が書かれたＨＴＭＬ（子ページとします）が表示されているとします。 親ページのＳＵＢＭＩＴで内容をメール送信するＡＳＰにデータを送信するとしてテストしてみますとIFRAME内の内容がRequestなどで呼べませんでした。 こういう場合、どうにかしてＡＳＰファイルにてIFRAME内の情報をRequestできる方法はないでしょうか？ お手数をお掛けいたしますが宜しくお願い申し上げます。

  • FrameSet後のiframeで

    ホームページ初心者です。 よろしくお願いします。 HTMLエディタを使い記述していますが、 画面をFrameタグを使い、いくつかに分割しました。 そのひとつのFrameの中に「iframe」タグを使い、地図データを表示させようとしています。 ソースのパス指定を絶対パス、相対パス双方試しましたが、iframe内が真っ白な状態です。ブラウザは「ページが表示されました。」と返してきています。 オフラインの状態でframeタグを宣言しているhtmlをとばし、直接iframeを宣言しているhtmlを見ると、ちゃんと表示されます。 「Frame」「iFrame」タグを使った場合に、パス指定等何か別の決まりがあるのでしょうか。

    • ベストアンサー
    • HTML
  • frameやiframeで指定したhtmlファイルの振る舞い

    frameはさすがに使用してないのですが、iframeを使用し複数のHTMLファイルをそのiframe内に表示（同時ではなく、選択されたページのみ）させるホームページを作っています。 各HTMLファイルのページは、そのホームサイトのリンクのみでネット上に公開したいのですが、（逆を言えば、各HTMLファイル単体での表示を避けたい）iframeで指定されているHTMLファイルは自動的にそうなってくれますか？ もしならないのであれば、そうする方法などを教えて頂きたいです。

    • ベストアンサー
    • HTML
  • <iframe>タグが正常に動作しない

    下記HTMLを作成した場合、タグが正常に作動しません。 wikiのページに何か細工があるようですがどういった仕掛けが入っているのでしょうか？ また、これを正常に表示させる方法はありますか？ ご存知の方、教えてください。 宜しくお願い致します。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <IFRAME src="http://ja.wikipedia.org/" width="900" height="1500"></IFRAME> <HR> <IFRAME src="http://yahoo.co.jp" width="900" height="1500"></IFRAME> </BODY> </HTML>

    • ベストアンサー
    • HTML
  • ホームページを作っています、ページ内にiframeで他のページを表示さ

    ホームページを作っています、ページ内にiframeで他のページを表示させています。 IEではこのiframeにスクロールバーが出て、縦に長いデータをスクロールして閲覧あせる事が できるのですが、Firefoxだとスクロールバーが出ません・・・ どなたか表示させる方法をご存知でしたら教えてください。 以下HTML記述 <iframe name="iframe4" id="iframe4" frameborder="0" scrolling="yes" src="topix.html" title="※※">※※</iframe> CSS記述 #iframe4{ border-width : 0px 0px 0px 0px; margin-left : 0px; width : 420px; height : 490px; padding-top : 0px; overflow : hidden; margin-top : 0px; margin-right : 0px; margin-bottom : 0px; padding-bottom : 0px; }

    • ベストアンサー
    • HTML
  • iframeでutf-8の.txtを呼び出す。

    HTMLのIframeで、文字コードがUTF-8であるテキストファイル（.txt）を呼び出す。（文字化け？） HTMLのIframeで、文字コードがUTF-8であるテキストファイル（.txt）を呼び出す時に、 内容が文字化けするので困っています。 表記に間違いがあるかもしれませんが、宜しくお願いします＞＜ あと一応確認しましたが万が一既出でしたら申し訳ありません。 <iframe src=～>では、拡張子.htmlのファイルに加えて.txtファイルも呼び出せます。 .htmlファイルの場合、METAタグを使い、内側のHTML内で文字コードを指定しておけば 文字化けは起きないのですが、 txtファイルではそのような指定ができません。 外側（iframeを記述する方）から内側（src=～の呼び出し先）に向かって文字コードを 指定するのは可能ですか？ 又はその他によい方法がありますか・・・？？ 宜しくお願いしますm(_ _)m

    • ベストアンサー
    • HTML
  • javascriptを無効にする方法～<iframe>タグが正常に動作しない～

    下記、HTMLを作成したのですが、wikipediaのjavascript?によって、折角開いた、yahooのページもwikipediaにとって変わられてしまいます。 wikipediaのjavascriptを無効にする方法は無いでしょうか？若しくは、こういったjavascriptを見つけた時、強制的に、排除する方法など無いでしょうかね？ 折角開いたページが、こういったjavascriptがあることで全て強制的に飛ばされてとても困っています。 宜しくお願い致します。 <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <IFRAME src="http://ja.wikipedia.org/" width="900" height="1500"></IFRAME> <HR> <IFRAME src="http://yahoo.co.jp" width="900" height="1500"></IFRAME> </BODY> </HTML>

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する