Design Specifications
Browser Design Dimensions
Click image to see larger version.
Browser height must be 200 pixels high (keeping most important content at the top 85 pixels and less important content in the bottom 115 pixels. Browser width does not have to be a full 3000 pixels.
Background Images Specifications
- Background images can tile or be solid.
- Multiple background image layers can be used.
- Images will either be aligned left or right, with the left image layered above the right image.
- Important information should be kept to the top 85 pixels, and images below the top 85 pixels can be solid or faded into the background color.
- Logo area: Logos can be placed to the left of the browser, but as browser platforms are being updated, it is becoming more evident that logos work best as a background image, incorporated into the overall background design. If a logo is used on the left, it should be sized at approx. 50 px tall and be as square shaped as possible. Wide, rectangular logos won't work.
- Keep the .psd file layered and organized. It's a good idea to keep all elements layered and organized for easier theming.
- Designs should NOT rely on the exact placement of horizontal lines or horizontal design elements. Background images may shift up or down slightly depending on user browser settings.
- Background images may appear in the titlebar on Windows browsers (see screenshot below). Important elements should maintain a slight margin from the titlebar so that they won't get lost in the titlebar.
Download the design template package (in .zip format). It includes both a Photoshop PSD template and sizing/spec sheet in PDF format.