Semantic Web

ドキュメントに意味のあるWeb
Webの規模がますます大きくなるにつれて、情報量がますます多くなり、HTML 5では機械が人の代わりにWebページ上の情報を理解し、処理する.
過去の方法

<div id="header"></div>

Semantic Web

<header></header>

以前はid名をヘッダとして指定していたが、ヘッダの領域であることは知らなかった.<header>というタグを使用すると、機械はこの部分をヘッダ領域と理解することができる.

Semantic Tag

非意味タグ、例えば<div>および<span>としてタグ付けされる<section>、<article>などのタグは意味タグである.
意味タグはWebのアクセス性を向上させるだけでなく,検索エンジン最適化(SEO)にも影響を及ぼす.

img vs div background-image

<img src="" alt="">

imgタグは、まずaltプロパティに文字列を作成できます.これがmeta情報です.
検索エンジンはalt属性の文字列を識別します.(SEOに有利!)
画像のロードに失敗しても、切断された画像とaltテキストが置き換えられます.
divラベルのbackground-imageプロパティには、画像のみが追加され、情報は含まれません.
画像がユーザーのコンテンツ理解に役立ち、検索が必要な場合は、<img>タグを使用します.
純粋に設計されたコードの場合、div background-imageプロパティ