「CSS Reloaded」 in アップルストア大阪

9月７日（日）アップルストア大阪で開催された、「CSS Reloaded」CSS3の実践的な使い方をご紹介！に行ってきました。
6月14日にアップルストア銀座で開催されたJohn Allsopp氏のセミナーを菊池崇氏が日本語版で解説するというもの。
ほぉー！へぇー！と驚きの連続で1時間があっという間。手帳にメモっていたけど、後から読んだらミミズが這ったような字でこれから実験しながら解読します。>_<

プリフィックスをプロパティーの先頭につける事によってcss3を実装することが可能。
-moz-　・・・Mozilla系　 -webkit-　・・・webkit系（safari・google chrome)
css3でユーザーエクスぺリエンスを高めることができ、リッチなウェブサイトを提供することができる。また、プリフィックスを使った実装で古いブラウザにも影響を与えないというメリットがある。

css3セレクタの実装状況・・・firefox3（非常によく実装している） opera9.5・safari3・google chrome（超良く実装している）
IE8ベータ2(まだまだもうちょっと）
IEがあまり対応してないんじゃ使えないなぁ。と思いながらもstyle masterを使ってのデモを見ているとやっぱり使ってみたい欲が・・・js使って実装していたことが、cssで簡単にできる！
例えば、transition　（safari・chromeで見てみてください。残念ながらfirefox3では、まだです。）
safariはここからダウンロードできます。
chromeはここから

cssのソースはこれだけです。↓

p{
display:block;
width:250px;
height:50px;
background-color:#fff;
color:#000;
border:1px solid #f0f0f0;
-webkit-transition:background-color 1.5s;
}

p:hover{
background-color:#09f;
}

html

<p>test</p>

でもIEではほとんど実装されてないんじゃねぇ・・・なんて少し思ってしまっていたが、John Allsopp氏のスライドが終わってからの、
菊池 崇氏の言葉がすごく印象に残った。

css3のセミナーをするとアンケートで、IEであまり実装されていないから実戦で使えないなどという答えがよく返ってくる、だけど
IEに基準をもっていく必要はない。シェアが例えIEが一番多くてもあわせる必要はない。なぜなら、これからはクロスブラウザは見栄えだけでない。そのウェブサイトへ行ってその人がどういうアクティビティをしてどういう行動をしてどういう風に感じるかである。ユーザーエクスペリエンスをもっとウェブのブラウザにあわせて高めること。firefoxには、firefoxなりのサイト、safariにはsafariなりと・・・ユーザーが心地よく滞在してもらえるのなら・・・IEにあわせて見栄えを同じにする必要はない。
日本はクロスブラウザという考え方が見栄えだけでいってしまっている。本当は、ユーザーエクスペリエンスと見栄えが一緒にあわさって本当のクロスブラウザである。これからクロスブラウザを作っていくときは見栄えだけでなくユーザーエクスペリエンスをもっと重視してクロスブラウザを実現して欲しいと思っています。

CSS3は未だに実装をしているブラウザが少ないけど、情報が失われなければ見栄えが全く一緒である必要ではないんですね。ユーザーエクスペリエンス・・・おもてなしって感じなのかな。

追記
このブログにもちょっと仕込んでみた。。。

2008/09/15追記

■出典元：CSS Reloaded
■著者；John Allsopp
■リンク：Web Directions East