Is there a "perfect size" for graphics on a homepage? I have our college's web designers coming up with custom graphics for our homepages and I haven't found a solid answer on the best size to make the graphics.
Solved! Go to Solution.
For Banners on our homepages, we use a 10:2 ratio (i.e. 1000x200px). We could go smaller but since we use photos in our banners, this has been a good balance of quality of the imagery and file size. In the past I typically thought 800x600 was a common screen size but I'm not a designer . When I download from Pixabay or Flickr, I aim for around 600px, as that usually has the quality of imagery retained with a smaller file size.
But the px's aren't as important as the way images are inserted into Canvas I've found. The students we serve use all types of screens: desktop, small laptop, mobile devices, phones etc. and so when I insert a graphic/image I insert using a percentage of the page as the width instead of pixels (banners are usually 100% width, visual imagery probably 30%). If you use pixels and someone has a smaller screen, it may not shrink, may require scrolling, or perhaps even skew and be unbalanced on the page.
So though we have certain typical sizes we use in designing images, when I insert the images, I always ensure the image is based on a % width versus pixels so that it will resize along with the page to best fit the student's browser of choice and keep perspective.
I have notes written down on my desk that say that the maximum page width is 1102 pixels. I'm not sure where I got that value but it's been working for me. Hope that helps!