HPデビュー！（ＨＰ作成講座-超初級編）
その５（フレームの作成）

　本来ならここで、画像の挿入、音楽の貼り付け、リンクの張り方をやる予定でしたが、リクエストがあったため急遽フレームの貼り付けを講座することになりました！

　　　　　　　
ステップ その前にトップの画像が重いので、別な画像にします！ ここでの素材はキューピーの城という素材屋さんからＤＬしてきた素材を使います！
０ （省略）
<BODY background="ao2.png">
（省略）		 変更箇所はこの部分ですが、この画像はＤＬしてきたものとし、更に実験フォルダ内にao2.pngファイルが入っているものとします。
流れ ジオシティではトップのページがindex.htmlというファイル名でないといけないため、トップページをフレーム化することはできません！そこで、まず表紙のページをつくり、それからフレームのページとメニューのページ、メインのページというふうにここでは４つのページを作ります！尚、ここではメニューのページにカウンターをつけることとします！
ステップ メニューページをつくる ここでは、m_neko.gifが実験フォルダ内に入っているものとします。
１ <HTML>
<HEAD>
<TITLE>メニュー
</TITLE>
</HEAD>
<BODY background="ao2.png">
<BR>
<IMG SRC="@geocounter">
<BR>
<BR>
メニュー
<P>
<A href="mein.html">メインページ</A><BR>
<A href="profiel.html">プロフィール</A><BR>
<A href="http://www.accessup.net/cgi-bin/bbs.cgi?dori4770">掲示板</A><BR>
<A href="http://www.provide2.jpn.org/diary_c/diary.cgi?id=0421ta">日記帳</A><BR>
<A href="link.html">リンク</A><BR>
</P>
<HR>
<P><A href="mailto:tama@sake.cc">
<IMG src="m_neko.gif" alt="ＨＰ作成講座より"border="0">←メール</A></P>
</BODY>
</HTML>		 メモ帳を開き、右のタグをコピー＆貼り付けし、ファイルの名前をmenu.htmlとし名前をつけて実験フォルダ内に保存させます！
ステップ メインページの作成
ステップ <HTML>
<HEAD>
<TITLE>メインページ
</TITLE>
</HEAD>
<BODY background="ao2.png">
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<P align="center"><FONT color="red"><FONT size="+4"><B><I>メインページ</I></B>
</FONT color="red"></FONT size="+4"><P>
</BODY>
</HTML>

 ファイル名を
mein.html
として実験フォルダ内に保存。
ステップ フレームページの作成
<HTML>
<HEAD>
<TITLE>フレーム </TITLE>
</HEAD>
<FRAMESET cols="26%,*">
<NOFRAMES>
<BODY>
<P>このページをご覧いただくにはフレーム対応のブラウザが必要です。</P>
</BODY>
</NOFRAMES>
<FRAME src="menu.html">
<FRAME src="mein.html">
</FRAMESET>
</HTML>		 ファイル名を
frame.html
として実験フォルダ内に保存。
ステップ index.htmlファイルの変更
<HTML>
<HEAD>
<TITLE>HP作成実験
</TITLE>
</HEAD>
<BODY background="ao2.png">
<P align="center"><BR><BR><BR><BR>
<BR><BR><BR>
<B><I><FONT size="+3">ＨＰ作成講座！</FONT></I></B><BR>
<BR>
<BR>
<BR>
<BR>
<A href="frame.html" target="_top"><B><FONT size="+1"><BR>
<BR>
<IMG src="odoru_uma.gif" width="50" height="50" border="0"></FONT></B></A><BR>
<BR>
<BR>
<BR>
<BR>
<BR>
</P>
</BODY>
</HTML>		 index.htmlを左のように変更させます。なお赤字のところは画像ファイルodoru_uma.gif
が実験ファイル内にあるものとします。