最終更新日 :
2023年9月25日
デバイスを Dreamweaver デスクトップアプリケーションに接続し、様々なデバイスで web ページをプレビュー、検証、テスト、およびデバッグします。
2021 年 11 月 16 日より、複数のデバイス間でページをプレビューする機能が、Dreamweaver のすべてのバージョンで廃止されました。リアルタイムプレビュー機能を使用して、複数のブラウザーでページをプレビューすることを推奨します。
Dreamweaver で、複数のデバイスで同時に web ページを実稼働環境でテストできるようになりました。 様々なフォームファクターで web ページのフローを確認できるだけでなく、ページ上のインタラクティブな機能もテストできます。 モバイルアプリをインストールしたり、デバイスをデスクトップに物理的に接続したりする必要はありません。 自動生成された QR コードをデバイスでスキャンして、デバイスで web ページをプレビューするだけです。
ライブインスペクトは、デスクトップでトリガーされると、接続されたすべてのデバイスに反映され、様々なエレメントを検証したり、必要に応じてデザインを調整したりできます。
前提条件
|
|
QR コードスキャナーがデバイスにインストールされていることを確認します。 |
|
|
コンピューターおよびモバイルデバイスがインターネットに接続されており、同じネットワーク上にあることを確認します。 |
|
|
Adobe ID の資格情報があることを確認します。 プレビュー中にデバイスにログインするには、コンピューターで Dreamweaver を使用するときの Adobe ID が必要です。 |
|
|
企業のお客様の場合は、デバイスプレビューサービスへのアクセスに必要なアクセス許可があるかどうかを確認します。 |
|
|
デバイス上のブラウザー設定で JavaScript と Cookie が有効になっていることを確認します。 |
サポート対象デバイス
すべての Android と iOS のデバイス
デバイスでの web ページのプレビュー
デスクトップコンピューターで Dreamweaver を起動して、デバイスでプレビューする web ページを開きます。
ドキュメントツールバーのリアルタイムプレビューアイコンをクリックします。
デバイスプレビューポップアップに QR コードと短い URL が表示されます。
Web ドキュメントをプレビューするモバイルデバイスで QR コードをスキャンします。 複数のデバイスを接続するには、それぞれのデバイスで QR コードをスキャンします。
デバイスにログイン画面が表示されます。 自身の Adobe ID 資格情報でログインします。 Dreamweaver や Creative Cloud を使用するときと同じ Adobe ID を使用してください。
ログインに成功すると、接続されたデバイスの名前がデバイスプレビューポップアップに表示されます。 これで、接続したデバイス上で web ページのプレビューを確認できます。
メモ
ポップアップのデバイス名を実際のデバイスとマッピングするには、デバイス名にマウスポインターを置きます。 対応するデバイスにフィードバック画面が表示されます。
デバイスでの web ページの検証
接続されたすべてのデバイスで web ページを検証するには、Dreamweaver ツールバーのインスペクトアイコンをクリックします。
特定のデバイスで web ページを検証するには、デバイスプレビューポップアップで対応するデバイス名のインスペクトアイコンをクリックします。 Dreamweaver のビューポートが対応するデバイスのビューポートと一致するように設定され、その特定のデバイスと Dreamweaver で検証が実行されます。
インスペクトモードを終了するには、Dreamweaver でもう一度インスペクトアイコンをクリックします。
デスクトップで行った web ページに対する編集は、確定後すぐにデバイスに反映されます。
デバイスプレビューに関する問題のトラブルシューティング
デバイスへの接続中、またはデバイスでの web ページのプレビュー中に問題が発生した場合は、デバイスプレビュー - トラブルシューティング内の情報を参照してください。
