まずはページのソースを書いてみます。
何を使って書くか……まあ、メモ帳でも何でもいいです、普通のテキストファイル(.txt形式)が編集・保存できるものであれば。
→ソフトウェアのお話 ※テキストエディタを参照のこと
<html> <head> <title>てすとぺぇじ</title> </head> <body> <h1>てすとぺぇじ</h1> <ul> <li><a href="(URL)">「ホーム」へ戻る</a></li> <li><a href="(URL)">「ホムペをソースから作ってみる」へ戻る</a></li> </ul> <div> <h2>もじふぉんとのてすと</h2> <h3>から~てすと</h3> <font color="red">赤</font> <font color="blue">青</font> <h3>もじさいずてすと</h3> <font size="6">てすと</font> <h3>しょたいてすと</h3> <font face="HGP行書体">てすと</font> <h3>せんたりんぐ(中央寄せ)てすと</h3> <div align="center">てすと</div> </div> <div> <h2>てすとよび</h2> <h3>……(以下略</h3> </div> <ul> <li><a href="(URL)">「ホーム」へ戻る</a></li> <li><a href="(URL)">「ホムペをソースから作ってみる」へ戻る</a></li> </ul> </body> </html>
上記のページのソースをブラウザ上で見ると以下のようになります。
→ testpage.html
ファイル保存に関しては後で。まあ、とりあえず見とけという話です。
いかがでしょうか、超基本的なページができましたね。
大体のサイトはここから説明するみたいですが、うちのサイトもそれに倣ってとりあえずやっときます。
それで、「<~>」でくくられているコードを
HTML(Hyper Text Markup Language ハイパー・テキスト・マークアップ・ランゲージ)タグといいまして、
まあ、HTMLというか、ウェブページを形作るのに基本的に必要なものです。
このコードひとつでテキストの色から背景画像、さらには改行まで表現します。
(別に言葉についてはさほど重要ではない)
また、「<~>」に対して「</~>」というのがあります。
たとえば「<html>」に対して「</html>」、
「<body>」に対して「</body>」といった感じです。
これは、たとえば「<html>」「<body>」がタグの開始(開始タグ)に対する、
「</html>」「</body>」はそれらのタグの終了部分(終了タグ)となっております。
開始させたものについては終了まで面倒見てあげましょうということです。
ただ、世の中、終了タグを持たないものもあります。
たとえば、「<br>」「<hr>」「<meta>」あたりが該当するのですが、そういうのも存在しています。
しかし、終了タグのないものは基本的に少ないほうなので、さして意識する必要はないです。
その代わり、終了タグがあるものに関しては、しっかりと閉じるということを考えましょう。
中には省略できるものもありますが、意図しない挙動をすることもよくあるため、個人的には推奨しません。
また、タグは入れ子にもできます。入れ子というのは、
<b>ああああ<i>ああああいいいい</i>いいいい</b>
こういうものです。
要するに、開始タグと終了タグの間(<b>から</b>の間)にまた別のタグがあるという状態ですが、
こういうのも可能です。
ただし、
<b>ああああ<i>ああああいいいい</b>いいいい</i>
のように、タグの入れ子関係を崩すような書き方をしてはいけません。
入れ子関係が崩れることで、一部の人に迷惑をかけます。
せっかく作ったページですから、保存をしなければ意味がありません。
上では「testpage.html」として保存しています。
メモ帳だと基本的に「(名前).txt」という形式で保存しますが、ウェブページとして保存したいため、
拡張子をHTMLとして認識するものでなければまったく意味がありません。
そのため、ウェブページを保存する際は「(名前).html」として保存してください。
そして、「(名前)」ですが、半角英数字を推奨です。
ウェブページはページごとにURLを持ちますが、基本的にウェブページはファイル名で判別します。
URLってほとんどのサーバで半角英数字ですが、そのほとんどのサーバが日本語のファイル名をサポートしていないからなのです。
サーバによっては日本語にもできたりするけれども、その仕様にするのにも大人の事情が……
そのため、それを見越し、最初から半角英数字のファイル名にすることを心がけましょう。
尚、HTMLの拡張子については「.html」以外にも「.htm」が使えます。
現在は基本的に差異はありませんので好きな方を使えばいいと思います。
(「.htm」が使えるのは昔に拡張子3文字システムというのがあった名残です。)