FujiMan Production - ウェブマスター -
ホームページ制作講座 for Windows
サイト内リンク
トップページ＞ウェブマスター＞ ホームページ制作講座＞サイト内リンク
戻る 次へ
■まずはリンク先ページを用意しましょう


 　ホームページらしくするため、次のみっつのサンプルを用意しました。混み入って見えますが、いままで説明したタグを使っていますので理解（わか）ると思います。
　ひとつだけ<HR>というタグを加えていますが、サンプルを開いていただければそれが「横線」であることが分かるでしょう。 ページ内にメリハリをつけるには欠かせないタグのひとつです。

　「sample_A.html」は、「プロフィール」のページ。
　「sample_B.html」は、「写真」のページ。
　「sample_C.html」は、「リンク」のページ。

・・・になります。トップページは通常「index.html」のような名前を付けますが、ここでは「sample18.html」として説明します。 「sample18.html」には、このみっつのページにジャンプするメニュー・ページになります。

sample_A.html sample_B.html sample_C.html
<HTML>
<BODY
　　BGCOLOR=antiquewhite
　　TEXT=darkgreen
　　LINK=darkred
　　VLINK=darkgoldenrod
　　ALINK=deeppink>
<FONT SIZE=6><B><I>
Profile</I></B></FONT>
<HR>
<DL>
<DT><B>捕獲地</B>
<DD>広島県呉市
<DT><B>原生地</B>
<DD>兵庫県尼崎市
<DT><B>性別</B>
<DD>オス
<DT><B>年齢</B>
<DD>推定40才
<DT><B>性質</B>
<DD>おとなしいが、じっとしていない
</DL>
<HR>
<A HREF="sample18.html">戻る</A>
</BODY>
</HTML>
 <HTML>
<BODY
　　BGCOLOR=black
　　TEXT=aqua
　　LINK=lime
　　VLINK=darkcyan>
<FONT SIZE=6><B><I>
Photos</I></B></FONT>
<HR>
<TABLE>
<TR>
<TD><IMG SRC="flow002s.jpg" HEIGHT=135 WIDTH=180></TD>
<TD><IMG SRC="flow004s.jpg" HEIGHT=135 WIDTH=180></TD>
<TD><IMG SRC="flow006s.jpg" HEIGHT=135 WIDTH=180></TD>
<TD><IMG SRC="flow016s.jpg" HEIGHT=135 WIDTH=180></TD>
</TR>
</TABLE>
<HR>
<A HREF="sample18.html">戻る</A>
</BODY>
</HTML>
 <HTML>
<BODY
　　BGCOLOR=seashell
　　TEXT=slateblue
　　LINK=deepskyblue
　　VLINK=lightseagreen
　　ALINK=salmon>
<FONT SIZE=6><B><I>
Links</I></B></FONT>
<HR>
<UL>
<LI><A HREF="https://
homepage1.nifty.com/anannoken/">
俳優・阿南健治ホームページ
「Ｄream＆Ｓmile」</A>
<LI><A HREF="https://
FujiMan.net">
FujiMan Production</A>
<LI><A HREF="https://
www.chugokuh.rofyky.go.jp/">
中国労災病院</A>
</UL>
<HR>
<A HREF="sample18.html">戻る</A>
</BODY>
</HTML>

　リンク先のページとしてポイントになるのは赤字の部分です。メニュー・ページ（ここでは「sample18.html」）に戻るリンクボタンを指定します。

■要領はリンク集と同じ
sample18.html
<HTML>
<BODY
　　BACKGROUND="lightpnk.gif"
　　BGCOLOR=lightpink
　　TEXT=indigo
　　LINK=darkviolet
　　VLINK=forestgreen
　　ALINK=fuchsia>
<IMG SRC="chara2.gif" HEIGHT=50 WIDTH=50>
<FONT COLOR=maroon SIZE=6>
<B><I>FujiMan Production</I>のホームページ</B><BR>
</FONT>
<HR>
<FONT SIZE=5><B>
★　コンテンツ　★</B></FONT><BR><BR>
<DL>
<DT><A HREF="sample_A.html">
<FONT SIZE=4><B><I>Profile</I></B></FONT></A>
<DD>FujiManのプロフィールを紹介
<DT><A HREF="sample_B.html">
<FONT SIZE=4><B><I>Photos</I></B></FONT></A>
<DD>FujiMan撮影の写真を公開
<DT><A HREF="sample_C.html">
<FONT SIZE=4><B><I>Links</I></B></FONT></A>
<DD>FujiManお気に入りリンク
</DL>
<HR>
</BODY>
</HTML>
　リンクには<A>〜</A>を使いますよね。他のサイトへのリンクは、HREF=に続けてホームページ・アドレスを入力しました。

　サイト内リンクの場合も要領はまったく同じです。HREF=に続けてそのファイルを指定すればＯＫです。

　実は、画像(IMG)タグの「SRC=」も、本体(BODY)タグの「BACKGROUND=」も、ファイルの指定方法はまったく同じです。

　これらのオプションに指定するのは「URL」で指定するようになっています。

　「URL」・・・て、聞いたことありますね。そうそう企業広告なんかにホームページ・アドレスが書かれているときに、「URL=」なんて書いてある・・・ アレです。URLについては次の「コーヒーブレイク」で詳しく説明しましょう。

　とりあえず、リンク集を作りたいときには「https://に続くホームページアドレス」を、サイト内リンクの場合には「ファイル名」を指定すればいいとだけ、 ここでは理解しておきましょう。


戻る 次へ
<-RETURN Copyright(c) 2001 FujiMan Production All Rights Reserved