WEBページの構造化と構造データについて

WEBページの構造化について

構造化することで、ページのコンテンツを正確に伝えることが出来る。各ブラウザでページの構造化が推奨されていることから、今後も注目してHTMLを記述していく。

構造化については、HTMLで記載するもの、構造化データとして記載するものがある。

HTMLによって構造化できるもの。適切なHTMLを記載すること。

HTML構造化
main	ページごとに 1 回だけ使用する、このページに固有のコンテンツ用
article	親要素main、ページ主にたる意味をもつ関連コンテンツのブロック
section	段落としてまとめることが出来るブロック。articleを親要素や、子要素に出来る。
aside	メインコンテンツに直接関連しない関連コンテンツや追加情報。 (用語集エントリ、著者略歴、関連リンクなど)
header	bodyの子要素としては、グローバルヘッダーを定義。 articleやsectionの子要素としてはそのセクションのための特定のヘッダーを定義。
nav	ページの主なナビゲーション機能。 ※二次リンクなどはナビゲーションに入りません。
footer	ページの終了コンテンツのグループ。
div	意味を持たせない要素
span	意味を持たせないテキスト要素
br	意味を持たない改行
hr	内容の変更を意味する改行

HTMLよりさらに詳細に内容を正確につたえるために、構造化データを利用する。

構造化データの種類
JSON-LD	Googleで推奨。JavaScript 表記	Google検索セントラル:構造化データの仕組みについて
microdata	マシンで読み取り可能な注釈をドキュメントに追加するメカニズムが導入されている	HTML Living Standardの定義
RDFa	HTML Living Standardに定義されていない..。

Googleのタグマネージャーのサービスで、動的にページのJSON-LDを生成出来る。