Share via

トレース用イメージ

  • [アーティクル]

グラフィック プログラムで Web ページ イメージのモデルを作成し、Web ページのデザインを作り直したりトレースしたりするときの見本として使用できます。これは、トレース用イメージと呼ばれ、JPEG、GIF、PNG、BMP のいずれかの形式で保存できます。

トレース用イメージを使用するには、そのイメージをページに追加します。このイメージは、[デザイン] ビューの Microsoft Expression Web ドキュメント ウィンドウの背景に表示されます。イメージの表示と非表示の切り替え、不透明度の設定、および位置の変更を行うことができます。トレース用イメージは、Expression Web の背景イメージとエディタの間のレイヤーに保存されます。

トレース用イメージの X 座標と Y 座標は、編集ウィンドウの左上隅を基準にしています。[トレース用イメージ] ダイアログ ボックスの [X] (左右) と [Y] (上下) で座標を選択することによって、トレース用イメージの配置をピクセル単位で調整できます。

異なる X 座標と Y 座標によるトレース用イメージの配置

Cc295031.445c3898-38d6-4710-afc7-a89937ef1926(ja-jp,Expression.10).gif

トレース用イメージを含む Web ページを保存すると、Web サイトの埋め込みファイルとしてこのイメージを保存するかどうかを確認するメッセージが表示されます。トレース用イメージを埋め込みファイルとして保存しても、ブラウザで表示したときのサイトの外見は変わりません。同じページに 2 番目のトレース用イメージを設定すると、そのページの最初のイメージは削除されます。

トレース用イメージを Web ページに追加するには

  1. [デザイン] ビューで [表示] メニューの [トレース用イメージ] をポイントし、[設定] をクリックします。

  2. [トレース用イメージ] ダイアログ ボックスで次の操作を行います。

    項目

    目的

    ファイル名

    [参照] をクリックして、トレース用イメージとして使用するプロトタイプ イメージを選択します。

    [X] および [Y]

    トレース用イメージでの Web ページの左上隅を [デザイン] ビューの左上隅と揃えるために、左右の座標と上下の座標を入力または選択します。

    不透明度

    スライダのつまみを動かして、トレース用イメージの不透明度を設定します。たとえば、トレース用イメージなしで作成中のページの外観を確認するには、スライダのつまみを動かしてトレース用イメージの不透明度を希望のレベルまで下げてください。

    適用

    クリックすると、トレース用イメージをプレビューできます。

    これで、[デザイン] ビューでプロトタイプ イメージを表示した状態で、ページのデザインを開始できるようになりました。

トレース用イメージに基づいて Web ページをデザインするには

  1. [レイアウト テーブルとセル] 作業ウィンドウで、トレース用イメージの構造に最も近い、定義済みの構造化ページ レイアウトを選択します。詳細については、「レイアウト テーブル」を参照してください。

  2. テーブルのセルのサイズを変更し、他のレイアウト テーブルを挿入して、トレース用イメージの構造を反映させます。

  3. トレース用イメージに合わせて、イメージ、ボタン、その他の構造化要素をレイアウトに挿入します。

  4. レイアウト テーブルを追加作成したり、セルの余白やパディングの値を調整したりして、トレース用イメージに合わせてレイアウトを微調整します。

  5. デザインが完成したら、トレース用イメージをオフにして結果を確認します。

トレース用イメージをオフにするには

  • [表示] メニューの [トレース用イメージ] をポイントし、[イメージの表示] をクリックします。

関連項目

概念

編集ウィンドウ

Web ページへの画像の追加