認知心理学の第一人者であるD.A.ノーマン博士によって唱えられたものと言われている。
文字通り訳せば「ユーザーが体験すること」になるが、
そういった体験がユーザーにとって有意義だったか
（うまくいった、面白かった、心地よかった、熱中した、など）も評価すべき価値としている概念である。
よいWebサイト考察
仕様がすべて実装され、すぐに使える状態。
●実装が終るのは
（例）2022年 →使えちゃう！
たとえば、CSS2.1はまだ「勧告候補」である。
勧告されていないが、広く使われている。
実装されている機能から使っていけばよい。
実装の本格的なスタートは、「勧告候補」になったとき。
おそらく、2012年あたり？
●実装状況を知るには
１．開発者向けサイト
Mozilla Developer center：
https://developer.mozilla.org/ja
Safari dev center：
http://developer.apple.com/safari/
２．仕様書のステータス表示
●どう使っていくか
「実装されている機能から使っていけばよい。」とは言ったものの…
対応しないブラウザはどう対処すればよいのか？
１．JavaScriptで対処
ExplorerCanvas：
http://excanvas.sourceforge.net/
IEに<canvas>を。
Modernizr：
対応状況をチェックする。
classもつけてくれたりする。
２．対応度合いにあわせて利用
最低限なものは、すべての環境で。
できる子には、高機能なものを。
まさにプログレッシブ・エンハンスメント 。
Placeholder属性
なくても不都合はない。
難しいことはたしか。
HTML5やCSS3は勧告までとても時間がかかる。
今までと違う対応をすべきである。
●今は何をすればよい？
実装も出てきたけど、仕様はまだまだ策定中。
●<article>と<section>を区別する必要はあるの？
●<section>の誤用が多い。いっそ削除しては？
仕様がドラスティックに変更される可能性も…使う際にはリスクの認識を。
※使い方を間違えると
アウトラインが崩れるので注意
とくに<section>は気をつける。
×××NG例①×××
<article class="entry">
<header>
<h2> タイトル</h2>
</header>
<section class="body">
<p>本文</p>
<p>テキストテキスト</p>
</section> <footer>...</footer> </article>
×××NG例②×××
<header id=logo>
<section>
<h1><img src=logo...> </h1>
</section>
</header>
×××NG例③×××
<section id=wrapper>
<section id=main>
<article>
<section>
<header>...</header>
...
</section>
</article>
</section>
...
</section>
セクションは意味的なもの。アウトラインを意識するべき。
レイアウト目的なら<div>で行う。
<h1>HTML5のセクション</h1>
<h2>section要素</h2>
<h2>nav要素</h2>
<h3>「navi」ではなく「nav」</h3>
<h2>article要素</h2>
...
●HTML5のセクション
●section要素
●nav要素
●「navi」ではなく「nav」
●article要素
<article>
<h1>HTML5のセクション</h1>
<nav>...</nav>
<section>
<h2>nav要素</h2>
<aside>
<h3>「navi」ではなく「nav」</h3>
</aside>
</section>
●HTML5のセクション
●（見出しなしの目次）
●section要素
●nav要素
●「navi」ではなく「nav」
●article要素
●aside要素
