メインコンテンツにスキップ

ステージ

ステージの役割について説明します

Teshima avatar
対応者:Teshima
今週アップデートされました

ステージとは

新規プロジェクトを立ち上げると、最初に「新しいページ」が作成され、下図のように、キャンバス上に白い「ステージ」が現れます。

dpdpでは、Webページを作成する時、このステージの上に簡易板や整列板などのレイヤを配置することになりますが、ステージは、そのレイヤの位置を決める基準となるものです。

▶ POINT

ステージの外側は、Webページ上では完全に 「ブラウザの外」 になりますので、デザイン画面上でステージの外に飛び出しているレイヤは、実際のブラウザ上には現れません。

● ステージの調整

作業画面上または左のレイヤツリーで「ステージ」を選択すると、ステージの調整が行えます。

■ ステージのサイズ

ステージの横幅は、実際のWebページのブラウザ画面の横幅を想定しており、初期値では 1280px に設定されていますが、たとえば 1680px 幅のブラウザで見られることを想定してデザインしたい場合には、ステージの横幅を 1680px に変更してからデザイン作業を行うと、仕上がりがイメージしやすくなります。

ステージの縦サイズ

ステージの縦サイズについては、特に気にする必要はありません(ステージ下にコンテンツが飛び出したとしても実際のWebページではすべて表示されます)。ただし、ステージ縦サイズが短すぎると、配置したレイヤの視認性が悪くなって作業しにくくなりますので、すべてのコンテンツをカバーできる程度の長さを確保して作業するのがオススメです。

■ ステージの背景色

ステージの背景色は、ステージ上に配置されたすべてのレイヤの背景色となります。従って、ステージにカラーを設定すると、そのカラーが Webページ全体の背景色となります。

ステージのサイズを変更する

プロパティパネルの下方からもステージの設定が行えます。

レスポンシブデザインにも関係する内容ですので、

ステージのサイズ変更については以下の記事をご参照ください。

こちらの回答で解決しましたか?