ホームページビルダー基本編
フレーム
- フレーム利用の注意点
- フレームページの仕組み
- フレームの作り方
- フレームのリンク(フレームに名前をつけよう)
- フレームの幅
- すでに作成したページをフレーム内に開く
- フレームの枠を表示しない
- ページタイトルをつける(公開した時、ウィンドウの上の方にアドレスが表示されてしまう方へ)
- フレームページを保存するときの注意
- フレームサンプル (別ウィンドウで開きます)
- インラインフレームとはこんなフレーム
- インラインフレームの挿入
- 外部からフレーム内にリンク
- インラインフレームのスクロールバーに色を付ける方法
- インラインフレームの枠線
フレーム利用の注意点
以前は、フレームを利用したページが多かったのですが、現在は検索エンジンとの相性があまりよくないため利用を避ける傾向にあります。(追記/2007年9月)
「Google はフレームを含むページを登録しますか。」/Googleヘルプセンター
フレームページの仕組み
●左にメニューページ、右にメインページを表示する2分割されたフレームページの場合
メニューページ→
とします。
メインページ→
とします。
この二つのページを一つにまとめる為にもう一つ
フレームページが存在します。
+
+
=
と、なります。
このフレームの中に
と
のファイルを開いています。
だから、
と
に使われているフレームは同じですね。
トップページをフレームページにしたい時などは、
このフレームファイルが「index.html」になります。
以前、このサイトで利用していた、上フレームは固定され、下フレームのみが左右分割された3分割はどうなっているのでしょう。 答えは、簡単!
+
=
と、なります。
このフレームの下の部分→
下フレームに
のフレームページをリンクさせれば完成です。
フレームページの作り方
ツールバよりフレーム→フレームの分割→上下・左右・指定のいずれかを選択
この時、3つのファイルが出来ています。
フレームのリンク(フレームに名前をつけよう)
横や上下のメニューをクリックすると別のフレームの中に次のページが表示されるようにするには、フレームに名前を付けなくてはいけません。(V7では、自動的にframe○と設定されます。)
リンク先を表示したいフレームへカーソルをもっていって→メニューバーより フレーム→フレーム属性の変更→フレーム名→半角英数で名前を入力
この作業をするとリンクをはるとき、ターゲットの欄にここでつけた名前が出てきて、別フレームへのリンクができます。
※名前を付けたらフレームページの保存を忘れないようにしましょう。
フレームページの保存は、フレーム→フレーム設定ページの上書き保存 で出来ます。
フレームの幅
フレーム枠をドラッグしてお好みの大きさに。この方法は見る人のブラウザに合わせて変化します。
フレーム枠を固定した大きさで表示したいときは、 固定したいフレームにカーソルをもっていって
フレーム→フレーム属性の変更→サイズ指定→ピクセルを選択
次に反対のフレームにカーソルをもっていって→フレーム→フレーム属性の変更→サイズ指定→指定
フレームサイズは、「パーセント」や「*指定」もあります。
※「*指定」とは。。
例えば、2分割のフレームの場合、左フレーム「200ピクセル」と設定し、右フレームを「*指定」と設定した場合、左フレームは200ピクセルで表示され、右フレームは残りのウィンドウサイズというふうに、見る人の環境により、サイズが自動的に調整されます。
既に作成したページをフレーム内に開く
開きたいフレームにカーソルをもっていって右クリック→フレーム内に開くを選択
フレームの枠を表示しない
フレーム→フレーム属性の変更→境界線属性→境界線の表示 なし。
または、境界線の表示「あり」、境界線の太さ「0ピクセル」
ページタイトルをつけたい(公開した時、ウィンドウの上の方にアドレスが表示されてしまう)
編集画面、「フレームなし」のタブをクリックし、書式→ページの属性→タイトル欄へ記入する
V7の場合・・・「フレームなし」のタブをクリックし、編集→ページの属性→ページ情報→ページタイトル欄へタイトルを記入する
または、「フレームHTMLソース」タブをクリックし、<title></title>という個所を探し、間にタイトルを入力します。
ココのサイトの場合は、<title>ホームページビルダー作成報告</title>となります。
フレームページを保存するときの注意
上書き保存の際、保存されるページはカーソルのあるところのファイルのみです。
フレームやフレーム内の全てのページを保存したいときは、メニューバーの ファイル→すべて保存 を使って保存します。
フレームページのみ保存したいときは、メニューバーの フレーム→フレーム設定ページを上書き保存 を使います。