名前をつけて保存」で、新しいページを作ろう!
ホームページ作りもあと少しで完成ですね!全体的なレイアウトは終わっているので、CSSに書き足すこともあと少しです。
HTMLも「index.html」を参考にしていけば、意外と楽に出来上がります。
あと少しがんばりましょう!
1.新しいページを作ろう!
「index.html」が完成したので、まずは喜びましょう!やったぁ〜!
もう少しで、ホームページも完成ですね!
さてそれでは、2ページ目の サンプル をのぞいてみましょう。
よく見ると、よく見なくてもページ全体のレイアウトは「index.html」と同じですね!
ホームページを作る時は、各ページごとに全く異なったレイアウトにするのではなく、各ページ同じか、似ているレイアウトにした方が、ホームページを見る人もみやすいし、ホームページを作るあなたにとっても作りやすいと思います。
その分、最初のページを作る時には他のページのこともあるので、じっくり考えてレイアウトを組んでいくようにしましょうね!
さて、まずは、2ページめ用のHTMLファイルを作らなくてはなりませんね!
1ページめ(index.html)の時と同じ方法で作ってもいいのですが、せっかく今完成したHTMLファイルがあるので、それを利用して楽に2ページめのHTMLファイルを作っちゃいましょう!
1-1.名前をつけて保存
まず、あなたのホームページの「index.html」のHTMLファイル(メモ帳)を表示してください。
その左上「ファイル(F)」→「名前をつけて保存(A)」→出てきた小窓の「ファイル名(N)」の欄が反転文字になっていると思います。そのままクリックをせず「page2.html」と打ち込んで「保存」をクリック。
すると、「homepage」フォルダの中に新たに「page2.html」というHTMLファイルが出来ました。
更に今開いているメモ帳も「page2.html」になっていますね。(メモ帳の左上に「page2.html-メモ帳」と表示されていますね。)
このメモ帳の必要な部分だけを書き換えていけば、2ページめ以降は比較的楽に作っていけます。
1-2.内容を書き換えよう!
例えば、大見出しを「Wellcome to my Homepage!!」から「2ページ目の大見出し」へ変更する時は、<h1>〜</h1>の中だけをかえればいいですね。
「main_spc」の中身をかえる時は、下のような範囲を一度に消してしまって新たな内容を書き、又同じように次の部分を書き換えていく、という風にしていけばいいですね!
つまり、CSSファイルに対応し、ページのレイアウトを決めているHTMLタグを残して、他の部分を書き換えれば新しいページは、作りやすいということです。
「head」部分も赤い字のところだけ、そのページに合わせて変えてやればOKです!
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta name="description" content="初めてホームページを作ってみました。見てね。">
<meta name="keywords" content="ホームページ,初心者,作成,簡単,入門">
<title>初めてのホームページ</title>
<link rel=stylesheet href="style.css" type="text/css">
</head>
CSSファイルは2ページめ以降にも対応してくれるので、新たに作る必要はありません。
<link rel=stylesheet href="style.css" type="text/css">
の表記があるからですね!
2ページめ以降で新たに設定する時は、今まで使っていたCSSファイル(ここでは「style.css」ですね。)に書き加えていけばいいのです。

