ＨＴＭＬというのは HyperText Mark-up Language の略である。 直訳すると「ハイパーテキストをマークアップする言語」 となる。 ここでいう言語は、語学教育でいうところの「言語」よりは、 計算機のプログラミング「言語」に近いだろう。 実際には簡単な英語の命令（正確には「タグ」と呼ばれる） の組合せで構成されている。 現在インターネットを通じてＷＷＷで見ることが可能なハイパーテキストを作るのに、 比較的単純で誰でも簡単に習得できる「言語」の一つである。
プログラミング言語の一つであるＦＯＲＴＲＡＮとの対比で違いをみてみる。 ＦＯＲＴＲＡＮではＦＯＲＴＲＡＮの文法に従ったプログラムを用意し、 ＦＯＲＴＲＡＮコンパイラと呼ばれる、 文法チェックおよび計算機が直接理解できる形式（実行形式） への変換プログラムを通す。 文法が間違っているとコンパイラがエラーを出し、 文法が誤っていることを知らせる。 エラーがある場合には実行形式のファイルは作られない。 文法間違いが無い場合は実行形式のファイルが作られ実行できるが、 その動作がプログラム作成者の意図したものである保証は無い。 意図した通りに動作するようにプログラムの誤りを直す作業をデバッグと呼ぶ。
これに対し、ＨＴＭＬの場合には、 ＨＴＭＬの文法に従ったＨＴＭＬファイルが必要なことは同様だが、 ＨＴＭＬファイルの解釈はブラウザに直接委ねられる。 ブラウザはＨＴＭＬファイルに書かれている内容を出来るだけ表示しようと試みるが、 文法誤りを告げるようなことはしない。 また文法誤りがあっても表示を中止するようなことは無い。 ＨＴＭＬファイルを用意した人が出来るのは、 ブラウザの表示した内容が自分の意図したものかどうか見るくらいである。 このように、文法間違いをチェックする方法が限られているので、 インターネット上のＨＴＭＬファイルの大部分は、 多少ともＨＴＭＬの文法上誤った部分があると思った方が良い。
また以下のような事情が、 更に文法的に誤ったＨＴＭＬファイルを増やす結果になっている。
このような事情は、ＨＴＭＬ言語の開発の歴史がまだ浅いことも関係している。 ＦＯＲＴＲＡＮのように長く使われている（「枯れた」と呼ぶこともある） 言語とは比較にならないかも知れない。 またＨＴＭＬ言語に要求されている機能が多様であることも関係しているだろう。 とはいうものの、web ページを作成する場合には、 ＨＴＭＬの文法に出来るだけ従うよう心がけるのが良いだろう。
ここでは最も簡単なＨＴＭＬで書いたハイパーテキストを作ってみることにする。
ＨＴＭＬファイルの用意
<TITLE>My web page</TITLE>
これは私のウェブページです。
これだけで一応ＨＴＭＬを使って書いたハイパーテキストと呼べるものが出来る。
なおタグを構成する文字は全て「半角」文字なので注意すること（ここでは <TITLE> と </TITLE>）。
全角文字を使うとタグと認識されない。
ちゃんと書けたらファイルを保存する。
<HTML> <HEAD> <TITLE>My web page</TITLE> </HEAD> <BODY> これは私のウェブページです。 </BODY> </HTML>ここで出てきた <HTML> と </HTML> のタグはハイパーテキスト全体を囲んでいる。 また <HEAD> と </HEAD> はブラウザで表示されない部分を、 <BODY> と </BODY> は表示される部分をまとめている。
<HTML>
<HEAD>
<TITLE>My web page</TITLE>
</HEAD>
<BODY>
ようこそ！
これは私のウェブページです。
最近の話題
最近計算機の使い方に慣れてきました。
大学生活にも慣れてきました。
新しく始めたことなど
私について
私は大阪大学理学部物理学科の１年生です。
</BODY>
</HTML>
このように書いてファイルを保存し
（以下注意しないが、
保存しないとＨＴＭＬファイルの変更が反映されない）、
Netscape で見てみる
（既に index.html を表示している場合には「再読み込み」
のボタンをクリック）。
上でうまく表示されなかったハイパーテキストを修正しながら、 ハイパーテキストにアクセントをつける方法について見てみる。
見出しをつける<BODY> <H2>ようこそ！</H2> これは私のウェブページです。 <H2>最近の話題</H2> 最近計算機の使い方に慣れてきました。 大学生活にも慣れてきました。 新しく始めたことなど <H2>私について</H2> 私は大阪大学理学部物理学科の１年生です。 </BODY>ちゃんと見出しが付いたはず。
<H1>ようこそ！</H1> <H2>ようこそ！</H2> <H3>ようこそ！</H3> <H4>ようこそ！</H4> <H5>ようこそ！</H5> <H6>ようこそ！</H6>違いが分かったら気に入った大きさの見出しのみを残して他は消す。
最近計算機の使い方に慣れてきました。<BR>
大学生活にも慣れてきました。<BR>
新しく始めたことなど<BR>
ちゃんと改行できたはず。
<P>最近計算機の使い方に慣れてきました。</P>
<P>大学生活にも慣れてきました。</P>
<P>新しく始めたことなど</P>
<BR> を用いた場合と少し行間などが違うが改行されたはず。
<UL> <LI>最近計算機の使い方に慣れてきました。</LI> <LI>大学生活にも慣れてきました。</LI> <LI>新しく始めたことなど</LI> </UL><UL> と </UL> タグはブロックレベルのタグで箇条書の開始と終りを示す。 <LI> と </LI> は箇条書の各項目の開始と終了を示すタグである。 ＬＩは list item（箇条書の項目）の意味。 <LI> タグは <UL> タグなどのブロック中に現われるが、 単独で現われることは無いので注意。
<H2>私について</H2>
私は大阪大学理学部物理学科の１年生です。
<H2>私の３大目標</H2>
<OL>
<LI>早起き</LI>
<LI>元気に挨拶</LI>
<LI>時間は有効に使う</LI>
</OL>
</BODY>
ＯＬは ordered list（番号付けした箇条書）の意味。
<OL> と
</OL>
タグは番号付けした箇条書のブロックを作る。
<H2>最近の話題</H2>
<UL>
<LI>最近計算機の使い方に慣れてきました。</LI>
<LI>大学生活にも慣れてきました。</LI>
<LI>新しく始めたことなど</LI>
</UL>
<HR>
<H2>私について</H2>
<HR> も終了タグの無いタグの一種である。
ＨＲは hirizontal rule（水平罫線）の意味。
仕切り線を入れることでハイパーテキストで伝える内容が変わるわけではないが、
ハイパーテキストの構成を見易くするのに役立つ。
<BODY>
<DIV ALIGN=CENTER>
<H2><FONT COLOR=GREEN>ようこそ！</FONT>
これは私のウェブページです。</H2>
</DIV>
<HR>
<H2>最近の話題</H2>
ここで出てきた <DIV> と
</DIV> とういうタグは、
単純にブロックを作るタグである。
ＤＩＶは division（区分）の意味か（？）。
それだけだと意味が無いが、
<DIV ALIGN=CENTER> のように、
タグの属性を指定している（一般にタグは各種の属性を指定できる）。
ALIGN=CENTER はブロック全体を中央揃えするという属性を指定している。
ALIGN は CENTER 以外にも LEFT や
RIGHT の値にすることが可能である。
以下の例を試してみると良い。
<DIV ALIGN=LEFT>
<H2><FONT COLOR=GREEN>ようこそ！</FONT>
これは私のウェッブページです。</H2>
</DIV>
<DIV ALIGN=RIGHT>
<H2><FONT COLOR=GREEN>ようこそ！</FONT>
これは私のウェッブページです。</H2>
</DIV>
<BODY BGCOLOR=YELLOW>
BGCOLOR は
web ページの背景色（background color）
を指定する。
Web ページの背景色は余り濃過ぎると文字が見づらくなるので注意すること。
以上で少しは web ページらしい形になったはず。
ＨＴＭＬファイルが作成できたら、そのファイルが他の人から見えるようにする。 その手順は以下の通り。
http://webserver/~sp20nnxx/index.html
上の sp20nnxx 部分は自分のログイン名（ユーザー名）を入れること。
またＨＴＭＬファイルを index.html 以外で作成した場合は、
その名前を入れる。
Netscape で直接ＵＲＬを入力するには、
例えば「ファイル」
プルダウンメニューで「ページを開く」
をクリックしＵＲＬを入力した後、
「Navigator で開く」ボタンをクリック。
上で作成した web ページは、上の手順にて、この計算機システムの中からは、 誰でも見ることが出来るようになった。 通常は同じ手続きで、インターネット上から誰でも web ページが見えるようになるのだが、あいにくこのシステムでは、 インターネット上にユーザーの作った web ページを公開することを許可していない（様々なトラブルを避けるため）。