Adobe BrowserLab レビュー～ MacもWindowsもチェック可能なFlash製クロスブラウザチェッカー

2009年6月4日

Webサイトの構築で手間のかかる部分といえば、Webブラウザごとの対応を確認するところでしょう。Internet Explorerだけでもバージョン6、7、8のそれぞれの確認が必要でしょうし、Firefox、Safari、Opera、ChromeなどさまざまなWebブラウザで、Webページが正常に参照できるのかを確認するのは、環境を用意しなければならないうえに手間のかかる作業です。

アドビシステムズが公開を始めたAdobe BrowserLabは、このWebブラウザの互換性チェックを簡単に行うためのサービスです。

自分がMacを持っていなくてもMacOS XのSafariでどう見えるのか、あるいはInternet Explorer 6がインストールされているPCを持っていなくても、Windows XPのInternet Explorer 6でどう見えるのか、といった確認をWebブラウザ上で行うことができます。

Webブラウザからクロスブラウザチェック

BrowserLabはWebブラウザから利用するサービスです。Adobe Flash 10以上がインストールされているWebブラウザならば、WindowsからでもMacからでも利用できます。利用にはAdobe IDが必要です。

使い方は簡単。上部にあるテキストフィールドに、確認したいWebページのURLを入力し、再描画ボタンを押すだけです。すると、BrowserLab内の仮想マシンで実行されたさまざまな種類のWebブラウザでの表示結果を画面上でみることができます。

結果は画像として表示されているため、クリックなどは一切できません。

確認画面の使い方を紹介しましょう。左上のプルダウンメニューから「1-up View」を選択すると、特定のWebブラウザの結果が画面全体に表示されます。「2-up View」を選ぶと、画面が2つに分割され、左右で異なるWebブラウザの結果が表示されます。それぞれの画面にどのWebブラウザの結果を表示させるかは、その下のプルダウンメニューで選ぶことができます。

BrowserLabを使ってMac OS XのSafariでのWebページを確認している。1-up Viewモードで画面全体を使って確認

2-up Viewモードでは、画面を中央で2分し、左右で別のWebブラウザでの見え方を確認できる。左がWindows XP上のFirefox 2.0、右がMac OS X上のSafari 3.0。フォントなども違っているのが分かる

面白いのは「Onion Skin View」を選んだ場合です。このOnion Skin Viewでは2つのWebブラウザの表示結果を重ね合わせて見ることができます。上部のスライドバーで、重ね合わせたウィンドウのそれぞれの透明度を操作することができるので、どちらのWebブラウザがどのような表示になっているのかを見分けることもできます。

2つのWebブラウザでの見え方を重ね合わせて確認できるOnion Skin Viewモード。1ピクセルの違いでも見逃したくない場合に使える

まだ確認できるWebブラウザの数は少ない

画面でお分かりのように、日本語フォントを用いたWebページもきちんと表示されており、また、JavaScriptも実行されているようでJavaScriptが埋め込まれた部分も表示されていました（前述したようにクリックなどはできないため動作チェックはできません）。実用的には問題ないレベルで使えそうです。

まだ選べるOSのWebブラウザの種類は少ない

米アドビシステムズのリリースによると、このシステムはクラウド上の仮想化技術によって実現されているとのこと。おそらく大量の仮想マシンがWindows XP上のInternet ExplorerやMac OX上のSafariを実行していると想像されます（しかしMac OXをクラウド上で実行する場合、OSのライセンスはどうなっているのでしょうね？）。

This capability is enabled by virtualization technology, hosted through a cloud-based application, which eliminates the need to have browsers installed on a system before testing a site.

ただし、2009年6月4日現在で確認できるOSとWebブラウザの組み合わせは以下のみです。