Banner and Email Image Sizing


(John Dory) #1

Hi, I’m revamping my site with Foundation and want to place full width banner images across the top (above the topbar). A graphic design company are doing the images for me and they want to know what size in px for the banner images and emails? I know the email template is 600px wide, but what size should the full width banner images be?


(NeilUK) #2

I usually make my banner images 1800px wide, but I’m sure others will have their own personal preference.


(Stuart Marshall) #3

This kind of thing is a great use case for a stack such as Srcerer as it would allow you to link to a range of widths (or a range of different images) and have the browser use the most appropriate for whatever screen size is being used. A bit more detail about those 2 options:

  • If the aspect ratio of your image would be appropriate for use on all device sizes, then you could opt to include up to 8 different width versions of your image (e.g. from 320px right through to 2100px).The browser would then use the most appropriate one for whatever device it is being viewed on.

  • There is also the option of having your graphic design company composing your image differently for each device. (and if I am imagining your need correctly then this would probably be the best approach). Srcerer, allows for this too by enabling you to link up to 4 differently composed images and it then gives you full control over when / where each image is presented.