Your folder and layer structure is key to all designs as different environments have different requirements. There are situations where incorrect folders or layers can cause unwanted display errors in the output.

It is important to plan your design and follow our guides related to your target environment.

Single Page View

If you are exporting a basic design WITHOUT additional Output Options, then there are not many rules to follow.

Basic designs convert as-is.

All designs should follow our PSD Design and Layer Naming rules to ensure your design has standard elements. Regardless of the your personal design, all designs should generally have a [HEADER], [CONTENT], and [FOOTER] folder – with an optional Background layer.

Background layers should be bottom most layer in your PSD.

Static Multiple Pages

If you are exporting a multi-page design WITHOUT Dynamic Height, then you can place your background normally.

Background layers should be bottom most layer in your PSD.

It is important to organize your [HEADER], [CONTENT], and [FOOTER] folders with pages and ensure your page contents are in their respective folders.

Dynamic Multiple Pages

If you are exporting a multi-page design WITH Dynamic Height, then you must place your background layers respective to their containers.

Your [HEADER], [CONTENT], and [FOOTER] folders will EACH require an individual Background layer.

QUICK ERROR FIX: If your output does not look right with Dynamic Height, wrap all your content in respective folders - eg. [HEADER CONTENT], [BODY CONTENT], and [FOOTER CONTENT].

Relative Backgrounds

Dynamic Height will measure each Level 1 layer in the output, if you do not place your layers correctly inside folders – you WILL have unexpected display errors.

Responsive Target Screens

All Responsive Designs are similar to Dynamic Multiple Pages with additional conditions.

1. All content including pages must be placed inside your screen folder, or they will be considered static

2. You MUST have the same folder/layer structure in ALL screens

3. DO NOT change the names of layers in different screens