5月12日に行われたCSS Nite LP, Disk 3に行ってきました。LIVEコーディングを中心に、twitterを表示する試みなど、非常に充実した内容で楽しめました。
詳細は資料が公開されると思いますのでそちらを参照してください。以下自分用メモ。
ザ・コーディングの美学（益子貴寛氏）
- コーディングの真・善・美。
- 細かいコーディングガイドラインの策定。
- コーディング一通り終わって8割。残り2割でさらなるブラッシュアップをはかる。
複数のプロパティに同じ指定をするときにカンマで改行するというのはやるけど、ショートハンドプロパティの値をそれぞれ改行・インデントして見やすくする、というのは初めて見た。正直そこまでする必要はあるかなぁという気はするけど、考え方としては参考になる。
フィロソフィー・オブ・コーディング（小久保浩大郎氏）
- いわゆる「デザイン」の広義について。
- ウェブは特別なメディア。
- 売れないゲームソフト→売れないハード→さらに売れないゲーム・・・という悪循環の比喩。
- 正しいコードを書くことで自らの環境をより良くする。
前の会社の連中に聞かせてやりたい内容。というか在職中にこういう内容を自分の口から説明・提案できなかったのが悔しい。
小久保さんはちょっと緊張気味だったのか、あるいは会場とマイクの具合か、ちょっと聞き取りづらかったように感じました。LP2のときのお話ぶりがステキだったので、少し残念。
Dreamweaverのコーディング機能再点検（鷹野雅弘氏）
- コードヒントのカスタマイズ。
- タグインスペクタの活用。
- ソースフォーマットの適用（Dreamweaver CS3からCSSへの適用が可能に）
以前のCSS Niteの内容の再演＋αということでしたが、毎回何か発見があります。DW CS3のCSSコードフォーマットは良さそう。
LIVE コーディング（A）（神森勉氏）
- 普段は下階層ページから作り、そのスタイルをトップぺージに適用する（今回はトップから作った）。
- テキストデータをDWのデザインビューにペーストし、マークアップ。
- CSSを切ったときにどう見えるのかを常に意識する。
メインイベントLIVEコーディングの１つめ。
神森さんはほとんど直接タグを打つことなく作業を進めていく。なるほどここまで出来るんだ、とちょっと驚きました。
実際にどういうところで悩んでどう解決したかを聞けるのはものすごい参考になります。見出しレベルの付け方など、悩んでいるポイントがほとんど同じだったのもちょっと嬉しかったり。
途中他の出演者の方からの突っ込みややりとりもかなり面白い。その中で出てきたブラウザチェックの順番、益子さん的には Fx→Safari→Opera→IE7→IE6→（v5,v4系） だそうです。
Microformats で上質コーディング（長谷川恭久氏）
- プログラマー向けの最も簡単なAPIがRSSだとすると、Microformatsはデザイナー用のAPI。
- 考えられるリスクとしては、タグスパムのようなものがある。
何度かMicroformatsについてのセミナーを見ていますが、未だ実際に使うに至っていません。凄そう、面白そうという段階で止まっている。やはり実際に使ってみないとなかなか実感できない。
今回uPressというWordPress用プラグインが紹介されていたので試してみようと思います。（以前Structured Bloggingを試したけど、他のプラグインとの相性が悪くうまく使えなかった。）
プロはこう使う! Another HTML-lint 徹底活用術（太田良典氏）
- W3C ValidatorはValidであるか否かのチェック。HTML-lintは様々な仕様やガイドラインを配慮した包括的なチェッカー。
- Web上にあるのは「Gateway」であって、ローカル環境でコマンドラインで使える。複数ファイルの一括処理も可。
- Gatewayを使うとネット上にデータが流れることになる（秘密保持契約などがある場合は使うべきではない）。
- HTML-lintは有料。
話術の面白さはこの日一番。
W3C Validatorに比べてHTML-lintは厳しいとか細かいというくらいの認識しかなく、具体的に比較したことはなかったので参考になった。というか、とにかくお話が面白い！ばけらさんのお話は実際に現場で聞くべし。
LIVE コーディング（B）（河内正紀氏）
- 神森さんとは対照的に、ほぼ全てコードビューで作業
- まずフォルダ構成を作成。続いてcssファイルの作成とインポートの記述など。
- clear.css（clearfix専用CSSファイル）を作り、そこにセレクタを追加していく。
- まず大枠のdivブロックを作る（神森さんはあとからdivを追加していた）。
- 画像とテキストを同じa要素の中に入れ、どちらをマウスオーバーしても同時に反応するようにする（別々だと別のリンクに思われる）。
- font-size: 12px。スターハックでIE用にfont-size: 75%。
メインイベント２つめ。河内さんはなぜかbAのお二人に両脇を固められるという恐ろしい状況に。
コードビューでコードヒント機能を駆使してサクサクと組み上げていく。神森さんとは全くやり方が違って面白い。
小久保さんがこだわっていた、インタラクションのエリア（マウスがどこに反応するか）というのはなるほどと思った。あまり気にしたことはなかったなぁ。
コーディングコンテスト表彰・講評
時間も押して簡単な講評のみでしたが、最優秀賞はにんさんが選ばれました。ほぼ満場一致だったとのことでスゴイ。早く作品を見てみたいです。
コンテストの結果とLP3を終えて｜CSS HappyLife
まとめ
やはりLIVEコーディングは素晴らしく参考になりました。こういう場でないと見る機会がない。逆に勉強会などでこういう機会を設けてみるのもいいかもしれません。
あと、ヤスヒサさん作のcssnite + twitterが面白かった！自分もケータイから必死に投稿してました。喋る側としてはどんな突っ込みが入るかわからない怖さがあるかもしれませんが。
懇親会ではHTML-Lint作者のk16さんとお話できたり、来週からの職場の人とフライングで接触できたりしましたが、なにぶん名刺がないので積極的に挨拶出来なかったのが残念。次回イベントでは自信もって名刺渡せるようになっていたいですね。