ホームページさくせい中です。

フレームは使わない方がいいって言うのは本当ですか?
CSSでやるのがいいときいたのですが
CSSでうまくページの配置が出来る方法を教えてくれるサイトはありませんか??
宜しくお願いします。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2006/10/29 19:02:50
  • 終了:2006/11/01 22:42:46

ベストアンサー

id:TomCat No.1

TomCat回答回数5402ベストアンサー獲得回数2152006/10/29 19:33:15

ポイント50pt

まずフレームを用いたページの欠点ですが、最も困るのは、フレームの中のページに直接飛び込まれてしまうことですよね。

 

最近はほとんどの人が検索エンジンを使って必要なページを探しますから、フレームなどお構いなしに、どんどん「中のページ」に直接アクセスしてきてしまうわけです。するとせっかくのメニューが表示されませんから・・・・。これはサイト制作者としては困りますね。

 

で、フレームをやめてメニューバーも含めた1枚のページで構成しようということになってくるわけです。これにはテーブルを使って固定的にレイアウトする方法と、CSSを使って、CSSを書き換えてやるだけで自在にレイアウト変更が可能なページにしてしまう方法がありますが、今では当然、自由度の高いCSSを使った方法が主流になっています。

 

CSSを使えば本体のHTMLには全く手を付けずにレイアウト変更が可能ですし、全てのページに共通のスタイルシートを適用することで簡単にサイト全体の見栄えを統一できますから、サイト制作が格段に楽になります。

 

さて、ご質問のフレームに代わるレイアウトですが、これは一般にCSSの float か position を使います。

 

http://allabout.co.jp/internet/hpcreate/closeup/CU20041111A/

こちらでは、float を使った実例を説明しています。

 

http://desperadoes.biz/style/dan/

こちらでは float と position の両方の方法について解説しています。

CSSで段組する場合、メニューバーとページ本体のサイズなどの関係で、せっかくのレイアウトが崩れてしまう場合がありますが、こちらのページは特にそこに力点をおいて、実例をあげながら説明してくれています。

 

だいたいこのへんを読んで理解できれば、たいていのレイアウトに対応できる知識が付くと思います。さらに色々な説明を読んでみたければ、「CSS 段組」といったキーワードで検索してみるといいでしょう。

その他の回答(5件)

id:TomCat No.1

TomCat回答回数5402ベストアンサー獲得回数2152006/10/29 19:33:15ここでベストアンサー

ポイント50pt

まずフレームを用いたページの欠点ですが、最も困るのは、フレームの中のページに直接飛び込まれてしまうことですよね。

 

最近はほとんどの人が検索エンジンを使って必要なページを探しますから、フレームなどお構いなしに、どんどん「中のページ」に直接アクセスしてきてしまうわけです。するとせっかくのメニューが表示されませんから・・・・。これはサイト制作者としては困りますね。

 

で、フレームをやめてメニューバーも含めた1枚のページで構成しようということになってくるわけです。これにはテーブルを使って固定的にレイアウトする方法と、CSSを使って、CSSを書き換えてやるだけで自在にレイアウト変更が可能なページにしてしまう方法がありますが、今では当然、自由度の高いCSSを使った方法が主流になっています。

 

CSSを使えば本体のHTMLには全く手を付けずにレイアウト変更が可能ですし、全てのページに共通のスタイルシートを適用することで簡単にサイト全体の見栄えを統一できますから、サイト制作が格段に楽になります。

 

さて、ご質問のフレームに代わるレイアウトですが、これは一般にCSSの float か position を使います。

 

http://allabout.co.jp/internet/hpcreate/closeup/CU20041111A/

こちらでは、float を使った実例を説明しています。

 

http://desperadoes.biz/style/dan/

こちらでは float と position の両方の方法について解説しています。

CSSで段組する場合、メニューバーとページ本体のサイズなどの関係で、せっかくのレイアウトが崩れてしまう場合がありますが、こちらのページは特にそこに力点をおいて、実例をあげながら説明してくれています。

 

だいたいこのへんを読んで理解できれば、たいていのレイアウトに対応できる知識が付くと思います。さらに色々な説明を読んでみたければ、「CSS 段組」といったキーワードで検索してみるといいでしょう。

id:hoeizon No.2

hoeizon回答回数318ベストアンサー獲得回数202006/10/29 20:37:25

ポイント38pt

>フレームは使わない方がいいって言うのは本当ですか?

検索でHITするのは、1つのhtmlだけなのでHPがわからない人はトップページに行けません。

せっかく来てくれたのに、他のページ見てくれないのは良くないですよね?


>CSSでやるのがいいときいたのですが

>CSSでうまくページの配置が出来る方法を教えてくれるサイトはありませんか??

↓などを参考にして下さい。ホームページビルダーなどを利用するのも手です。

http://www.stylesheet-stylebook.com/archives/000093.php

http://iswebmag.hp.infoseek.co.jp/sample182.html

http://desperadoes.biz/style/p_frame.php

id:ardarim No.3

ardarim回答回数892ベストアンサー獲得回数1422006/10/29 20:40:54

ポイント28pt

フレームは人によっては操作しにくいので可能であれば使わないか、フレームを使わないページも用意しておくのがアクセシビリティ的には良いでしょう。

アクセシビリティについてはこのあたりを参考にどうぞ。

ウェブアクセシビリティ・ガイド

第5回 アクセシビリティのチェックポイント:ITpro


フレームを使わずに似たような構成のページデザインにするには、このあたりを参考にするのが良いかと思います。

スタイルシート(CSS)で段組を構成する 1 スタイルシートだけで段組を作る - [ホームページ作成]All About

スタイルシートによる崩れない 2カラム 3カラム・レイアウト

CSSによる段組(マルチカラム)レイアウト講座


「CSS 段組」でググったものからピックアップしてみました。

いずれも図などを交えて説明されているのでそこそこ分かりやすいのではないかと思います。

id:office-athena

お返事おそくなってしみません。

ありがとうございました。

また宜しくお願いいたします。

2006/11/01 22:26:30
id:exh No.4

exh回答回数5ベストアンサー獲得回数02006/10/29 21:08:13

ポイント25pt

http://www.access-webconsulting.com/frame.html

こちらが分かりやすいと思います。

検索エンジンと相性が悪い,SEOを考えると好ましくないというのは正しいようです。

http://allabout.co.jp/internet/hpcreate/closeup/CU20041111A/

CSSでの段組について解説されています。

id:office-athena

参考になりますた。

ありがとうございます。

2006/11/01 22:34:39
id:sun5sun No.5

sun5sun回答回数358ベストアンサー獲得回数72006/10/29 21:12:59

ポイント25pt

http://kikitai.teacup.com/kotaeru.php3?q=2471490

>フレームは使わない方がいい?

id:office-athena

参考になりました。

ありがとうございました。

2006/11/01 22:37:18
id:yakamin No.6

yakamin回答回数4ベストアンサー獲得回数02006/10/29 23:12:44

ポイント25pt

 フレームを使わない方がよい理由は、きっと今までにお答えになっていらっしゃる方々がたくさん書いていらっしゃると思いますが、一応挙げておきますと、

●個々のページを URL で紹介できない

●フレーム内の個々の HTML にリンクを貼られると、それをたどってきた利用者が混乱しやすい。

●SEO 対策上も不利。

●場合によっては、フレームの中身として本物のサイトを使ったフィッシングサイトを作られる可能性がある

などがあると思います。

 ただ、フレームを使ったサイトには、メニューをスクロールさせないことが出来、メニューやバナーといった共通部分のメンテナンスがし易い(多数のファイルに同じことを書かずに済むのでサイトの更新が容易)といった利点もあると思います。ですから、それらの利点を満たしたままフレームを置き換える方法を、手前味噌ながらご紹介いたします。

http://www.kuhp.kyoto-u.ac.jp/~diag_rad/appendix.html#techniques

id:office-athena

とても参考になりました。

またなにかありましたらよろしくお願いいたします。

2006/11/01 22:39:02
  • id:yakamin
     回答者 6 のものです。「はてな」をはじめてまだ1週間程ですが、知的なものがたくさんあり、楽しく利用させていただいております。

     さて、ご質問の、フレームを使わないサイト作成の件ですが、私もサイトの作成を行なっていく上で困ったことですので、この質問への回答には非常に注目しておりました。もし質問者の方が回答をオープンなさらなかったら、自分でポイントを支払ってでも開けて読もうと思っておりました。ですので、質問者の方に感謝いたします。

     CSS でうまくページの配置をする方法を解説は、たくさんの方々が答えてくださったとおり、いくつもすばらしいページがございます。ただ、それらの多くは、「段組」をする方法です。メニューなどは、フレームを切った方が利用しやすく配置できるように思いました。そこで、フレームを置き換えてしまえるような方法を探していました。私の場合は、その時点では「はてな」に加入しておらず、「はてな」ですばらしい回答が期待できるということを知らなかったので、結局、こういう具合に自分で作ってしまいました。
    http://www.kuhp.kyoto-u.ac.jp/~diag_rad/appendix.html#techniques

     ほかにフレームを置き換えることが出来る方法が書いてあるのは、以下のものでしょうか。

    http://desperadoes.biz/style/p_frame.php

    http://www.stylesheet-stylebook.com/archives/000093.php
    のリンク「このページ」をたどった先の以下の2つ(フランス語)
    http://css.alsacreations.com/modeles/modele13.htm
    http://css.alsacreations.com/modeles/modele14.htm

    よいページをたくさん知ることが出来、皆様どうもありがとうございました。
    またなにかありましたらよろしくお願いいたします。
  • id:yakamin
     回答者 6 のものです。何度も済みません。
     先日ご紹介したページ:
    http://www.kuhp.kyoto-u.ac.jp/~diag_rad/appendix.html#techniques
    から、フレームを使わずにページの配置をおこなう方法を記載した部分を独立したページにしました。

    IE6 対応「疑似フレーム」の作り方(スタイルシート、JavaScript使用):
    http://www.kuhp.kyoto-u.ac.jp/~diag_rad/web/p_frame.html

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません