9
AdobeがBrowserLabプレビューをリリース

Adobeは水曜日に、プロのWebデザイナーがMacおよびWindowsプラットフォーム上の様々なWebブラウザでWebサイトがどのように表示されるかをプレビューできる、完全ホスト型のオンラインサービス「Adobe BrowserLab」を発表します。このサービスは仮想化技術を活用し、ユーザーがすべてのブラウザをインストールすることなく、様々なブラウザでWebサイトがどのように表示されるかをリアルタイムでスクリーンショットとして生成します。

ブラウザ内ブラウザのように、BrowserLabsに組み込まれた診断ツールを使うと、ユーザーはサイトのページを閲覧・比較し、ブラウザやプラットフォーム間でデザインの整合性を確保できます。「ブラウザの互換性を判断することはますます困難になっており、あらゆるブラウザでウェブサイトをテストするのは膨大で時間のかかる作業です」と、Adobe Creative Suiteのプロダクトマネージャーであるスコット・フェゲット氏は述べています。「現状では、テストは困難で苦痛を伴います。まるでデザイナーがITプロフェッショナルを兼任しているようなもので、それが彼らの本来の能力ではないのです。」

BrowserLabは、サービスの無料プレビューとして開始され、コミュニティに先着順で提供されます。3,000~5,000人のテストユーザーを迅速に集めることを目指しています。プレビューは英語のみで提供されます。7月上旬までに、招待制で追加ユーザーにプレビューが公開される予定です。Adobeは、サービスの今後の方向性を決定するために、ユーザーからのフィードバックを求めています。Adobeによると、国際版や対応ブラウザ、OSのリストは、ユーザーの需要に応じて今後拡大していく予定です。Fegette氏によると、BrowserLabは将来的に有料サービスになる予定ですが、その時期はまだ未定とのことです。

BroswerLabは、AdobeがWeb経由でクリエイティブプロ向けアプリケーションに重要なサービスを追加するという、より広範な戦略の一環であり、同時に、従来のデスクトップソフトウェアのアップグレードサイクルである12ヶ月または18ヶ月という期間からの脱却を目指しています。BrowserLabは、KulerやInContext EditingといったAdobeの他のクリエイティブプロ向けホスティングサービスに加わります。

デザイナーの支援

BrowserLabは、Flash 10対応のブラウザからアクセスできます。ブラウザラボのインターフェースでは、ページを1アップ、2アップ、またはオニオンスキン形式で表示し、並べて比較することができます。オニオンスキン表示では、デザイナーは2つのページを重ねて表示することで、ブラウザやプラットフォーム間のピクセル位置レンダリングのわずかな違いを捉えることができます。ズーム機能を使えば、ピクセルレベルでの比較も可能です。また、ブラウザセット機能を使えば、テスト設定をカスタマイズして保存できるため、特定のブラウザやプラットフォームでのみ作業するデザイナーにも便利です。

テストする Web ページを選択し、Mac と Windows の両方のプラットフォームで Safari、Firefox、Internet Explorer で表示することを選択します。

フェゲット氏によると、「このツールは、デザイナーに重要な視覚的コンテキストを提供することで、デザインプロセスの一部となります。デザイン手法を民主化し、ワークフローが正しいという自信を与えてくれます。調整は事前に行われ、シームレスにデザイン作業を進めることができます。」このツールの目的は、デザイナーがブラウザやプラットフォームの互換性に関する問題を早期に特定し、シンプルで迅速なリアルタイムのフィードバックを提供することで、プロジェクトの後期段階で修正に時間のかかるミスを回避することです。

プレビュー版のリリースには、MacおよびWindowsオペレーティングシステム向けのSafari 3、Firefox 3、Internet Explorer 6および7という3つの主要ブラウザが含まれています。このサービスは、静的、インタラクティブ、そしてデータ駆動型のウェブサイトをテストします。

ページを単独で表示したり、並べて表示したり、重ねて表示してピクセルレベルで比較したりすることができます。

BrowserLabのサイトを開くと、シンプルなグレーのインターフェースが開き、上部に6つのメニュー項目が表示されます。「ブラウザセット」をクリックすると、ウェブサイトの表示順序とレイアウトを選択できる3つの列が表示されます。1列目にはデフォルトのブラウザセットが表示され、カスタマイズしたデフォルトセットを選択することもできます。中央の列には、テストするブラウザの完全なリストが表示され、チェックマークを付けることができます。必要に応じて、すべてのブラウザでサイトをテストすることもできます。3列目では、プレビューの表示順序を選択できます。ドラッグアンドドロップインターフェースを使って、表示順序を即座に変更できます。

「テスト」ボタンをクリックすると、サイトのURLを入力できるアドレスウィンドウと、1アップ、2アップ、オニオンスキン表示オプションを選択するプルダウンメニューが表示されます。ポップアップメニューでは、利用可能な他のブラウザでページを表示することもできます。キーボードのプラスキーはズームイン、マイナスキーはズームアウトとして機能します。また、ズームスライダーを使用して、最大200%または75%までズームすることもできます。「ホットキー」ボタンは、利用可能なキーボードコマンドを素早く確認できるリマインダーです。上下矢印キーを使用すると、あらゆる表示の組み合わせでブラウザの選択肢を移動できます。

Dreamweaverとの統合

BrowserLabはWebデザイナーなら誰でも使用できますが、Dreamweaver CS4ユーザーにとっては特に便利です。デスクトップ上のローカルプログラムからWebサイトにアクセスできるからです。BrowserLabとDreamweaverの連携を可能にする2つのDreamweaver拡張機能(MXP)ファイルもAdobe Webサイトからダウンロードできます。これらのファイルは、Dreamweaverをスタンドアロンアプリケーションとして使用しているデザイナー、またはCS4 Web Standard、Web Premium、またはMaster Collectionパッケージをお持ちのデザイナーがご利用いただけます。

「Dreamweaverとの統合により、インタラクティブなコンテンツの扱いが容易になり、(このサービスは)次のレベルへと飛躍するでしょう」とフェゲット氏は述べた。Dreamweaver内で動的デザインやFlashベースのデザインをテストする利点は、マウスのロールオーバー効果、動的なウィジェット、AJAX駆動型コンテンツなど、様々なインタラクティブ性の状態を確認できることである。Dreamweaverとの統合により、セキュリティ上の問題や懸念を抱くことなく、ローカルコンテンツとリモートコンテンツの両方をプレビューできる。

Adobe BrowserLab は、OS X 10.4 および 10.5、Windows XP (SP2 Home および Professional または SP3)、および Windows Vista オペレーティング システムと互換性があります。