[第1章：HTMLの基本を学ぶ 01] HTMLって何？Webページを作る第一歩を踏み出そう！
こんにちは！
今回は、HTMLという言葉を初めて聞いた方向けに、HTMLが何なのか、そしてどんな役割を持っているのかをやさしく解説します。
「難しそう…」と思うかもしれませんが、心配いりません！HTMLはWebページの基本となる仕組みですが、理解するのは意外と簡単です。
一緒に一歩ずつ学んでいきましょう！
1. HTMLとは？
まず、HTMLはHyperText Markup Language（ハイパーテキスト マークアップ ランゲージ）の略です。
これだけ聞くと「なにそれ？」って感じですよね。でも大丈夫！
簡単に説明すると、Webページの骨組みを作るためのルールだと思ってください。
例えるなら、HTMLは「家の設計図」のようなものです。
家には壁や屋根、窓などが必要ですよね？
Webページも同じで、文章や画像、リンクなどをどこに配置するかを決める設計図が必要です。
それをHTMLが担っています。
2. HTMLが必要な理由
では、なぜHTMLを使う必要があるのでしょうか？
それは、ブラウザ（ChromeやSafariやFirefoxなど）にWebページを正しく表示してもらうためです。
HTMLがなければ、ブラウザは「何をどう表示すればいいの？」と困ってしまいます。
例えば、あなたが見ているこのブログもHTMLで作られた設計図をもとに、ブラウザが表示してくれています。
3. HTMLを実際に見てみよう！
では、具体的にHTMLがどのようなものか見てみましょう。
以下は、とてもシンプルなHTMLの例です。
<!DOCTYPE html>
<html>
<head>
<title>はじめてのHTML</title>
</head>
<body>
<h1>こんにちは！</h1>
<p>これが初めてのHTMLページです。</p>
</body>
</html>サンプルコードがブラウザでどう表示されるかの画面キャプチャ
4. HTMLの基本構造をやさしく解説
先ほどの例を見て、「なんだかよくわからない…」と思ったかもしれません。
でも大丈夫！ひとつずつ分解して説明します。
- <!DOCTYPE html>
「これからHTML5で書きますよ！」と宣言するものです。
これを最初に書くのがルールです。 - <html>…</html>
HTMLの全体を囲むタグです。
すべての内容がこの中に入ります。 - <head>…</head>
ページの情報をまとめる場所です。
画面には直接表示されませんが、タイトルなど重要な情報がここに入ります。 - <body>…</body>
実際に画面に表示される部分です。
文章や画像など、見える内容をここに書きます。
「ふむふむ、なんとなくわかってきた！」と思えてきませんか？
5. 次回の準備：HTMLを書く環境を整えよう！
ここまでHTMLの基本を見てきましたが、「ちょっと試してみたい！」と思った方もいるのでは？
次回は、HTMLを書き始めるために必要な環境（エディタやブラウザの準備）を具体的に解説します。
初心者でも迷わず始められる簡単な方法をお伝えするので、ぜひお楽しみに！
7. まとめ
今回は、HTMLの基本的な仕組みと、初めてのHTMLコードを作る手順をご紹介しました。
難しそうに見えるかもしれませんが、一歩ずつ進めば必ずできるようになります！
次回は、「HTMLを始めるための環境を整えよう！」をテーマに、エディタやブラウザの準備方法を詳しく解説します。
ぜひ次の記事もチェックしてくださいね！