マークアップ言語とは？（HTMLを例に）

 はい、承知いたしました。HTMLが「マークアップ言語」であり、「プログラミング言語ではない」という点を、初心者の方にも分かりやすく解説しますね。「何をマークアップするのか」という視点から説明することで、理解を深めていきましょう。

---

マークアップ言語とは？（HTMLを例に）

HTMLは「HyperText Markup Language（ハイパーテキスト・マークアップ・ランゲージ）」の略です。この名前の通り、HTMLは**「マークアップ言語」**に分類されます。

では、「マークアップ言語」とは一体何でしょうか？

簡単に言うと、マークアップ言語とは、文章の構造や意味、表示形式などを指定するために使われる言語のことです。

もっと具体的に言うと、私たちが普段書いている文章（例えば、この説明文）に、コンピュータが理解できるように**「目印（マーク）」**を付けていく作業をするためのものです。この「目印」のことを「タグ」と呼びます。

イメージしてみてください：

あなたは、友達に「今日の予定」を伝えるメモを渡すとします。

そのメモには、

• タイトル：「今日の予定」

• 大事なこと：「ランチは12時ね！」（太字にしたい）

• 箇条書き：「買い物に行く」「宿題をする」「ゲームをする」

• 最後に「よろしくね！」

と書かれています。

これを、コンピュータに「これはタイトルだよ」「これは箇条書きだよ」「これは太字だよ」と教えるのが、マークアップ言語の役割です。

何を「マークアップ」するの？（＝何に「目印」を付けるの？）

まさに、ご質問にあった「タイトル」「段落」「太字文字」などが、HTMLでマークアップする（目印を付ける）代表的なものです。

HTMLでは、これらの要素に以下のような「タグ」という目印を付けます。

1. タイトル（見出し）

   • 例：<h1>今日の予定</h1>

   • これは、<h1>というタグで「今日の予定」というテキストを囲むことで、コンピュータに「これは一番大きな見出し（タイトル）だよ」と教えています。他にも<h2>, <h3>などで、中見出し、小見出しを指定できます。

2. 段落

   • 例：<p>これは一つの段落です。</p>

   • <p>タグで囲むことで、「このテキストの塊は一つの段落として扱ってね」と指示します。

3. 太字文字

   • 例：<strong>ランチは12時ね！</strong>

   • <strong>タグで囲むことで、「このテキストは特に重要な部分だから、太字で表示してね」と伝えています。（<b>タグもありますが、<strong>は「重要性」を示す意味合いがあります）

4. 箇条書き

   • 例：

     HTML

     <ul>
         <li>買い物に行く</li>
         <li>宿題をする</li>
         <li>ゲームをする</li>
     </ul>
     

   • <ul>は「順序なしリスト（箇条書き全体）」、<li>は「リストの項目」であることを示しています。このように、複数のタグを組み合わせて構造を表現します。

5. 画像

   • 例：<img src="image.jpg" alt="風景写真">

   • これは「ここにimage.jpgという画像を表示してね。もし画像が表示できない場合は『風景写真』と表示してね」と指示しています。

6. リンク

   • 例：<a href="https://www.google.com">Googleのサイトへ</a>

   • 「『Googleのサイトへ』というテキストをクリックしたら、https://www.google.comに移動してね」と指示しています。

これらの「目印（タグ）」は、ブラウザがWebページを表示する際に、どの部分がタイトルで、どの部分が段落で、どこに画像があり、どこがリンクになっているのかを理解するために使われます。ブラウザは、この目印に従って、Webページを私たちの目に見える形に整形して表示してくれるのです。

なぜ「プログラミング言語ではない」のか？

プログラミング言語は、コンピュータに「手順（アルゴリズム）」や「処理（ロジック）」を命令し、特定のタスクを実行させるための言語です。例えば、「もしユーザーがこのボタンを押したら、この計算をして、結果を表示しなさい」といった**「条件分岐」や「繰り返し処理」**のような、動的な振る舞いを記述することができます。

一方、HTMLはあくまで**「情報の構造や意味を記述する」**ための言語です。Webページに「何かを動かす」「計算する」といった機能を追加することはできません。HTMLは静的なコンテンツ（テキスト、画像、リンクなど）をどのように配置し、表示するかを指示するだけです。

「Webページを見る」という行為において、

• HTML：Webページの骨組みやコンテンツの内容を定義する（例：「これは見出し」「これは画像」）

• CSS（スタイルシート）：Webページの見た目を装飾する（例：「文字の色は赤」「背景は青」）

• JavaScript（プログラミング言語）：Webページに動きやインタラクティブな機能を追加する（例：「ボタンを押したらメッセージを表示」「スライドショーを自動で動かす」）

という役割分担がされています。

このように、HTMLはWebページの「骨格」や「内容」を定義するための「目印付けの言語」であり、コンピュータに「こう表示してね」と指示する役割を持っているのです。

これで、マークアップ言語とは何か、そしてHTMLが何をマークアップするのか、ご理解いただけたでしょうか？