PONTABLOG

PONTABLOG-世界をシェアしよう-

世界を旅するブロガーが、ブログ運営に役立つ情報をお届けします!

MENU

hタグは見出し専用のタグです!hタグの使い方をわかりやすく解説します

f:id:goemon_7:20200625143645j:plain

 

 

タイトルと並んで重要なのが「見出し」です。

 

 

 

見出しには記事上の内容をブロックごとに分ける役割があります。
地図上の目印みたいなものです。

 

 

 

 

 

 

hタグがあるおかげで、僕たちはスマホやパソコンの画面でブログの記事を見ると、すぐに見出しの場所がわかります。

 

 

 

と言うことで今回は、見出しには欠かせない、hタグについて解説していきます。

 

 

 

この記事はこんな人におすすめ!

☑自分で見出しを作ってみたい
☑hタグの役割について知りたい
入れ子について知りたい
☑HTMLをさわりたい

 

 

 

 

 

 

hタグとは?

 

 

 

hタグとは、サイトのHTML上に設置された見出し専用のタグのことです。

 

 

 

プログラミングの世界では、このhタグが見出しの役割を担っています。

 

 

 

正確には、このタグが、現実世界におけるブログ記事の見出しに"見出しとしての役割"を与えています。

 

 

 

つまり、僕たちが記事を見て、見出しを見出しだとすぐに認識できるのは、このhタグがあるおかげです。

 

 

 

なので、ブログ記事内で見出しを書く際には、必ずこのhタグに記入することになります。

 

 

 

hタグの特徴

 

 

●<h1>から<h6>までの6種類を入れ子状にして使うことができる

●hタグの情報は目次に反映される

Googleの巡回プログラム『クローラー』は、hタグの情報を読み取ってインデックスする

 

 

 

hタグの “h” は「heading(見出し)」の頭文字。

 

 

 

hタグの配置

 

 

 

タグの数字が大きくなるに連れてフォントは小さくなります。

 

 

 

と言うか、いくつかの見出しが設定できるようになってます。

 

 

 

数字の大きさが異なるhタグ同士を使って見出しを分けることで、文章を入子状に構成することができるようになります。

 

 

 

【例】

 

<h2>タグ=大見出し

<h3>タグ=中見出し

 

 

 

を使って文章を項目ごとに分けていく。

 

 


<h2> 大見出し </h2>


 − <h3> 中見出し </h3>
 − <h3> 中見出し <h/3>
 − <h3> 中見出し <h/3>

 

 

 

hタグは、HTML上で使う「見出し専用のタグ」。見出しにしたい箇所以外の文字や文章を装飾する場合にはCSSをいじろう。

 

見出しではない場合、その箇所にhタグは使わないようにした方が良いわね☆

 

 

 

【コラム】h1タグとタイトルタグは違う

 

 

 

勘違いが多いですが、h1タグとタイトルタグは別物です。

 

 

 

両者はそれぞれ役割や表示箇所が違っており、別の文章を書くことができます。

 

 

 

基本的には両方ともあまりいじる機会が無いので区別して使う必要はないけど、よほど気になる人は違う文章を書いてみてもいいかもしれません。

 

 

 

まとめ

 

 

 

いかがでしたか?

 

 

 

HTML上でhタグを配置することで、記事には見出しが表示されるようになります。

 

 

 

hタグは自分でもHTML画面から作成したり書き換えたりできますので、ぜひやってみてください。

 

 

 

今日はここまで!