Adobeが出したAdobe Shadowというツールがなかなかイケてます。簡単に言えばWebサイトをモバイル環境で確認するための補助ツール・デバッグツールというものなんですが、モバイルデバイスを対象にしたサイト制作時にものスゴく役立ちそうです。使うにはまずiPhoneやAndroidなどの確認側に専用のアプリをインストール。次にAdobe ShadowのPC用クライアントアプリをインストール（Mac版とWin版があります）。そして3つめにGoogle Chrome用のエクステンションを追加。

ソフトウェアの準備が出来たら次は設定です。PC用クライアントを立ち上げた状態でChromeから「Sd」ボタンを押下するとパスワードを求められます。このパスはモバイルデバイスでAppを立ち上げれば出てくるので、そいつを入力。認証は初回だけで、2回目からは必要ないです。この認証の際に注意する事は、PCとモバイルデバイスが同一ネットワーク上にある事。Wi-Fiを使ってコネクトするため、別のネットワーク上にあるとお互いが見えなくなります。

以上で準備は完了。あとはChromeで任意のサイトを見るだけ。PC側で見ているサイトがモバイルデバイスにも1秒ほどのタイムラグで表示されます。ここで表示されている情報は、PC版Chromeで表示されているそのままの絵ではなく、URL情報だけをモバイルデバイスに送信し、モバイル側でレンダーされたもの。今までだとモバイルサイト作ってアップしてURLをメールか何かでiPhoneに送って、それからブラウザ確認・・・という手順だったものが、Chromeでサイト開くだけで済むようになります。

またFirebugのようなデバッグツールも内蔵されているので、サイトのレイアウト崩れの際にも役だってくれそうです。多少準備は面倒だけど、Webのコーディングに関わる人なら持ってて損はないなかなかホットなツールかと。

Adobe Shadow | 動画による紹介