こんにちは。
株式会社Lifeit（ライフイット）です。
Webサイトを制作するのに欠かせない『HTML』。
「HTMLとは？」「HTMLって何なの？」と感じているのではないでしょうか？
初心者の方でも分かるように解説していきます。
前回の解説の続きとなります。
HTMLの書き方の基本
HTMLの基本を「HTML入門」として前回に解説をいたしました。
そちらを元に引き続き解説していきます。
まだご覧になっていない方は、是非「HTML入門」からお読みくださいませ。
HTMLの基本は「タグ」ではさむ
サンプルHTMLでは、「＜ 小なり」「＞ 大なり」で挟まれた『<h1>』などがたくさん使われてました。
このような記述を『タグ』と呼びます。
HTMLではこのタグで文字などをはさむというのが基本文法になります。
『<h1>見出し</h1>』のように、
<タグ名>とで色々なものをはさんでいきます。
それぞれ「開始タグ、終了タグ」と呼ばれ、基本的にセットで使われます。
※ 例外が少しだけありますが、それも後に解説します。
また、「開始タグ〜終了タグ」までのひとくくりを『要素』と呼びます。
タグには多数種類があり「どのタグではさまれるか」によってタグの中身の役割が変わってきます。
例として、『<h1> </h1>』で挟まれたものは「大見出し」。
『<p> </p>』で挟まれたものは「段落」となります。
こちらは前回に記述したHTMLでも使用しております。
このようにHTMLはタグを使って文字や画像に役割を割りあてながら書いていきます。
１つ１つの役割を作りサイトに訪れたユーザーへは見やすく、
Googleなどの検索エンジンにとっても内容を認識しやすいウェブページになります。
しっかりと意味合いにあったタグで記述することは「SEO対策 *」としても有用になります。
（* 別途でまたご紹介しますが、大まかにGoogleでの検索の順位対策となります。）
タグの中にタグを書く
コードをよく見ると、タグの間にさらに別のタグが入っている部分が多くあります。
例えば
しかしながらタグの種類によっては「このタグは中に書いてOK、このタグはNG」というルールがあるので注意しなければなりません。
開始タグの中に「情報（属性）」の記述も
タグによっては、開始タグの中に情報を入れる場合もあります。
このタグの中に入れる情報は「属性」と呼ばれます。
例えば「<a>タグ」こちらは「リンクを作るためのタグ」です。
リンク先のURLは開始タグの中に『href=”リンク先のURL”』というように記述します。
なお、「属性」はタグ名のあとに半角スペースを空けてからを書きます。
以下に例としての「<a>タグ」の記述方法を記載します。
ex.
<a href="https://www.lifeit.co.jp/">LifeitのオフィシャルHP</a>
最後に
引き続き『HTML』についての解説をしました。
これでどのようにHTMLが記述されているのかが理解出来たかと思います。
ここからさらにほかのタグの種類や装飾などについても解説していきます。
弊社では制作の請負サービスも承っております。
より詳しく丁寧にご説明もいたしますので、
オリジナルのページを作成をされたいなど場合はご連絡下さいませ。
