I'm building a portfolio website that uses full screen background images slideshow that are cropped to fit using a JavaScript plugin. To give the minimum amount of cropping whats the best ratio to make the images? ie I know 13" Macbooks are around 13:7 (when taking into account about 100px for the browser bar) but does that scale up on 15", 24", or 17" displays?

I know there are charts showing the most common dimensions but they just show a range of sizes and thats categorized by groups rather than actual dimensions.

2 Answers 2


While one could compute the average aspect-ratio or, even better, the most frequent aspect-ratio of your displays for people of visit your site, it will be of little consequence.

As you have noted, the browser bar takes some space. It takes a different amount of space on each browser, at different resolutions and with different toolbars installed. Scroll bars will also add to this.

The biggest problem though, I strongly suspect, is that most people other than tablet users do not browse with their window full-screen. Even if they browse maximized, the browser will not always cover the entire screen, at least on Windows, depending on the start bar position, size and auto-hide state.

The best you can do is decide the ratio of image you have and do some scaling and cropping to get the balance you want. If you want to avoid space outside of the image, start with something like 4:3 and crop to it which mean most people will get to see most of the width of the image. Remember some people use their screens in portrait orientation, so you should be ready for that too.


You may find this useful for creating full screen background images.

  • Can you expand upon the link provided to address the question(s) in a little more detail?
    – dan
    Commented Dec 3, 2013 at 8:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.