縦横フレーム同等のHPを発見しました。作りたい^^

このQ&Aのポイント
  • 縦横フレームと同等のHPを発見しました。デザインはいまいちですが、タグの配置が便利です。
  • 似たような機能があるHPを発見しました。デザインが良く、上部にもタグがある特徴があります。
  • HPのソースをコピーしても同じHPを作ることはできません。他の方法を探す必要があります。
回答を見る
  • ベストアンサー

縦横フレーム同等のHPを発見しました。作りたい^^

html> <head> </head> <frameset cols="26%,*"> <frame src="left.html"name="menu"> <frame src="pronagare.html"name="contents"> </frameset> <html> 以上のプログラムは”縦割り2分割フレーム”のプログラムですが、仕事用に使用しているHPで4年目になります。  ”縦割り2分割フレーム”の利点は、常にリンクタグが左側にあるので、タグの場所を電話で聞かれて説明する場合、説明がしやすく重宝しております。  しかし、デザイン的にはいまいちです!  それで、  たまたま、似たような機能があるHPを発見しました。 http://webch.org/list/list.html  以上のHPで気に入ったところは   1)現在私が使用しているHPよりもデザインが良い   2)上部に横方向にもタグある     以上HPですが!    縦、横の分割フレームと同等の機能がるHPだと気づきました。  どんなプログラムを組ば同じHPができるのでしょうか!?  試しにHPのソースをコピー・ベースとしても駄目でした。  以上よろしくお願いいたします。     

  • HTML
  • 回答数3
  • ありがとう数3

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

  • ベストアンサー
  • outbrave
  • ベストアンサー率60% (231/380)
回答No.2

>縦、横の分割フレームと同等の機能がるHPだと気づきました。 フレーム機能なんてありませんよ。 単なる「2カラム」のページです。 左のメニューで右側の内容だけが変わっていると思われているのなら大間違いです、ページのURLを見れば一目瞭然、同じレイアウトの他のページに移動しただけですから。 使用したければ、2カラムのテンプレートをどうぞ。

Campus2
質問者

お礼

 御回答誠にありがとうございました。 A:「2カラムのテンプレート」  そうだったのですね、2カラムでスキルアップ  で4年目の業務HPも使いやすくなるでしょう^^

その他の回答 (2)

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

まずフレームの問題点はとても多く語られていますね。 ⇒ HTML フレーム 問題 - Google 検索( https://www.google.co.jp/search?q=HTML+%E3%83%95%E3%83%AC%E3%83%BC%E3%83%A0+%E5%95%8F%E9%A1%8C )  これらを読まれると理解できると思います。15年前の1999年のHTML4.01の勧告以来・・『HTML文書を作る場合には、この仕様における、他のDTDセットではなく strict DTD に適合する文書を作るよう推奨する。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/conform.html#h-4.1 )』とされてきました。XHTML1.1やHTML5にはフレーム自体存在しません。(iframeは残っているが使用は限定的)  ・・・15年も経つので最近はここでもフレームの話題は数ヶ月に一度も登場しないですね。  HTML4.01以来強く叫ばれてきたのは、『構造とプレゼンテーションの分離( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/intro/intro.html#h-2.4 )』で、HTMLでは文書構造だけを記述して、どのようにプレゼンテーションするかはスタイルシートに任せることになりました。理由は上記に書かれているとおりです。 >以上のHPで気に入ったところは > 1)現在私が使用しているHPよりもデザインが良い > 2)上部に横方向にもタグある  デザインは兎も角、実際に読みたいページをブックマークに入れてご覧なさい。見ていたそのページが開かれるはずです。フレームではそうは行かない。☆こちらのほうがデザインよりは深刻です☆ (1)はデザインセンスの問題なので(^^)、(2)はHTML本文は弄らずに、スタイルシートを書き直すだけで、上だろうが下だろうが右だろうが左だろうが好きになります。スマホのような小さな画面では上だけにするとか、印刷ではメニューは印刷しないとか・・・ > 試しにHPのソースをコピー・ベースとしても駄目でした。  それだけじゃなくスタイルシートなど関連ファイルも必要です。これはフレームも一緒のはず。  (ちなみに、HP(ヒューレッドパッカード)じゃなくウェブページ(サイト)製作の立場になるとホームページじゃ意味が通じなくなる。「ホームページに戻る」って行き先はどこ(^^)  ⇒ホームページ - Wikipedia( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8 )    ⇒略語( http://ja.wikipedia.org/wiki/%E3%83%9B%E3%83%BC%E3%83%A0%E3%83%9A%E3%83%BC%E3%82%B8#.E7.95.A5.E8.AA.9E )  本題です。 1) HTML自体は、そのサイトのソースを見るとわかるように極めてシンプルです。 2) すべてのページに共通なメニューに当たるものはすべてのページに記述します。   唯一、これが著者にとっては負担となるでしょう。しかし小規模なサイトでしたらコピーペーストすればよいし、大規模になればSSI(Server Side Includes)のincludeを使うことが多いでしょう。  ⇒Server Side Includes - Wikipedia( http://ja.wikipedia.org/wiki/Server_Side_Includes )  PHPのincludeを使う場合もあります。  いずれにしても、拡張子は.htmlのままで動作させることができます。 4) (補足)そのサイトは少し古いようです。HTML5を目前にした現在では、ブロックはDIVにHTML5の新しい要素( http://standards.mitsue.co.jp/resources/w3c/TR/html5-diff/#new-elements )を、その意味もこめてclass名にすることが多いです。将来そのままHTML5に移行しやすいし、意味がわかるので作りやすい。

Campus2
質問者

お礼

御回答誠にありがとうございました。  2カラムテンプレートで  進化してみます。

  • hitomura
  • ベストアンサー率48% (325/664)
回答No.1

ソースを見てみたところ、文書構造のみを HTML で書いてデザインは CSS で行うという、現在推奨されている Web ページデザインの手法を実践しているだけですね。 このようなページを組みたいならば、CSS の勉強をきちんとして、上記の「文書構造のみを HTML で、デザインは CSS で」を実践できるようになりましょう。 とりあえず要点のみ。後から詳しい人が来ると思いますので詳しい説明はその方にお任せします。

Campus2
質問者

お礼

御回答誠にありがとうございました。  2カラムテンプレートで  進化してみます。

関連するQ&A

  • HPのフレーム

    境界線の色を変えて、細くしたいのですが、 色は変えられたのですが、細くすることができません。 今フレームを呼び出す?ために 『<FRAMESET rows="100,*"> <FRAME src="frame-ue.htm" name="ue">        <FRAMESET cols="100,*"> <FRAME src="frame-hidari.htm" name="hidari"> <FRAME src="frame-main.htm" name="main"> </FRAMESET> <NOFRAMES> <BODY> <P>このページを表示するには、フレームをサポートしているブラウザが必要です。</P>』 としていて、色を変えるのに、 『<FRAMESET rows="15%,85%" BORDERCOLOR="RED"> <FRAME SRC="frame-ue.htm" NAME="ue"> <FRAMESET COLS="15%,85%" BORDERCOLOR="RED"> <FRAME SRC="frame-hidari.htm" NAME="hidari"> <FRAME SRC="frame-main.htm" NAME="main">』 こうしています。 どうすれば細くできますか? もう1つこうゆうタグを使えばいいのでしょうか? わかる方、よろしえれば教えてください。

  • htmlのフレームについて

    メモ帳からホームページをつくっています 二分割フレームを作っていて、それぞれ frame.html framelight.html framemigi というふうに保存しています 一応分割するためのページには <Html> <Head> <Title>フレームのページ</Title> </Head> <Frameset cols="150,*"> <Frame name="hidari" src="1.html"> <Frame name="migi" src="2.html"> </Frameset> <Noframes> フレーム未対応ブラウザへ表示される部分。 </Noframes> </Html> をコピペして作ってあります    src= のところは変えてあります パソコン内からframe.htmlを開くと分割されたものしか出ません そうゆうものなのでしょうか

  • フレームの分割について

    HPを作成中です。3分割にして左右、下にフレームを作っていますが思うようにできません。 <html> <head> <frameset cols="47%,53%"frameborder="1">      <frame src="left.html"> <frame src="right.html"> <frameset rows="85%,15%"frameborder="1"> <frame src="bottom.html"> </frameset> </frameset> </head> </html> 左右は作れますが下のフレームができません。 教えて下さいお願いします。

  • フレームページの作り方

    こんにちわ。 フレームページを作るために下記のタグでいこうと思うのですが HTMLファイルどうやって作ってどのようにアップさせればいいのか わかりません。それとHTMLファイルは自分のデスクトップに置いてあるファイルを直接この下記タグ<frame src="left.html"> <frame src="right.html">に貼り付けていいのでしょうか? ご回答おねがいします。 <html> <head><title>左右に分割するフレーム</title> </head> <frameset cols="20%,80%"> <frame src="left.html"> <frame src="right.html"> </frameset> </html>

    • ベストアンサー
    • HTML
  • フレームのことなんですが

    説明しにくいので、もしわかりにくければ下記のソースを参考に ご回答いただけるとありがたいです(4つ有効なリンクが貼ってあります)。 四分割のフレームをつくりました。 その内の一つにyahoo.co.jpを設定してあります。 そのyahooの右側の「個人ツール」の箇所だけ 焦点をあてて表示させる方法はありませんか? 一目でメールチェックができるようにしたいので。 なお、HP作成ではなく、まったくのローカルで使うものです。 <HTML> <HEAD> <TITLE>LINK</TITLE> </HEAD> <FRAMESET COLS="50%,50%"> <FRAMESET ROWS="42%,58%"> <FRAME SRC="http://www.google.co.jp" NAME="google" SCROLLING="auto" > <FRAME SRC="http://www.goo.ne.jp" NAME="goo" SCROLLING="auto" > </FRAMESET> <FRAMESET ROWS="73%,27%"> <FRAME SRC="http://www.yahoo.co.jp" NAME="yahoo" SCROLLING="auto" > <FRAME SRC="http://www.infoseek.jp" NAME="infoseek" SCROLLING="auto" > </FRAMESET> <NOFRAMES> <BODY> 本ページはフレームで構成されております。<BR> フレーム未対応のブラウザでは表示できませんのでご了承ください。</BODY> </NOFRAMES> </FRAMESET> </HTML>

    • ベストアンサー
    • HTML
  • HP作成(フレーム)

    自分のHPを右&左にわけて、 左のボタンを押すと、右に表示されるようにしたいです。 例えば・・。 <FRAME SRC="NAME="hp-hp"> <HTML> <HEAD> <TITLE>hp-hp</TITLE> </HEAD> <FRAMESET COLS="30%,70%"> <FRAME SRC="hidari.html" NAME="hidari"> <FRAME SRC="migi.html" NAME="migi">   </FRAMESET> </HTML> これを、やったら、 フレームが4つに別れてしまいました。 わかりやすい方法で教えて下さい。 お願いします☆

  • フレームについて質問

    メニュー(五つ以上)が左。メインが右というようにフレームを設定したいのですがなぜか下のタグでやると、指定したHTMLが(例えばBBSとかが) 出てこないんです。それとその指定した画面は他のHPで発見するのです。 (そのHPを開いていたので・・・・) <FRAMESET FRAMEBORDER="0" COLS="20%,80%"> <FRAME SRC="3page.html"NAME="migi"> <FRAME SRC="index.html"NAME="bbs"> </FRAMESET> どうやればフレームを成功させる事が出来ますか?教えて下さい。。

  • フレーム分割のスクリプトについて

    画面を3つに分割し、top1,top2,top3を作成して、 top1のみ、右端のスクロールバーを無し(画面固定)にするには、どのようにすればよいのでしょうか? <html><head> <title>top</title> </head> <frameset rows="350,*"> <frame src="top1.html"name="top1"> <frameset cols="200,*"> <frame src="top2.html"> <frame src="top3.html"name="bottom"> </frameset> </html> 宜しくお願い致しますm(_ _)m

  • フレームのことで

    今、作っているサイトでは縦2分割のフレームを利用しているんですが ちょっと困っています。 それは、左側の小さい方のフレームにサイトの主なメニュー(リンク)を 置いているんですが、そのリンク先が大きいほうのフレームに 表示させたいのですが、小さいフレームにリンク先が出てきてしまいます。 小さいフレームにある方のリンク先を大きいフレームの方に 表示させるにはどうしたらいいですか? ちなみに、フレームは以下のタグを使っています。 どんなタグをどこに書き足したらいいのか、教えてください。 <FRAMESET COLS="25%,75%"> <FRAME SRC="menu.html" NAME="main.html"> <FRAME SRC="main.html" NAME="main.html"> </FRAMESET>

  • フレーム分割した全体をスクロールバーで動かせないでしょうか?

    フレーム分割したホームページをスクロールバーで上下したいのですが、書き方が分からなくて困っています。お分かりになる方がいらっしゃいましたら、教えて下さい。 尚、当方htmlでようやく簡単なページが作れるレベルです。宜しくお願い申し上げます。 尚、フレームの割り方が違う時はそちらもお教え下さいませ。 <HTML><HEAD> <META Http-Equiv="Content-Type" Content="text/html;charset=Shift_JIS"> <TITLE>フレーム分割</TITLE></HEAD> <FRAMESET Rows="195,*,50" Frameborder="1"> <Frameset cols="10%,80%,10%" Frameborder="1"> <FRAME Src="./frame1.html" name="f1" Scrolling="no"> <FRAME Src="./frame2.html" name="f2" Scrolling="no"> <FRAME Src="./frame1.html" name="f3" Scrolling="no"> </Frameset> <Frameset cols="10%,20%,60%,10%" Frameborder="1"> <FRAME Src="./frame1.html" name="f4"> <FRAME Src="./f001.html" name="f5" scrolling="no"> <FRAME Src="./f002.html" name="f6" scrolling="no"> <FRAME Src="./frame1.html" name="f7"> </Frameset> <FRAME Src="./end.html" name="f8" scrolling="no"> <NOFRAMES>恐れ入りますがフレーム対応ブラウザでご覧下さい</NOFRAMES> </FRAMESET> </HTML>

    • ベストアンサー
    • HTML

専門家に質問してみよう