先日行われたWeb Directions Eastで耳にした「プログレッシブエンハンスメント（progressive enhancement）」と呼ばれる概念ですが、A List Apartの記事「Progressive Enhancement with CSS」において、分かりやすい例が紹介されていました。

ページ中程でフォームのラベルと入力エリアの間に入れられることがよくある「コロン（：）」を題材に取り上げ、ラベルとしては不必要なコロンを取り除いたマークアップと、after疑似要素でCSSに記述して画面上に表示させる方法が示されています。

そして、上記のような方法を取ることによって、

• 簡単なCSSの編集でコロン（：）のような装飾を取り除くことができること
• コロンが表示されない場合でも、フォームが無益なものにならないこと

から、プログレッシブエンハンスメントの好例と位置づけられています。

英語が苦手なので正しく理解できているかかなり不安ですが、原文を読むことでなんとなくでも概念がつかめるのではないでしょうか。

ちなみに、入力フォームがdl要素やtable要素ではなく、ol要素を使ってマークアップされていることも興味深いと感じました。