見出しをつける
上部
ここからは、実際にホームページを見る人に表示される部分について説明していくよ。
学
ということは、<body> と </body>の間に書いていくんですね。
上部
そうそう。よく覚えてるねー。
まず、「見出し」について説明するよ。見出しは次に続く文章の内容を簡単に説明したものだよ。
見出しをつけることで、文章が読みやすくなるよね。
学
そうですね。確かに「見出し」がなくてだらだら書いてある文章は読みにくいですね。
上部
うん。さらに、大見出し、中見出し、小見出しといったように、見出しにもレベル（階層）があるよね。適切なレベルの見出しを付ける事で、文章全体の構造が分かりやすくなるよね。
それに、検索エンジンは「見出し」に含まれているキーワードをそのホームページの中で重要なキーワードと考えるんだ。だから、適切なレベルで適切な見出しをつける事がとても大切だよ。
学
人に分かりやすい文章は検索エンジンにも分かりやすいって事ですね！
上部
いいこというね〜！全くその通りだよ。
では、HTMLでは見出しをどうやって書くかだけど、HTMLでは6つまで見出しのレベルを指定できるんだよ。
１番目に大きな見出しは <h1> と </h1> で囲む。
２番目に大きな見出しは <h2> と </h2> で囲む。
３番目に大きな見出しは <h3> と </h3> で囲む。
以下、４番目、５番目、６番目も同様な書き方になるよ。
さっき学君が作ってくれたこの自己紹介の見出しをHTMLにして追加するとどうなるかな？
学の自己紹介
名前
名前は学（まなぶ）ですが勉強は苦手です。
性格
元気がとりえです。
ちょっとおっちょこちょいで小さな失敗をすることがあります。
趣味
趣味はサッカーと映画です。
サッカー
週末には草サッカーをやっています。
映画
好きな映画のジャンル
・アクション映画
・ホラー映画
学
んーと、「学の自己紹介」が大見出しで、「名前」とか「年齢」とか「趣味」が中見出しで、趣味の「サッカー」と「映画」が小見出しになるから・・・。あ、それにタイトルは「学の自己紹介」ですね。こんな感じでしょうか？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>学の自己紹介</title>
</head>
<body>
<h1>学の自己紹介</h1>
<h2>名前</h2>
<h2>性格</h2>
<h2>趣味</h2>
<h3>サッカー</h3>
<h3>映画</h3>
</body>
</html>
上部
うん。バッチリだね！
ちなみに「見出し」の前後に自動的に改行が入るので覚えておこうね。
では、ここまでを表示してみようか。
学
おお〜。見出しが表示されましたよー！でも、字がすごく大きいんですね・・・。
上部
字の大きさは後々説明するスタイルシートで変えれるから今は気にしなくてもいいよ。
