HTML の第一歩 — レッスン 1 — h1〜h6、p、strong タグ
HTML ドキュメントの作成方法については HTML の第一歩を読んでください。
前のレッスンでは、最初の HTML ドキュメントを作成しました。
<html>
<head>
<title>私の最初の HTML ドキュメント</title>
</head>
<body>
HTML 私の第一歩
</body>
</html>このレッスンでは、ドキュメントにテキストを入力していきます。HTML で最も一般的なタグ、<p></p> タグを追加します。タグはラテン文字で書き、ロシア語の「эр」ではないことを忘れないでください。<p> タグは paragraph（段落）という単語の略で、テキストの段落、パラグラフを意味します。
HTML のすべてのテキストは何らかのタグで囲まれている必要があります。ですから、ドキュメントのテキストを <p> タグで包みましょう。
<html>
<head>
<title>私の最初の HTML ドキュメント</title>
</head>
<body>
<p>HTML 私の第一歩</p>
</body>
</html>見た目にはドキュメントは何も変わっていませんが、それでも html ドキュメントの構造はより正しくなりました。テキストの段落をさらにいくつか追加することもできます。
<html>
<head>
<title>私の最初の HTML ドキュメント</title>
</head>
<body>
<p>HTML 私の第一歩</p>
<p>すべての狩人が望む</p>
<p>どこにいるか知りたい</p>
<p>キジがどこに座っているか</p>
</body>
</html>ご覧のとおり、すべてかなり簡単です。p タグは同じレベルに配置されます。
ドキュメントに見出しを追加しましょう。HTML で見出しは何のために必要でしょう？まず第一に、テキストを構造化するためです。構造化されたテキストはより簡単に速く読んで理解できます。第二に、見出しは検索エンジンでのサイトのプロモーションにとって非常に重要です。ですから、テキストの見出しをおろそかにすべきではありません。
見出しには h1、h2、h3、h4、h5、h6 タグを使用します。h（header — 見出し）の後の数字は、この見出しの重要度を示します。しかも、h1 見出しはページに 1 つだけでなければならず、この HTML ページが何についてかを示します。h1 の後に h2 と h3、次に h4 などを使えます。通常、見出しの入れ子は 6 レベルで十分です。
<html>
<head>
<title>私の最初の HTML ドキュメント</title>
</head>
<body>
<h1>私の最初の HTML ドキュメント</h1><br> <h2>私の第一歩</h2>
<p>HTML 私の第一歩</p>
<h3>もう一歩</h3><br> <h2>こう言います</h2>
<p>すべての狩人が望む</p>
<p>どこにいるか知りたい</p>
<p>キジがどこに座っているか</p>
</body>
</html>おそらく気づいたと思いますが、h タグのサイズは文字の後の数字によって変わります。このようにブラウザは、この見出しが次の見出しより上位であることを示します。
h1〜h6 タグのもう 1 つの特徴は、太字で強調されることです。テキストを太字にするには <strong> タグも使えます。
<html>
<head>
<title>私の最初の HTML ドキュメント</title>
</head>
<body> <h1>私の最初の HTML ドキュメント</h1>
<h2>私の第一歩</h2>
<p>HTML 私の第一歩</p>
<h3>もう一歩</h3>
<h2>こう言います</h2>
<p>すべての <strong>狩人</strong> が望む</p>
<p>どこにいるか知りたい</p>
<p>キジがどこに座っているか</p>
</body>
</html>テキストを太字にするには、まさに strong タグを使うことに注意してください。p タグの中で h1〜h6 を使ってはいけません!これを覚えておいてください。p タグ内での h1〜h6 タグの使用は、Google 検索エンジンでのサイトの順位を著しく損なう可能性があります。
これが正しいことを覚えておきましょう。
<p>とても <strong>太い</strong> テキスト</p>そして、これはとても悪いです。
<p><h3>こうは</h3> しないで!</p>もうページに好きなだけテキストを追加し、それを太字にできると思います。そして何より、正しく行えます。