こんにちは、Mochiです。
HTMLの見出しってどんなふうに作るんだっけ？どんな注意点があるんだっけ？🤔
そのような方に向けて、HTMLの見出しタグ h1 - h6の基本的な使い方と注意点をわかりやすく解説します。
😇見出しタグの種類
見出しタグには<h1>, <h2>, <h3>, <h4>, <h5>, <h6>の6種類があります。このhは英語の見出しを意味する”heading”がもとになっています。頭(head)に出てくるものと認識すると覚えやすいかもしれません。
それぞれの違いは見出しの大きさです。以下のように、数字が大きくなるにつれて、見出しのサイズが小さくなっていきます。これによって、文に階層構造を作り上げることができます。
<h1>h1による見出し</h1>
<h2>h2による見出し</h2>
<h3>h3による見出し</h3>
<h4>h4による見出し</h4>
<h5>h5による見出し</h5>
<h6>h6による見出し</h6>
✍️見出しタグの使い方
見出しタグは内容（タグの間）に文字を入れて使います。
<h1>Mochi Blogへようこそ</h1>
非常にシンプルですね。間に挟まれた文字が見出しの大きさに変化します。
見出しは内容を分けたいときや、それぞれの内容にタイトルをつけたいときに使います。また、h1はページタイトルとして使われることが多いです。
🚨見出しタグの注意点
見出しタグを使う際の注意として、基本的にh1は1ページに1回だけ使うのが良いです。2回以上使っても何か大きな問題が起こるわけではありません。ただ、Webページではこのルールが使われていることが多いので、覚えておくと良いでしょう。
また、h1-h6の番号は順序に従って使うと良いです。つまり、大きさがちょうど良いからといって急にh4を登場させたりするのは、あまりよくありません。h1の下にはh2。h2の下にはh3という風に使いましょう。
🎉まとめ
今回は見出しタグ h1-h6の種類や使い方、注意点を学びました。見出しがあると文章が一気に見やすくなります。HTMLを使っていく上でとても基本的で重要な内容なので、自身で使いながら身につけ、スキルアップしていきましょう。
HTMLの構造ってどんな感じだっけ？という方はこちらの記事を読むのがおすすめです。https://www.mochi-blog.blog/blog/html-structure
参考になれば幸いです。
読んでいただきありがとうございました！
