BreakpointTesterとish.

少し前にBreakpointTesterというツールを知った。任意のページでそのブックマークレットを起動すると、参照されているCSSファイルをスキャンしてMedia Queriesのブレークポイントを探し、そのブレークポイント全てを使ってiframe要素で表示しなおしてくれるというもの。また、ほぼ同時期にish.というツールがBrad Frostにより公開された。こちらは大中小でチェックでき、リサイズも可能というもの。こちらもデバイスを特に意識はしていない。しかし、両者は似ているようで少し違う。

ish.はメジャーなデバイスを強く意識することをやめ、あらゆるデバイスでコンテンツが機能するようにしようというコンテンツ側からの視点で作られているように思う。対してBreakpointTesterはビジュアル・デザイン側からの視点で作られており、どのようなビジュアル・デザインを作成したのかをチェックしようというもの。表示されるビューポートのみにフォーカスを置くという着地点は似ているが、そこへ辿りついたアプローチは違う。

両者ともに実用的なツールではあるが、同時にデバイスという具体的な製品の単位ではなく、ブラウザーであったり(ソフトウェア)、タッチ・スクリーンであったり(ハードウェア)という特徴を意識して俯瞰する視点を持とうと訴えている気がする。この視点にコンテンツ側からもビジュアル・デザイン側からも辿りついたというのは少し興味深い。


世にはDesign Once, Display Everywhereなどという言葉もあるが、そういったいわば夢物語とされてきたものを実現するための仕様・実装は揃いつつある。BreakpointTesterやish.はその仕様と実装のテスト・ツールのひとつと言え、こういったツールの出現はこの夢物語が現実味を帯びてきたことの現れなのではないかとも思う。

普通に書けば、普通に表示され、普通に使える。そんな時代が来ると良いな。