完成品を作るツールとして、CSS フレームワークにはまだ課題が幾つか残されていますが、充実したツールをうまく使いこなすことで効果的な HTML プロトタイプ制作を可能にします。

今月はじめに John が来日したときに「フォント関連で近々発表があるんだよね」と言っていたのですが、ついに全貌が明らかになったようです。Jeffrey Veen を中心に TypeKit というプロジェクトが立ち上がる模様です。既に WebKit, Opera 10, Firefox 3.1 3.5 でサポートされている @font-face。利用者のパソコンにあるなしに関係なく指定のフォントが使えるようになります。つまり、今まで仕方なく画像文字にしていた部分もテキストで処理可能になる可能性があります。 @font-faceでまず問題になるのが著作権に侵害しないかどうかという部分です。多くのフォントはウェブ上での配布を禁じていますし、@font-face の許可をしていないフォントもあります。法的な問題や DRM を気にせず安心して @font-face を使った文字表現をするために生まれたのが Typekit です。サイトに公開されているカタログの中から好きなフォントを選んで JavaScript を埋め込むだけで使えるようになるそうです。現在、様々なフォントを保持する団体や機関と協議が進められており、無料フォントだけでなく商用フォントもカタログに追加出来るように働きかけているとのこと。今夏リリースが楽しみです。 恐らく発足直後はアルファベットだと思うので、日本語のサイト構築には関係ないのかもしれません。しかし、フォント指定の継承順を工夫すればアルファベット部分のみ @font-face でリンクした書体を使うことが出来ます。発足メンバーに入っている John としても日本語フォントもぜひ追加したいという意向を示していたので、何かしらの形でお手伝いするかもしれません。日本語はカタカナ、平仮名、漢字を合わせると果てしないほどの数があるのでファイルサイズも大きいです。しかし、新聞では常用漢字を基本的に使うようにしており、その数はおよそ2000。それでも多いですが、ある程度絞ったとしても普通の文章やヘッドラインくらいの書体を変えるのは難しい話ではないでしょう。 あと IE 問題。@font-face 自体はサポートしているのですが、他のブラウザが TrueType を利用しているのに対し、IEのみ「EOT」という独自フォーマットのみ対応しています。しかし、TypeKit が起爆剤となって TrueType サポートをせざる追えない状況になる・・・なんてことも考えられます。「IEサポートさていない＝使えない」と言って使わないのはあまりに消極的ですしね。「使って IE にサポートさせる」くらいの勢いは今は必要なのかもしれません。 文字が自由になることによって、酷く読み難いサイトも出てくるのかもしれません。ただ、利用者が見た目を選ぶ権限があるのが CSS のメリットですし、@font-faceは、CSS で装飾する意味がさらに出せる要素だと思います。CSS 全般にもいえますし、Flash もそうですが、やり過ぎな感じのサイトは出てきますし、当然のことです。それと同時に技術を上手く利用した素晴らしい表現をもつサイトもどんどん出てきます。TypeKitのようなサイトがウェブ上での文字表現をおもしろくする起爆剤になるのではないかと期待しています。

Qtは、クロスプラットフォームで動作するアプリケーション開発を目的としたフレームワーク。開発と GUI デザインをワンストップで行えるメリットもあるので、様々なデバイスやアプリケーションで Qt が採用されています。代表的な例だと Google Earth でしょう。 様々なライブラリも用意されているわけですが、その中で注目なのが QtWebKit (日本語) というモジュール。Qtで開発されたアプリケーションの中に Webブラウザを埋め込むことが出来るようになります。 Qt は以前から GPL ライセンスとして配布されていたのですが、最近 LGPLライセンスが加わりました。もちろん GPL でも商用利用は可能ですが、よりフレキシブルなライセンシングと再配布が可能になります。これによりさらに積極的な Qt 開発も進むのではないかと考えられます。 今回のライセンスの変更により開発が活発化してきているのが Second Life。以前から Mozilla ベースのウェブブラウザを Second Life 内で利用出来たわけですが、これを WebKit に変更する可能性があるみたいです。実際 Second Life Wiki の WebKit worklist を見ると具体的に開発が進められているのが分かります。WebKit の採用にあたり、モバイル向けの WebKit ブラウザを配布している Torch Mobile と共同開発しているみたいです。 様々なデバイスやソフトウェアが WebKit を採用し初めていますが、3D世界でも WebKit がデファクトとして広まるのかもしれません。単に Second Life が採用したから広まる・・・という意味ではなく WebKit のポテンシャルをみただけでもその可能性は高いです。3Dの描画が可能な CSS Transforms、タイムラインベースのアニメーションを可能にするCSS Animation、そしてSVGサポートのことを考えると 3D 世界で見るウェブ体験をおもしろくする材料が揃っています。 WebKit に限った話ではないですが、見た目を同じにすることの努力ではなく、使われているデバイスやソフトウェアの体験を最大限に引き出すためのウェブサイトの見せ方を追求していきたいですね。それぞれのブラウザの共通で使える『最大公約』属性だけでなく、独自で使える属性にもしっかり注目していきたいですね。

ここ数年にリリースされたウェブブラウザは W3C の仕様に従いつつ、実験的に独自の要素を実装して表現の幅を広げようとしています。CSS まわりでは WebKit がリードしているのではないでしょうか。マルチカラムや複数背景画像のような CSS3 にあるものから、反射やマスクのような変わったものまで実に様々です。 最近 WebKit のほうにも実装され、今月の CSS WG で草案化する可能性がある仕様で CSS Variables というのがあります。その名のとおり「CSS で変数を扱う」というもので、値を一元管理出来るようになります。詳しくは withD のこちらの記事が参考になりますが、サンプルコードを書くとこんなかんじです。 @variables { companyTheme: #069 highlight: #ffc; PageTitleSize: 18px; SubheaderSize: 14px; } h1 { background: var(companyTheme); font-size: var(SubheaderSize); } h2 { font-size: var(SubheaderSize); } strong{ background: var(highlight); } @variables内で変数と値を定義しておくことで、メンテナンス性を上げています。こうした一元管理の試みは以前から行われており、PHPで行うテクニックは広く知られています。CSS Variables が実装されれば、面倒な準備をせずにそのまま書き込めるので便利ですね。 期待が高まる CSS Variables ですが、反対意見も出ています。W3C の CSS WG にも参加している Bert Bos氏が最近 Why “variables” in CSS are harmful というエッセーを公開しました。彼は CSS がどんどんプログラミング言語のような扱いになっていることを危惧しており、CSS が CSS として行わればならないこと (タイポグラフィやレイアウト) にフォーカスするべきではないかと指摘。上級者には便利な拡張に思える CSS Variables だが、初心者を遠ざけてしまう恐れがあるのではないかと考えているそうです。 今、CSS を使いこなしている方の多くは、他の人が作った CSS ファイルを参考にしてスキルアップをした方が多いと思います。CSS Variables が入ることで、コードをみて覚えるというのが少し大変にはなるでしょうね。また、CSS Variables のような値の管理を CMS 側で行うというやり方も考えられると思います。 Bos氏が書いていることで同意出来る点はあります。 CSS3 セレクタは複雑ではありますが、大変便利だと思いますし、使う機会は今度ますます増えてくると思います。ただ、CSS でわざわざアニメーションをする必要があるのかどうか疑問だったりします。CSS で何でも出来るようにするよりかは CSS は CSS であって欲しいなという思いがあります。 しかしながら、CSS Variables は必要ではないとは思いません。工夫すればシンプルに CSS