gedit で見える内容と firefoxで見える内容が異なります. どちらも開いているのは index.htmlというファイルです. 同一の内容のデータ(ファイル)でもソフトウェアによって解釈が異なり, 表示が違ってくる事を良く理解しておいて下さい.
このことは文字コードでも同じです. ASCII コードでは 文字の 1 は数の 49(10進)です. コンピュータ内の 49という数を ASCIIコードと解釈すると文字の 1になるのです.
HTMLは, Hyper Text Markup Languageの名が示す通り, 一種の (Markup = 印付けのための)人工的な言語です. Hyper Textというのは相互参照を持つ文書の 集まりの事で, 1960年代にはこの概念は存在していました. この概念を考案したのは Douglas Engelbart と言う人で, マウスの発明家 でもあります. この概念に Hyper text と言う名前をつけたのは Ted Nelson と言う人のようです.(詳しくは, 参考書第1章 1.1, 1.2 を 読んで下さい.) HTML 以前にもハイパーテキストを扱うソフトウェアは 存在していました(有名なのは Apple の HyperCard). HTML がこれだけ浸透したのは, ネットワーク経由でのアクセスを 想定した事とともに, インターネットの発展と時期を同じにしたと言う理由です.
HTMLは文書の内容とともに「文書の相互参照と論理構造」を 記述していきます. Browserは, HTMLに書かれた論理構造に従った 表示をするように設計されています. 従って, 例えばもとの文章に あった改行は, browserでみると無視されます. 改行は 論理構造に関係ないからです. また, 論理構造に従って 文字の大きさを変えたり, 改行したりリストの中黒・をつけたり しています.
もう1つ注意して欲しいのは, HTML は, テキストファイルを利用している事です. 前回, テキストファイルと画像ファイルの大きさの比較をしましたが, 大きさの桁が違っています. 最近はネットワーク通信のスピードが 速くなりましたが, それでも他のデヴァイス(DVD やハードディスク) から比べると遅いものです. その通信に, firefox で表示されている index.html の形の画像を送っていたのでは, 効率が悪すぎます. 実際, index.html の大きさは 1KB 程度ですが, firefox で表示される ものを画像にすると, 例えば PDFファイルでは, 50KB 程度になり, 約50倍の大きさになります. そこで, 通信データは少なくし, 表示する方で工夫するという 「分散処理」の考え方が, ネットワーク通信では基本です.
HTML にはいくつかのバージョン(版)がありますが, この講義では 現時点での仕様が確定している最新バージョン 4.01 に基づいた話をします.1 このバージョンでは相互運用性という事が重視されており, 見た目ではなく, browserや使う人に対する依存性をなくする事が重視されています.
HTMLでは, 論理構造と相互参照はタグ(tag)によって記述されます.
タグは不等号 
で囲まれます. タグは基本的に開始タグと
終了タグがあります. 例えばパラグラフ(段落)の開始タグは, <p>
でそれに対する終了タグは</p>です. タグは大文字, 小文字の
区別がありません. <html> と<HTML> は同じ意味です.
index.html を見ればわかりますが, タグは入れ子構造で用います.
HTML の開発動機は, 効率的な情報共有です. この考え方は今も 変わっていません. このことも頭の隅に入れておいて下さい.