HTML側のベースを作る
これは骨格です
なんにでも使えるから、骨格。
ここでは、ＨＴＭＬファイルを作ります。
最低限のタグがあればいいのですが、できれば、そのままアップロードできる方が便利ですよね？
そんなわけで、
最低限の骨格タグ＋最低限のＳＥＯタグ
これを意識した、ＨＴＭＬファイルを作ることにします。
初心者の方は、読んだだけでは、絶対に理解できないので、実際に、ご自分でやってみることをオススメします。
- ファイルを作る
- 骨格タグを書く
- ヘッダータグを書く
- ファイルを閉じる
一口メモ
ホームページの（ＨＴＭＬタグ）説明は、
ホームページ作成を参照してください
最初に、ファイルの置き場を作ります。
ファイルマネージャ（エクスプローラー）を開いて、好きなところに、フォルダーを用意します。
下の手順に従ってください（Win-xpの場合です）
１．任意のフォルダーを左クリック
２．一番上の「ファイル」を左クリック
３．新規作成 ＞ フォルダー の順で選択
４．「新しいフォルダ」が作られる
５．フォルダーの名前を好きな名前に書き換える
フォルダーができましたね？
次は、ファイル作成です。
あなたのホームページに名前をつけます。
テキストエディターを開いてください。
ＩＥ（インターネットエクスプローラー）なら、下の順でメモ帳を立ち上げることができます。
左下の「スタート」
＞ すべてのプログラム
＞ アクセサリー
＞ メモ帳
「メモ帳」が、立ち上がりましたね。
よろしいですか？
では、「名前をつけて保存」を選んで、閉じてください。
ファイル名は「 index.html 」 保存先は、先ほど、あなたが作ったフォルダーです。
保存するときの注意です。
メモ帳の場合、「 ＊.txt 」と表示されますので、気をつけて下さい。「 index.txt 」とはしないように。「
index.html 」が正解です。
まだ、外側だけしかできていませんが、これがＨＴＭＬのファイルの入れ物となります。
ファイルができたら、次は、骨格を組み込む。
先ほどの「 index.html 」を開いてください。
ＨＴＭＬファイルを、左クリックで開くと、コンテンツが立ち上がってきます。今は、何も書いていないので、空白のページがあるだけですね。
いま、やりたいことは、ＨＴＭＬファイルを編集です。クリックは右になります。
右クリックで表れるメニューのうち、「編集」を選ぶと、ファイルの中身が表示されます。
（ＰＣやセットアップによって、プルダウンメニューが違ってきますが、とにかく右クリックから選ぶのです）
ファイルを開きましたか？
ファイルの中身は当然、真っ白ですね。
そこに、下のタグを書いてください。
<html>
<head>
</head>
<body>
</body>
</html>
コピペしても、かまいません。
でも、真剣に覚えたいあなたは、当然、手打ちしますよね？
書き込んだら、とりあえず「保存」しておく。
左上の「ファイル」をクリックすれば、メニューが現れますね。
「上書き保存」を選ぶと、保存されます。
せっかく作ったファイルです。ダメにしないためにも、「上書き保存」は、クセにして下さい。
保存はできましたね？
骨格が、これで完成しました。
ホームページの、キーワード対策をしておきます。
下のタグを、そのまま打ち込んでください。
打ち込む位置は、<head>と</head>の間です。
キーボードから打ち込むのがいいですね。これも練習です。
<meta name="robots" content="index,follow">
<meta name="keywords" content="キーワード">
<meta name="description" content="ページの説明">
<link rel="stylesheet" type="text/css" href="css/style.css">
<title>タイトルを書く</title>
タグの意味ついては、ＨＴＭＬを参考にして下さい。詳細は省きます。
上記のうち、日本語で書いてある部分は、あなたが自分で決める部分です。ホームページの内容や、上位表示させたいキーワードを考えた上で、書き込むことになります。
いまは、先に進みます。言葉だけ埋めておいて下さい。
上記の順番に従って、ファイルを作りましたか？
これで、保存すれば、ＨＴＭＬファイルは完成です。
ただし、このまま開いても、なんにも、表示されません。
ちょっと物足りないですよね。
せっかく作ったホームページです。
コンテンツをいれましょう。
<body>と</body>の間に、下の字を書いてください。
<body>
<!-- MyHomepage -->
<font color="red" fontsize="big">
これは、わたしのホームページです。
</font>
</body>
打ち終わったら、上書き保存です。
保存したら、ファイルを開いてください。
こんどは、左クリックです。
いかがですか？
文字は赤いですか？
タイトルは、表示されていますか？
もし、タイトル部分に 「タイトルを書く」 と表示されているなら、直しておいてください。タイトルに表示される言葉こそが、訪問者の目にとまるあなたのホームページ名です。
いかがでしたか。これで、この章は終わります。
もし、よく分からないところがあればメールを下さい。あなたが理解している部分、分からないところを書いていただければ、分かる範囲でお答えいたします。
次のページでは、いま作ってもらったファイルに、ＴＡＢＬＥを組み込んでもらいます。お楽しみに。
次＞ ＴＡＢＬＥを組み込む
一口メモ
１．
<!-- --> で挟まれた文字は、コメントです。
コンテンツにはなりませんが、タグを管理するにあたって、説明を書いておくと便利です。
２．
ＨＴＭＬファイルを”見る”ために、作成中のファイルを閉じる必要はありません。
”上書き保存”をしておけば、書き換えた内容がちゃんと反映されます。
|
