What size images do I use for Landing Pages?
There are two images that can be embedded in Landing Pages using the pre-built templates -- the header logo and image in the navigation region.
Header Logo
The header logo appears inside of a region called "header". The region is 800px wide and it's content is left-aligned. You should use an image that is 800px or less wide. The region will expand to accomodate images of any height. Though you should be careful to use images that don't push too much of your landing page content below the fold.
The region is a <div>
with
id="header"
.
Navigation Image
The navigation image appears appears either in the left column, right column or near the bottom depending on the selected landing page layout.
Layout 1 - Single column layout
The image is in a region below the landing page's main content
(i.e. <div id="navigation">
) that is
left-aligned, and has a width of 350 pixels. Therefore, your image
should be 350px or less wide. The region will expand vertically to
accomodate images of any height.
The region is a <div>
with
id="navigation"
.
Layout 2 - 2 Column with main content to the right
The image is in a region to the left of the main landing page content that is left-aligned, has a width of 250px with 1.7em of padding. Your image should be around 250px or less wide. Again, the region will expand to accomodate images of any height.
The region is a <div>
with
id="navigation"
.
Layout 3 - 2 Column with main content to the left
The image is in a region to the right of the main landing page content that is left-aligned, has a width of 250px with 1em of padding. Your image should be around 250px or less wide. Again, the region will expand to accomodate images of any height.
The region is a <div>
with
id="navigation"
.
Further Customizations
You can either customize the entire landing page template or use custom CSS to apply additional styling to the three pre-built templates.