Logo

Your company/brand logo is positioned front and center in both the header and footer of your store. It's the most obvious expression of your brand, so it's worth getting right.

Not all logos are created equal, and a bad logo can easily break an otherwise great site. If you are just starting out, then take these guidelines into account when creating a logo, or having one created for you. If you've already got a logo, then you might consider adapting it if the result looks disappointing.

Aspect ratio

This is the 'shape' of your logo: square, portrait rectangle, landscape rectangle etc.

Shape is more important than ever today because of the vast array of devices that might be used to view your site. We've come up with a logo placement that works well across devices, but it does place some restrictions on what logos work well.

The absolute ideal is a horizontal rectangular shape with something close to a 2:1 width/height ratio, but that's a very rough guideline. Square logos work pretty well; 'portrait' shape (taller than it is wider) - not so much.

If your logo isn't an ideal shape - perhaps consider creating a 'variant'. Most logos can be adapted to a squarer, or horizontal rectangular shape fairly easily.

Simplicity

As a general rule of thumb - simple is better than complex. Size your logo as it would be sized on a website, hold out your device at arms length and squint: does it still 'make sense'? If not, it's probably too complex. Here are some tips regarding complexity:

• Avoid too much or too small text. Logos can be displayed really small, or at really low resolutions - so keep text bold, clear and minimal

• Avoid thin lines - they can almost disappear in some circumstances and make your logo end up looking amateur.

• Avoid 'over producing' your logo. Your basic logo should look great in monochrome, without textures, gradients or crazy effects. By all means, create variants with all these effects for use in special situations, but for your basic logo - keep it to simple solid colours and lines.

Background

Your logo should be on a transparent (not white, or coloured) background. This will allow you to successfully place it on any coloured background. This also means you need to export in PNG format, rather than JPEG.

Inversions

Normally, the 'positive' inversion of your logo (dark, on light background), will be used in the header of your site, and a 'negative' (white, or light colour) inversion should be used in the footer, where it will normally be placed over a darker coloured background. This doesn't hold true 100% of the time, and depends a bit on the colour settings of your site, but its true most of the time. Some logos are 'medium' in colour and work fine on both light and dark backgrounds.

Quality

You're going to want your logo to look sharp. So you need to get hold of the original artwork and output a high quality graphic, which we will scale appropriately. If your logo was produced by a designer, they will be able to help here. A low-quality logo can really kill the professionalism of a site.

Size

By default, your logo will be displayed in the header and footer of your site at a sensible size. There isn't much wiggle room for resizing your logo, but you have some control with the field logo size in Website > Template > Logo.

Note that the maximum logo height is 70px and the height of the logo in the header when 'vertical layout' is selected is fixed.