左メニュー形式のテンプレートです。基本的な作りはほとんどこのサイトと同じです。ビミョウにリンクの仕方などを凝ってみたのでサイトを作ったことのない人が見るとよくわからないかもしれないですが、別段たいしたことやってるわけではないです。
　
　今回はテンプレートを使って実際に広告と文章を入れてアレンジしてみました。このままでサイトにしてうまくいくかどうかはわかりませんが、参考にしてもらえばと思います。
　
　ちなみにタイトル横のフラッシュ広告はカリビアンコムガールの広告。紹介している出会い系サイトはCyber-adのサイトです。素材も各サイトで公開しているのを利用しています。
　

　■　上のテンプレートの説明
　
　 このテンプレートはこのサイトと同じように、一つのページをいくつにもコピーすることでサイトを作ることが出来ます。ただ、メニュー欄のリンクの追加をひとつひとつやっていくのはとても大変なので、一括して変換できるソフトを利用しましょう。自分はTextSSを利用させてもらってます。
　
　あと色はスタイルシートを変更することで変えることができますが、もともとこのテンプレートはテンプレートとして公開するつもりで作ってたわけでなかったものを改造しているので、スタイルシートの作り方がとてもいい加減です。
　
　とりあえず変えどころとしては
　
メニュー欄のリンクの色である
「A.menu」の「background-color」、(最初は#e6e6ff　こんな色→■）
　
メニュー欄のリンクにマウスが来たときの色である
「A.menu:HOVER」の「background-color」、(最初は#e0c1ff　こんな色→■）
　
見出しのセルの色である
「TD.menu1」の「background-color」、(最初は#98ace0　こんな色→■）
　
サイト説明セルの見出しの色である
「TD.name」の「background-color」、(最初は#ceffce　こんな色→■）
　
くらいだと思います。順番がばらばらなので探しにくいかもしれませんが、スタイルシートはワードパットなどでも開いて変更できるので、興味があれば色を変えてみてテンプレートをアレンジしてみてください。
　
　
　

　
　レイアウトを灰色主体で作ったサイトです。上段右側にアクセスランキングを想定して数字が書いてありますが、このままだと手動で更新しなければならないので、面倒だと思ったら「アクセスランキング」のなかで紹介しているアクセスランキングをレンタルして使うようにしてください。フリースペースと書いてあるところにＸＶＮやＤＴＩ、cyber-adなどの広告を入れたり、ほかのサイトの宣伝を入れればある程度ページも華やかになるかと思います。
　
　サイト構成はindexとmainの２つで中身は一緒です。サイトタイトルは文字で書いてありますが、ロゴを作ったほうが見栄えがいいので、できればロゴでタイトルを作ったほうがいいです。
　
　紹介用のテーブルがいくつかありますが、不要だと思ったら削除、必要だとおもったらコピーして増やしてください。
　
→実際に見てみる
　
→テンプレートをダウンロードする
　

　
　レイアウトをピンク主体で作ったサイトです。中身は上のテンプレートと同じです。

　
　レイアウトを緑色主体で作ったサイトです。中身は上のテンプレートと同じです。

　■　上三つのテンプレートの説明
　
　テンプレートのデザインはテーブルと呼ばれる表を使ってレイアウトしています。表はそれぞれのサイトで主体にしている色で囲まれた部分です。二重線になっている部分は表の中に表を入れていることを表しています。それぞれのサイトを改造する際に新しく表を入れると、その表もそれぞれ主体にしている色で囲まれます。これはスタイルシートでそうなるようにしているからです。
　

　■　スタイルシートの説明
　
　スタイルシートはサイトをレイアウトするために使います。使わなくても作れますが、使ったほうがサイトのレイアウトがしやすくなります。それぞれのテンプレートは主体にしている色の名前のスタイルシートが入ってます。スタイルシートはワードパットなどのテキストエディタで編集できるので、ためしに開いてみるといいと思います。以下スタイルシートによってレイアウトしている部分です。
　
　□スクロールバーの色
　
　このサイトでもスクロールバーの色の変え方を解説していますが、サンプルではスクロールバーの色をスタイルシートで変えています。色を変えたい場合は「色付きスクロールバー」を参考にどうぞ。
　
　□表の周りの色
　
　上のテンプレートでは主体にしている色があり、表を作ると自動的にその色が付くようになっています。具体的にはスタイルシートの中のTABLE{〜}で囲まれた最後の部分に色の名前が四つ連続で書かれています。もし色を変更したい場合はここの色を変えたい色に変更してください。
　
　□文字の色
　
　灰色主体のテンプレート以外は文字の色を変えています。文字の色を変えたい場合はスタイルシートでBODY{〜｝で囲まれている中の　color :の次にある色を変えればＯＫです。色は#ff598f といった書かれ方をしていますが、色の表し方としてこういった方法もあることを覚えておくと便利です。色はこちらのサイトが参考になります。
　
　□リンクの色
　
　リンクが貼ってある文字の色と、リンクの上にカーソルが来た際の色です。具体的にスタイルシートに書かれていることを取り出して解説します。
　
　A{　このＡはリンクが貼ってある文字をあらわす　
text-decoration : none;　←テキストの飾り。noneだと下線は表示されない
color : fuchsia;　←リンクが貼ってある文字の色。
}

　A:HOVER{　このA:HOVERはリンクの文字の上にカーソルが来たときをあらわす
color : fuchsia;　←カーソルが来たときの色
text-decoration : underline;　←カーソルが来たときの文字の飾り。この場合下線が付く
　
　

　■　テンプレート注意点
　
　このテンプレートはある程度改造しやすいようシンプルに作ったつもりです。なのであまり凝った作りではありませんし、ソースの書き方もスマートではないので、ある程度ホームページ作りに慣れるまでのつなぎとして利用していただければと思います。
　
　　あとindexなどのHTMLファイルのほかにスタイルシートファイルがあると思いますが、サーバーにアップロードする際にはこのファイルも忘れずにアップロードするようにしてください。そうしないとサイトに色がなくなってしまいますので。
　　
　

　■　テンプレート免責事項
　
　このテンプレートを使っていかなる不利益を被った場合でも当サイトでは責任を負えません。自己責任でお使いください。
　

　■　ホームページの参考
　
　ホームページについていろいろ参考になるサイトなのでぜひ利用させてもらいましょう。

• とほほのWWW入門

　■　一般のテンプレート
　
　一般サイト用にテンプレートを配布されているサイトです。ホームページデザインの上でいろいろ参考になります。
　

　■　cool-website.net


　無料テンプレート製作とプロのサイト作成のノウハウを公開しているサイト。その名のとおり、クールなデザインのテンプレートが数多く置いてあります。

　■　てんぷれの天ぷら　


　無料テンプレート配布サイト。Ｄreamweaverで作成されたテンプレートなので、使っている人にはオススメです。

　■　Webデザインテンプレート集　


　無料テンプレート配布サイト。トップページのデザインやテーブルのデザインなど、参考になるデザインのものがいろいろ置いてあります。