マークアップ言語

Markup Language

web development beginner

テキストに意味や構造を付与するための記号（タグ）を使って記述する言語のこと。

概要（サマリー）

マークアップ言語とは、テキストに意味や構造を付与するための記号（タグ）を使って記述する言語のことである。

「マークアップ」という言葉は、印刷・出版の現場で原稿に「見出し」「太字」「図の位置」などを書き込む作業（赤入れ）に由来する。コンピュータの世界では、テキストにタグと呼ばれる記号を付けることで、「これは見出しだ」「これはリンクだ」といった意味を機械に伝えることができる。

Webで最も身近なマークアップ言語はHTMLである。<h1>タイトル</h1> のように山括弧のタグでテキストを囲むことで、ブラウザにその文字の意味や役割を伝える。

マークアップ言語では、文章そのものに「これは見出し」「これは段落」「これはリンク」といった意味を付ける。たとえばHTMLでは、<h1> は大きな見出し、<p> は段落、<a> はリンクを表す。

<h1>サイトのタイトル</h1>
<p>これは本文です。</p>
<a href="https://example.com">リンク</a>

このように、タグは見た目を直接命令するだけでなく、テキストの役割をブラウザや検索エンジンに伝えるためにも使われる。

代表的なマークアップ言語には以下がある。

AIコーディングで最初に触れるのはHTMLがほとんどだ。MarkdownはGitHubのREADMEやこのような用語集のファイルでも使われており、開発作業で自然と出会う形式である。

Webページでは、HTML、CSS、JavaScriptが一緒に使われることが多い。HTMLは構造、CSSは見た目、JavaScriptは動きを担当する。

HTML       = 見出し、段落、リンク、ボタンなどの構造
CSS        = 色、余白、文字サイズ、レイアウトなどの見た目
JavaScript = クリック時の処理、入力チェック、画面の動き

マークアップ言語であるHTMLは、ページの骨組みを作る役割に近い。そこにCSSで見た目を加え、JavaScriptで操作や処理を加えると、実際に使えるWebページになる。

マークアップ言語はデータや文書の「構造・意味」を記述するための言語であり、計算や条件分岐といった処理を記述するプログラミング言語とは目的が異なる。

HTMLは「このページにはこんな要素がある」という構造を示すだけで、それ自体は動作しない。動きを加えるにはJavaScript、見た目を整えるにはCSSが必要になる。

Markdownもマークアップ言語の一種だが、HTMLよりも書きやすさを重視した記法である。たとえば # 見出し と書くと見出しになり、[リンク](https://example.com) と書くとリンクになる。

MarkdownはREADME、メモ、ドキュメントなどでよく使われる。一方で、Webページの細かい構造や属性まで指定したい場合はHTMLの方が向いている。用途によって使い分けることが大切である。

AIにWebページを作ってもらうとき、「HTMLを書いて」「Markdownで説明を書いて」のようにマークアップ言語を指定する場面が多い。HTMLを頼むとページ構造、Markdownを頼むと文書やREADMEの形で出力されることが多い。

AIへの指示では、「見た目を整えて」だけでなく、「HTMLで構造を作り、CSSで見た目を調整してください」のように役割を分けて伝えるとよい。マークアップ言語の役割を知っていると、AIが出したコードのどこを直せばよいか判断しやすくなる。

HTMLはマークアップ言語であり、プログラミング言語ではない。変数、条件分岐、繰り返しといった処理の概念がないため「プログラム」とは呼ばない。AIコーディングでよく「HTMLを書いて」と指示するが、それはあくまで「構造の記述」を依頼しているのである。

HTMLのタグには意味や構造を表す役割があるが、細かい見た目はCSSで調整する。<h1> は見出しという意味を持つが、色、余白、配置などを本格的に整えるにはCSSが必要である。

Markdownは簡単に文書を書くための記法で、HTMLはWebページの構造を細かく表すための言語である。MarkdownからHTMLへ変換されることも多いが、書き方や向いている用途は異なる。

HTMLだけではクリック時の処理や入力チェックのような動きは作れない。動きを付けるにはJavaScriptが必要になる。マークアップ言語は、あくまで構造や意味を記述する役割である。