初心者ホームページ作成ガイド




HTMLの超初級講座です。

まず、HTMLとは、HyperText Markup Language の略

では、そのハイパーテキストとは何かというと…gooの辞書によれば、「特定の文字列から関連する文書・音声・画像を検索できるシステム」と記してある。この言語なくしてインターネットが存在しないわけでして、このHTMLを利用してすべてのサイトが構築されているといっても過言ではないのです。まあ、つまりこのプログラムでウェブ向けの綺麗なページが出来るって事。

最近ブログなど利用する機会が非常に多くなりましたね。そうネット初心者でもそのブログで使えそうなタグをちょっと記してみたいと思っていますが、とりあえず基本の基本としてHTMLの構造などを理解してゆけば非常に応用が利くのではないでしょうか?

それでは、ちょっと実験してみましょう。まずメモ帳(※メモ帳とは、スタートメニュー、プログラム、アクセサリーの中から起動が可能です。)で一度実験です。難しいこといってもわからないので試してみよう。

HTMLは、<…><…> (タグ)でくくるわけです。(※タグすべては半角で打ち込んでください。大文字小文字はどちらでも使えます。)それでは、メモ帳を起動してみてください。

まず
<html>〜</html>
HTMLはこのようにはさみ将棋のようにはさんでください。

次に
<head>〜</head>
の部分と
<body>〜</body>
の部分に分かれます。

この<head>〜</head>と<body>〜</body>を<html>〜</html>の間に挟みます。

こんな感じですね。
<html>
<head>
</head>
<body>
</body>
</html>
つまりheadは頭。 bodyは、体と考えていいでしょうね。頭は脳ミソであり心と考えれば、目に見えない部分をあらわします。そして体は、表に現れる部分です。つまり目に見える部分。と考えてください。ですのでとりあえず、目に見える部分のbodyをいじってみて実際に変化していく様子を見てみましょう。

それでは、<body>〜</body>の部分に「こんにちは」とでも入れてみましょう。
<html>
<head>
</head>
<body>
こんにちは
</body>
</html>
それを一度保存します。ファイル名は適当でいいですが、拡張子(.の後の部分)は、test.htmlとして保存してください。その時メモ帳の拡張子が、.txtなので、 .htmlに変更して保存します。拡張子の変更などやった事がない人が多いと思いますが。この場合は、勇気を持ってやってください。保存先はデスクトップがいいかな?

いかがですか?アイコンが変わっているでしょう?インターネットエクスプローラのアイコンに変わってるはずです。基本的に…

それでは、そのアイコンをクリックします。どうですか?「こんにちは」だけが現れますね。

この「こんにちは」のことばをあるタグでくくります。
<font>こんにちは</font>
この場合は変化がありませんので属性といって内部をちょっと追加してみます。
size="+1"をいれてみます。つまりサイズを1ポイント大きくするよという意味ですね。
<font size="+1">こんにちは</font>
これを

次に
<html>
<head>
</head>
<body>
こんにちは
</body>
</html>
のなかに入れます。
<html>
<head>
</head>
<body>
<font size="+1">こんにちは</font>
</body>
</html>
さあ、どうでしょう?
もう少し大きくしてみましょうか?
<html>
<head>
</head>
<body>
<font size="+4">こんにちは</font>
</body>
</html>
いかがですか?楽しいでしょ?

今度は色つけてみましょう?
<html>
<head>
</head>
<body>
<font size="+4" color="red">こんにちは</font>
</body>
</html>
色は、どんな色でも可能です。
色は、どんな色でも可能です。
色は、どんな色でも可能です。
標準16色です。

黒/black グレー/gray シルバー/silver 白/white 茶色/maroon 赤/red パープル/purple
 ピンク/fuchsia 緑/green ライム/lime オリーブ/olive 黄色/yellow 紺色/navy 青/blue
 深緑/teal 水色/aqua

もちろんカラーパレットとして、
http://www.realint.com/colorsample.html

大体理屈はこんなもんです。
後は使うタグを少しずつ勉強してゆけはいいんですよ。

簡単でしょ?

ちなみに水平線は、<hr>一つでOK!

こちら参照下さい。

ということで簡単ですが、この<body>〜</body>の間のタグさえ理解してしまえば
ほとんどのブログでも使用可能です。
(※もちろん使えないタグなども結構あったりしますけど。)


まずは簡単タグ講座です。
この続きも予定はありますがとりあえず今日はこれまで。


ホームページ作成の手順 にもどる

トップに戻る