double-team.org

あ...ありのまま今起こった事を話すぜ！
クライアントから電話口で「Web サイトで PNG を使うのは非常識です」と言われた
な...何を言っているのかわからねーと思うが、俺も何を言われたのかわからなかった...
頭がどうにかなりそうだった...クレームとか忠告とか、
そんなチャチなもんじゃあ断じてねえ。
もっと恐ろしいものの片鱗を味わったぜ...

マジで頭がどうにかなるところだった。しかも曲がりなりにも「Web ディレクタ」と言う肩書きを持ってる人から。
何をもって PNG が悪なのか理解できなかった（と言うかその辺の話はスルーされた感がある）。

5年くらい前なら、まあ分かる。あの頃はまだカオスだったから仕事で使うには躊躇する規格だった。だが時代は変わり2008年だ。IE5.x もほぼ死滅し、Firefox3・Safari3・Opera9.5 がリリースされた。SVG も（まだ完全には対応しきれてないが）サポートされてきた。邪悪な存在である IE6 はしぶとく生き残り、IE7 も見るも悲惨なブラウザである。IE8 でようやくまともなブラウザとして世に出てくる。

そんなご時世に「PNG は非常識」と言われる。ハッキリ言って理解できない。何を思ってそう言ってるのかは後日明確化させるが、とりあえず今は PNG が非常識と言われる所以を無い頭で考えてみた。

1. Macromedia Fireworks ＝ PNG ＝ PSD みたいなものと認識
2. レガシーブラウザで表示されない
3. モバイル対応の遅れ
4. PNG と APNG が混同
5. gif や jpg に比べてファイルサイズが大きい

こんなところだろうか。まだあるかもしれない。だがとりあえず上記5つで考えてみる。と言うか仮想敵として反論してみる。

Macromedia Fireworks ＝ PNG ＝ PSD みたいなものと認識

Macromedia Fireworks ではレイヤーの保持などを PNG ファイル内に書き込んでいる。つまり Adobe Photoshop の PSD ファイルと同じ。中身はベクターかビットマップかの違いはあるけど、認識としてはそう言うこと。つまり「Web 上で PNG を使う＝PSD を使う」と同義と変換されている。
言わずもがな、これは間違い。PNG と言う規格自体は可逆圧縮の画像フォーマットであるわけで、gif や jpg に代わる画像フォーマットとして登場した経緯がある。この辺の詳細は Wikipedia の PNG の項目が詳しい。
むしろ Fireworks が PNG を採用してレイヤーを保持させてる方が（規格として）おかしい。別に気にしないからいいけど。
って言うか PNG の仕様を全部知ってるわけじゃないからアレだけど、レイヤーを保持させるのは仕様書に書いてあるのだろうか。なんとなく気になった。

レガシーブラウザで表示されない

一体いつの話のしてるのか分からないが、各ブラウザそれぞれ、どのタイミングで PNG をサポートしたのかを調べてみた。
と思ったらありみかさとみさんがまとめてたのでそっちを参照してください。

IE3 とか Netscape 4.x とか化石。シェアどんだけ？　合計して1%くらい？（もうちょっといるか。1.1%とか）
あとレガシーブラウザで表示されないのを盾にしても、代替テキストは提供しているから画像が見えないことに対する評価は下がらない（と言うのが"こっち側"の理屈だけどね）。

モバイル対応の遅れ

ここで言うモバイルってのは NTTDoCoMo,au,Softbank,Willcom,emobile が提供している音声端末に搭載されているブラウザ機能のこと。だから Opera mini とか IE とか NetFront とかじゃなくて i モードとかそっちの方ね。一応断っておく。

非常に（信者としては）残念なことに NTTDoCoMo のみ非対応。まあそもそもモバイルで見るのか、って話だけど先に言った通り、代替テキストを提供しているのでそこは諦めてくれと。
そもそもにおいてあの画面サイズ（横幅 200px くらい）で 500px とか 600px の画像を表示しようとしたらファイルサイズオーバーになるし、表示できたとしても強制縮小されるから画像上に文字が書いてあったとしても読めない。表示するだけ無駄。

PNG と APNG が混同

無いな。PNG が非常識とか言ってる人が APNG なんか知ってるわけが無い。

gif や jpg に比べてファイルサイズが大きい

半分当たってるけど半分間違ってるってところかな。この辺は Wikipedia にある該当項目を参照した方が早いです。

と言うわけで、PNG を否定するところを全部潰しましたが、まあネックはファイルサイズかなぁ。使い方次第って感じだろうけど。
基本的に弊社では要望が無い限りほぼ全ての画像フォーマットは PNG 一択です。たまに jpg を使うくらい。gif は死んでいい。そんなところです。

とりあえず偉い「Web ディレクタ」さんからの連絡を待って、この件で進展があればまたお話しします。

（でもホントに何なんだろうなぁ。ただの勘違いならいいけど、固執した懐古主義者だとどうにもならないからなぁ。聞く耳もたないってことになるだろうし。）

最初に関係ない話。

MT のテンプレートを初期化した。いろいろ面倒になってきたし。でも MT3 のテンプレートって腐ってると改めて実感した。気が向いたら変えてみる。その前に MT4 にアップデートするかもだけど。

でもいい加減マークアップしながらブログ書くのは面倒だ。なんかもう、

1. テキストエディタに書く
2. Dreamweaver でマークアップ
3. 投稿

これでやろうか悩んでる。でもわざわざ DW 起動するの面倒くせー。はてな記法使えるようにしちゃおう。いつか今度やる気が150%くらいになったら。今20%くらい。

本題。

もう3日前の話です。アウトプット早くしないといけないなぁ、と思いつつ3日経ちました！
オレ死んでいい。

以下セミナーの覚え書き。内容に関してはネコゼさんや hamashun さんと併せて読むと補完されるかも。（特に対談部分）

第1部 マイクロフォーマットとは何か

定義

• 人間第一、機械は二の次
  • シンプルかつオープンなデータフォーマットの集合
• いま機能している物事を捨てるのではなく、マークアップやブログににおいて適用される

マイクロフォーマットが該当するのは

• データについての考え方
• フォーマットのデザイン原理
• 意味的なマークアップ
• 簡単・オープンなデータフォーマットにおける標準の集合
• 漸進的進歩
• 以上全て

該当しないのは

• 新しい言語でない
• 無限に拡張可能ではない
  • 特定の問題を解決するために生まれてきたのがマイクロフォーマット
• 異なる道具を使わせるわけではない
• 新しいアプローチではない
• 抽象化への万能薬ではない
• 全てを定義し尽くすことではない
• 以上全て

マイクロフォーマットの原理

• 特定の問題を解決する
• 可能なだけシンプルに
• 人間が第一・機械は二の次
  • 可読性の高さ
• 普及済みの標準を再利用
• モジュール化され、埋め込み可能
• 開発やコンテンツ、サービスの分散処理を可能にする

主なマイクロフォーマット

rel-license

• ライセンス情報のソースを示す
• a 要素の rel 属性に license 値を入れる
• 詳しい仕様

reltag

• タグ空間と結びつける
• a 要素の rel 属性に tag 値を入れる
• 詳しい仕様

relnofollow

• 検索エンジンに評価させない
• a 要素の rel 属性に nofollow 値を入れる
• 詳しい仕様

VoteLinks

• リンク先を賛成か反対を示す
• a 要素の rev 属性に voteagainst 値を入れると反対
• votefor 値を入れると賛成
• voteabstain 値を入れると保留
• 詳しい仕様

XFN

• XHTML Friends Network
• a 要素の rel 属性値に friend 値を入れると「友達」と評価
• met 値を入れると「会ったことある」と定義
• 詳しい仕様

geo

• 地理データを示す（緯度経度）
• class 属性に geo 値を入れ、title 属性に緯度経度をセミコロンを挟んで示す
• 詳しい仕様

adr

• geo とは違った地理データを示す方法
• 親要素に class 属性で adr 値を入れる
• 詳しい仕様

hCard

• 見出しを含めた住所情報を示す方法
• 詳しい仕様

hCalendar

• カレンダー（イベントなど）情報を示す方法
• 詳しい仕様

マイクロフォーマットの今後

今後の課題

• 一層の認知
  • 一部の人間しか利用していない
  • 啓蒙活動
• ブラウザ側の対応
  • IE8 に Web Slices を搭載（マイクロフォーマット的な情報を使える機能）
  • Firefox3 で API で利用可能
• 国際化・地域化への対応
• アクセシビリティ面での課題の解決

第2部 対談

現在取り組んでいるマイクロフォーマット関連は何？

• マイクロフォーマット関連に特化した製品開発
• マイクロフォーマットの情報発信
• マイクロフォーマットの質問に関する返答
• 企業からのアドバイス
• カンファレンスや企業に出向いてのスピーカー

日本に訪れた目的

• イベントの講演
  • マイクロフォーマット関連と各 Web デバイスにおけるデザインについて
• works corp. web expert
• 明日 CSS3 について講演（in アップルストア銀座）

Web Directions East について

• 今年後半に東京で開催予定（11月下旬）
• 5,6人海外からゲストを招待
  • 国内も同様に招待
• 同時通訳の導入
• 2日間に2つのトラックがある
• フロントエンド技術（XHTML,CSS,microformats,etc...）・JavaScript,Ajax etc...
• ワークショップも企画
• 土日がカンファレンス/月火がワークショップ
• SNS 作りの情報交換も企画

「ブラウザが対応するか、サービスが対応するか」の状況を脱していないとする見解について

• 鶏が先か卵が先か
• マイクロフォーマットが解釈するサービスが無かった
• 2,3年経ち、大きなサービスが対応して状況が改善の方向に
• 3つの要素が重要
  • コンテンツ発信者
  • コンテンツを使うサービス
  • コンテンツを作るツール
• Y!,ソーシャルブックマークなど、多くのサービスがマイクロフォーマットを実装している実績がある
• 対応アプリケーションが出てきた
• 注目に値するのがY!の対応
  • サーチモンキー
  • ユーザはその恩恵を受けることが出来る
• SEOを使うならマイクロフォーマットだよ！ｗ
  • 先行者利益が今後利いてくるのでは

ネイティブでサポートしているブラウザが無いけど？

• Firefox3 当初の予定では高いプライオリティが与えられていた
• サポートが見送られたのは残念
• 慎重に検討して実装することが重要
• 情報を再利用することは新しいことなので、現段階でネイティブサポートしなかったのは採用の判断だったのでは
• マイクロフォーマット対応・非対応のサイトでが存在する現状ではユーザが混乱するのでは
• JavaScript を使って API を利用することは非常に良い
• hCard を別ウィンドウにマッピングするツールを作成している（ブックマークレット）
  • ポップアップして出す

WebSlices について

• 期待している
  • なぜならユーザがマイクロフォーマットを知る良い機会であり体験になる
• マイクロフォーマット対応したブラウザはブラウザ2.0

アクセシビリティや国際化・地域化の課題について

• abbr 要素を使ったデザインパターンは難しい側面がある
• 過去数ヶ月、オンラインコミュニティでアクセシビリティについて感情的な議論があった
• マイクロフォーマットにとってチャレンジであることは重要
• 実際問題、どれだけアクセシビリティで問題があるのか
• HTML に関して言えば偉大な存在である
• 寿司＝洗練された存在＝HTML
  • イミフｗｗｗ
• 既存のコンテンツを壊すこと無くボキャブラリを増やしていくことが可能＝マイクロフォーマット
• HTML が持っている制約を壊すこと無く拡張していく
• 語彙を拡張した途端にアクセシビリテぃで問題が出る
  • 次のステップに行くためのチャレンジ

書籍について紹介

• 1冊でなんでも事足りることを目指した
  • 事例などを盛り込んだ
• 売れ行きは？
  • 出版社が教えてくれないｗ
  • 初版は完売
  • Amazon でトップになった
• 第二版はいつ？
  • 未定
  • 準備はしている
• 日本語版以外に出してる？
  • 今のところフランス語版が企画中
• 日本語版や読者への期待
  • マイクロフォーマット＝メタデータ
  • 言語の違いを超えてやり取りすることが可能
    • 翻訳サービスを介してもマイクロフォーマットを利用することが可能（違うかも。。。）
  • 日本でマイクロフォーマットが広まる先に国際化を乗り越えられるだろう

Q&A

• SNSでは何を当て込むのが適切か
  • クローズドな空間でも「誰が誰」と繋がってるかは抽出可能
  • ウローズドな空間だけでしか利用できないので相互利用が出来ない
• IE8 が WebSlices 搭載したが、中長期の観点からどうか
  • 心配してない
  • もし MS が作った仕様が広まってとしても嬉しい
• マイクロフォーマットをこれから使う人や使ってる人に向けての今後
  • 同じ情報構造に対して同じマークアップをして行く（テンプレートを持つ）

にしても当日は「誰々が来る」ってのは Skype のオープンチャットの方で知ってたけど、顔を知らないから誰が誰だか分かんねー、って話で。forest_k さんはあのイラスト通りの人だった（何

hamashun さんは「何となくあの人だろうなー」と思ってたけど、至る所で見る写真と「なんかちげー」と思って躊躇した。（本人だと確信したのは今回のエントリを見てから。今度会ったらきちんと挨拶しておく。commit）

最後に、John Allsopp 氏と木達さんお疲れさまでした。今回のような場を設けていただいたことにありがとうございました。

タイトル通りですが、Firefox3 のリリースを記念してギネスに挑戦しよう！と言うイベント。

• [Download Day 2008 24 時間最多ダウンロードソフトとして、ギネス世界記録へ挑戦！]

特設サイトでは Firefox3 ダウンロード当日にリマインダメールが届く＆ダウンロード確約ユーザが各国どれくらいいるかを示しています。

Firefox ユーザは早速登録してみるべし！

作ったのはもう今年の頭だったりするけど。

• ニコニコ動画キーワード検索
  • nico2-keyword-search.xml
• ニコニコ動画タグ検索
  • nico2-tag-search.xml

一応制約はあります。ログインしないと結果が見られないです（当然だけど）。それ以外は別段フツーの検索と変わりません。

不具合とかは無いはず。あったとしてもたぶんニコニコ動画側の問題だと思う。（責任転嫁ｗ）

hamashun さんが「マークアップエンジニアって IRC 使ってなくね？」（意訳）と言ってたので、勢い余ってチャンネル開設してしまった。今は反省してない。

と言うわけで irc://irc.freenode.net:6667#markupper にてみんなが待ってます！　来るといいよ！
結構テキトーだし、むしろオレ管理なんてやってないし、bot 常駐してないし、みんなの業務時間外（夜中）とか入ると誰もいない可能性アリだけど、その辺はこれから考える（だけで終わりそうｗ）

IRC 以外にも hiloki さんが Skype のオープンチャットを開設したので、こっちもどぞ！
（自分はまだ Skype を入れてないのでこれからダウンロードしに。。。）

追記 2008年4月4日 10:50

irc://irc.freenode.net は IRC クライアントの文字コードを UTF-8 に設定しないと文字化けします。（クライアントの初期値は ISO-2022-JP です）
設定方法は（クライアントによるけどここでは Limechat 限定）irc.freenode.net の「サーバのプロパティ」を開いて文字コードを「UTF-8」にしてクライアントを再起動すれば OK です。

全然関係ない話だけど、なんで irc.freenode.net を使うんだろうね（自分でここだと指定しておいてなんだけどｗ）
昔（7,8年前くらい）のオープンサーバと言えば藤沢とか奈良とかだったんだけど、今は違うのね。まあ当時のチャンネルも未だに残ってる（まだ30人以上いるとか意味が分からないw）から藤沢系のサーバが無くなったわけじゃないんだけど、なんとなく雰囲気と言うか、最近の流れ的に irc.freenode.net に移行する傾向が強いのかなぁ、と感じてる。理由がさっぱりだが。そんだけ。