それではいよいよHTMLを使ってテキスト文書に目印をつける（マークアップする）方法について解説していきます。まず、テキストを用意しましょう。ここでは日記風の文章を用意してみました。
私のパソコン日記
平成１５年４月１３日
ウェブサイト作成に挑戦！
今日、自分でウェブサイトを作ってみる決心をしました。今はまだ何が何だかわからないけど、ちょっとがんばってみようかな？って思っています。今日がその第一日目です。この日記が自分にとって初めてのウェブサイトです。
いろんな本を読んだり、いろんなサイトを見たりして勉強中なんですが、なかなか思うようにはいきません。一度にマスターできるわけはないので、コツコツ毎日勉強していきたいと思います。
今日嬉しかったこと
以前からずーっと好きだった人に、実は告白しました(^O^)。「付き合ってください」って。そしたらなんと、速攻でＯＫもらえたんです～♪ え～、信じられな～い。マジっすか？ ホントに付き合ってもらえるんですか？
彼はニコッと笑って静かに頷いてくれました。ヤタ～、＼(^o^)/。今まで生きてきた中で一番幸せです。
明日から二人でパソコンのお勉強だ～。がんばろ。イエッ～。(^O^)
・・・(;^_^A。まあ文章の内容はともかくとして、この「私のパソコン日記」というテキスト文書をHTML文書に変身させてみましょう。
この文章をよく見てみると、文書の構造として「大見出し」「中見出し」「小見出し」そして各段落に分類することができます。
まず大見出しですが、もちろん「私のパソコン日記」の部分ですね。それから中見出しは日付である「平成１５年４月１３日」の部分です。（続いて明日も日記を書く場合、明日の日付も中見出しになると考えることができます。） そして、「ウェブサイト作成に挑戦！」と「今日嬉しかったこと」が小見出し、それ以外は各段落ということになります。
さあそれではいよいよ目印をつけていきましょう。まず大見出し「私のパソコン日記」の部分です。大見出し（ページ内で最重要である見出し）の目印は、<h1>と</h1>で該当部分を挟むことでつけることができます。見出しは英語で「Heading」と言います。その頭文字のhを取っている訳ですね。以下のように目印をつけます。
<h1>私のパソコン日記</h1>
<h1>、</h1>はすべて、半角英数で記入します。
見出しのマークアップには６種類あり、それぞれ<h1></h1>～<h6></h6>の組み合わせで目印をつけます。数字が小さいものほど、より重要な（レベルが高い）見出し、という意味になります。
次の「平成１５年４月１３日」の部分は中見出しですから、以下のようにマークアップします。
<h2>平成１５年４月１３日</h2>
「ウェブサイト作成に挑戦！」の部分は小見出しです。よって、
<h3>ウェブサイト作成に挑戦！</h3>
と目印をつけます。
次に続く文章は、段落ですね。段落の目印は<p>と</p>で該当部分を挟むことでつけることができます。段落は英語で「Paragraph」と言いますね。
<p>今日、自分でウェブサイトを作ってみる決心をしました。今はまだ何が何だかわからないけど、ちょっとがんばってみようかな？って思っています。今日がその第一日目です。この日記が自分にとって初めてのウェブサイトです。</p>
という感じで以降も同じ要領でマークアップしていきます。
そして一番最後に（これが一番重要なんですが）この文書のタイトルをコンピュータが理解できるようにつけ加えてあげます。文書の一番最初にタイトルを書き、それを<title>と</title>で挟んで目印をつけます。今回の文書のタイトルは「私のパソコン日記」としましょう。
<title>私のパソコン日記</title>
ここまでマークアップできれば一応完成です。完成形を示します。
<title>私のパソコン日記</title>
<h1>私のパソコン日記</h1>
<h2>平成１５年４月１３日</h2>
<h3>ウェブサイト作成に挑戦！</h3>
<p>今日、自分でウェブサイトを作ってみる決心をしました。今はまだ何が何だかわからないけど、ちょっとがんばってみようかな？って思っています。今日がその第一日目です。この日記が自分にとって初めてのウェブサイトです。</p>
<p>いろんな本を読んだり、いろんなサイトを見たりして勉強中なんですが、なかなか思うようにはいきません。一度にマスターできるわけはないので、コツコツ毎日勉強していきたいと思います。</p>
<h3>今日嬉しかったこと</h3>
<p>以前からずーっと好きだった人に、実は告白しました(^O^)。「付き合ってください」って。そしたらなんと、速攻でＯＫもらえたんです～♪ え～、信じられな～い。マジっすか？ ホントに付き合ってもらえるんですか？</p>
<p>彼はニコッと笑って静かに頷いてくれました。ヤタ～、＼(^o^)/。今まで生きてきた中で一番幸せです。</p>
<p>明日から二人でパソコンのお勉強だ～。がんばろ。イエッ～。(^O^)</p>
上の四角の中をすべてコピーしてメモ帳を起動して貼りつけて、デスクトップにnikki.htmlというファイル名で保存してみましょう（HTML文書は「.html」や「.htm」という拡張子が使われるケースが多いです）。そしてそのnikki.htmlをダブルクリックしたらブラウザが起動して表示されますので、確認してみてください。これで普通のテキスト文書をHTML文書に変身させることができました。
繰り返しになりますが、通常のテキスト文書にHTMLを使って目印をつけることにより、文書の構造をコンピュータが理解できるようにしてあげることが、HTML文書を作るということなのです。今回作成したHTML文書をInternet Explorerで見た場合、大見出し・中見出し・小見出しの順に、より大きな文字で表示されます。また各見出し・段落の前後で改行されます。そして各段落は一番右端で折り返しされます。これはHTMLで文書の構造（だけ）を示した結果、（見映えについてのマークアップは一切していないにもかかわらず）Internet Explorerが自ら判断してこう表示しているわけです。普通のテキスト文書に目印をつけたことにより、ブラウザが自ら判断できるようになった訳です。
以上はHTMLの基本中の基本です。ただこの基本をよく分からないうちにHTMLリファレンスなどの本を買ってきて、適当に目印をつけ、ブラウザ（特にInternet Explorer）で表示確認してだいたい思うように表示されているからＯＫ、という様にHTMLを学んでいる人がけっこう多い様です（かくいう私もそうでした）。
このコンテンツは、「簡単で、より適切」であることを目指しています。この「より適切な」という言葉は、「ルールに則った」と言い換えることができます。そうなんです。HTMLによるマークアップにはルールがあるのです。そのルールはW3C（The World Wide Web Consortium）という団体によって仕様書として公開されています。絶対にこの仕様書に従わなければならないという義務はもちろんありません。しかしながらHTMLを考案した人物がこのW3Cのディレクターになっていることを考えると、この仕様書に沿ってHTML文書を作成するのが最も合理的であり、「より適切」であると言えるでしょう。
以降、HTMLについてもう少し掘り下げていくことにしましょう。