今回のこのサイトを作成するにあたって私自身もHTMLのおさらいというか勉強し直しの部分もあります。
色々調べながら現在のお作法に準基して記述していきたいと思っています。
実際には間違った記述もあるかもしれませんが後日間違いに気がついたら修正するかもしれません。
自分も今まであまりきにしていなかったが、html5になって大事な文法？お作法があります。
今回はそのへんを一緒に勉強します。
自分の備忘録としても記録します
昔はあまり言われたことなかったけど、<div>の多様は避けようというのが今どきらしいです。
各タグに意味をもたせることでGoogleさんに対してサイト内のコンテンツを正しく認識してもらう目的のようです。
W3C（HTML、CSSの共通ルールを作る団体）がこうしましょうと定義しているそうです。
これにより、複数メンバーでの共同作業や以後のメンテナンス性などが向上するそうです。
セクショニングコンテンツと言うそうです。
| ダグ | 意味 |
| <section> | 大きなセクションとして指定 h1はページに一つという認識でしたが、セクションごとにh1は一つの認識でいいようです。 |
| <article> | 主に記事ブロックに使用します |
| <aside> | ページ内容に直接関係内などサブ的な位置づけ |
| <nav> | 主なナビゲーション用、ページに一つと考えたほうがいいらしい |
| <header> | htmlの<head>タグとは違いページ内（表示されている中の）ヘッダー要素 |
| <figure> | 画像とその説明の括りに対して使用 |
| <footer> | ページ内フッター |
| <small> | 付随コメント（著作権表記や法的表記などページ下に(C) 表記などに使用） |
おそらくこの辺が自分が知らなかったタグになります。
もちろんここをご覧の初心者の方たちは私が一般的だとおもっているタグも一般的ではないと思うのでこれ以外もよく使うタグを以下に表記します。
よく使うタグ一覧
| <a> | href属性を用いて別のページ、ファイルなどへのハイパーリンクを作成 |
| <blockquote> | 引用文 |
| <body> | HTMLのコンテンツ要素今までのサンプルでも必ず出てきました |
| <br /> | 改行 |
| <button> | ボタン、マウスやキーボードで押すことができる |
| <dd> | 説明リスト要素。<dl>（リスト要素）内で<dt>（タイトル）の内容などを記述 |
| <div> | コンテンツ要素。上の表のセクショニング・コンテンツに当てはまらない要素に対して使用します。 |
| <dl> | 説明リスト。mdnには用語集作成に使うと書いてあるが、結構<li>の代わりに使ってたりする。それがいいのか悪いのかはわからない。 |
| <dt> | 上記<dl>の中にタイトル要素として使用する |
| <embed> | 動画コンテンツなどの埋込に使用 |
| <form> | 問い合わせや会員登録などの入力フォームの区間 |
| <h1> | セクションの見出しを6段階で表します。h1～h6だそうです。 以前に記事でなんぼでもかけるって書いてたけど、間違だったようです。 |
| <head> | HTML文書のヘッダー要素ページタイトルやスクリプトCSSの読み込み指定をする |
| <hr> | 水平線（区切り線） |
| <html> | HTML文書においてすべての要素はこのタグの中に配置しなければいけない |
| <iframe> | インラインフレーム。 ページ内にたのWEBページを埋め込む |
| <img> | 画像を埋め込みます |
| <input> | ユーザーからデータを受け取るための入力コントロール |
| <label> | チェックボックスなどのキャプション |
| <li> | リスト項目。グローバルメニューなどの作成に使うことがある。 それが正しいかどうかは不明 <ul>で囲うと順序なし <ol>で囲うと順序付き |
| <link> | スクリプトやスタイルシートなど外部ファイルの読み込みに使用 |
| <main> | WEBページ内のメインコンテンツを表す。 ページ内に1つだけ |
| <meta> | メタタグと言われるもの。 文字コードの指定だったり言語指定だったりその他色々 |
| <ol> | <li>でリスト表示するときに番号をつける |
| <option> | <select>の中で項目を定義するために使う |
| <p> | 文書の段落 |
| <script> | JavaScriptのコードを記入したり、埋込参照する |
| <search> | 検索窓を設置するときに使用 |
| <select> | プルダウンメニューを表示 |
| <span> | インライン要素<div>に似ているが<div>はブロック要素 インライン要素とブロック要素の違いは参考サイトでご確認ください。 mdn web docs |
| <strong> | 強調するテキスト一般的に太字で表示されるここでは紹介していないが<b>タグとは意味が違う。 |
| <style> | 文書内でスタイルシートを記述。 通常別ファイルに置くことが好ましいのであまり使わないけど直接HTML内に記述することも可能。 |
| <table> | 表を作成以下に続く<tbody><tr><td>などと一緒に使う |
| <tbody> | テーブルの本体部分 |
| <td> | テーブルのセル（列） |
| <tr> | テーブルのセル（行） |
| <th> | テーブルの見出し |
| <textarea> | お問い合わせフォームの自由記述フォーム |
| <title> | ブラウザのタブに表示されるページタイトル |
それでも省略しているものもあるので、参考サイトをご確認ください。
より詳しく使用例なども載っています。
mdn web docs