HTML ( HyperText Markup Language ) は、Webマシンが配給するコンテンツを Google にとって分かりやすくするためのマークアップタグ。

CSS や JavaScript と併用すればコンテンツの見栄えは芸術の域にまで昇華する。

主な目的

Web文書にタグ付けして文書全体を意味的にキレイに整理する。

  1. Google など検索エンジンに文書構造を正しく伝える
  2. HTMLタグに CSSを適用して文書全体をデザインする

文書構造や意味付けがしっかりした(セマンティックな)Web文書を作成すると、そのWeb文書は構造的には W3C標準に準拠した素晴らしいものとなる。

多種多様なコードによって的確な意味付けをすると、そのWeb文書は Googlebot から見て意味の豊富なものとなり、サイバー世界をキレイに整理したがっている Google からも好かれることになる。

加えて、CSS を利用して人間学的にも良いデザインをすると、その Web文書は多くの人たちにとっても素晴らしい印象や説得力を与えるものとなる。

メインルート

html HTML文書においてルート(起点)となるトップレベル要素。ルート要素とも呼ばれる。他のすべての要素はこの要素の子孫として配置される

文書メタデータ

meta 他のメタ要素で表すことができないメタデータを定義。charset、http-equiv、name ( description、author、googlebot、robots を含む ) など
title ページの題名を定義。ブラウザのタイトルバーやページのタブに表示される
base ページ内に含まれるすべての相対URL の基点となる URL を定義。アンカータグなどが参照する
link 現在のページと外部リソースとの関係を定義。ナビゲーションの関係構造の定義など。スタイルシートをリンクするためによく利用される
style ページ全体あるいは一部分のスタイル情報を定義

セクショニングルート

body HTML文書のコンテンツを表す。ページ内に一つだけ配置する

コンテンツセクショニング

論理的に大まかなアウトラインを作成するためのタグ。

header 導入的なコンテンツ、特にロゴやナビゲーションなどのグループを表す。タイトルや

見出し以外に、検索フォーム、作者名なども含めることができる

nav サイトの主要なナビゲーション機能を提供しているセクションを表す。一般的な例としてはグローバルメニュー、目次、索引など。ページ内で複数利用が可能。ただし <footer> などによく含められるリンク等に使う必要はない
main そのページの主要な内容を表す。主要な内容とはページの中心的な話題、またはアプリケーションの中心的な機能に関係すること。ゆえに、他ページで繰り返されているものは除くべき。1つのページに1つ
article ページ内で自己完結しており、フィードなどで個別に配信や再利用できる構成物を表す。例えば、新聞や雑誌の記事、ブログ記事、フォーラムの投稿など。ゆえに、このセクションは見出し情報などを含んでいるべき
<h1>~<h6> セクションの見出しを6段階で表す。

が最上位で

が最下位。見出しレベルをスキップしてはいけない
aside そのページのメインコンテンツと間接的な関係しかない部分を表す
footer ページの終端を表す。通常はサイト全体あるいは特定のセクションの著者情報、連絡先、関連サイトへのリンク、コピーライト表示などを含める
address そのページやセクションを提供しいている個人、団体、組織の連絡先(SNSアカウントも可)の提供を表す。タグ内に必ず連絡先の名称を含める。一般的には <footer> 内に配置される。一行利用ではなく

と同じように文章でも利用できる

section 一つのまとまりを表す。意味的に他に妥当なタグがない場合に利用。例えば、検索結果の一覧、地図の表示など。ゆえに、通常は見出しが含まれる。そのセクション単独で配信して意味がある場合は <article> を利用すべき。スタイル付の目的のみで区切る場合は
を利用すべき