Dreamweaver を起動します。
最終更新日 :
2021年4月28日
Adobe Device Central と Dreamweaver の併用
Device Central を使用すると、Dreamweaver ファイルが様々なモバイルデバイスでどのように表示されるかをプレビューできます。Device Central では、Opera のスモールスクリーンレンダリング™ を使用して、画面の小さいモバイルデバイス上での Web ページの表示をプレビューしています。CSS が正しく機能するかどうかをテストすることもできます。
例えば、Web サイトを携帯電話で利用できるようにしたい場合に、 Dreamweaver を使用して Web ページを作成し、Device Central を使用して、そのページが様々なデバイスでどのように表示されるかをテストできます。
-
-
ファイルを開きます。
-
次のいずれかの操作を実行します。
ファイル／ブラウザーでプレビュー／Device Central を選択します。
ドキュメントウィンドウのツールバーで、ブラウザーでのプレビュー/デバッグボタン
をクリックしたまま、「ブラウザーでプレビュー Device Central」を選択します。
モバイルデバイス向けの Dreamweaver Web コンテンツを作成するためのヒント
Device Central では、Opera のスモールスクリーンレンダリング機能を使用して、Dreamweaver で作成された Web ページをプレビューできます。 このプレビューによって、Web ページがモバイルデバイスでどのように表示されるかがわかります。
注意：実際のデバイスには、Opera のスモールスクリーンレンダリング機能が搭載されていないものがあります。Opera のスモールスクリーンレンダリング機能が搭載されているデバイスの場合に、Device Central で実機と同じようなプレビューができます。
以下のヒントを使用して、Dreamweaver で作成した Web ページがモバイルデバイスで適切に表示されるようにします。
Adobe® Spry フレームワークを使用してコンテンツを開発する場合、Device Central で適切に CSS をレンダリングして JavaScript™ を実行するために、以下の HTML の行をページに追加します。<link href="SpryAccordion.css" media="screen" rel="stylesheet" type="text/css"/> <link href="SpryAccordion2.css" media="handheld" rel="stylesheet" type="text/css"/>
Opera のスモールスクリーンレンダリングでは、フレーム、ポップアップ、下線、取り消し線、上線、点滅および囲み枠はサポートされていません。 これらのデザインエレメントは使用しないようにしてください。
モバイルデバイス向けの Web ページは単純な作りにします。 特に、使用するフォント、フォントサイズおよびカラーの数は最小限にします。
画像サイズを縮小し、必要な色数を減らすと、意図したとおりに画像が表示される可能性が高くなります。 CSS または HTML を使用して、使用する各画像の高さと幅を正確に指定します。 すべての画像に alt テキストを付けます。
注意：
Opera ソフトウェアの Web サイトに、モバイルデバイス向けに Web ページを最適化するための情報が多数あります。
携帯電話やモバイルデバイス用のコンテンツを作成するための詳細なヒントおよびテクニックについては、www.adobe.com/go/learn_cs_mobilewiki_jp を参照してください。
