FAQ: How big do website pictures have to be?
Website pictures should ideally be big enough to attract the attention of viewers. At the same time they should not so big they make the site slow to load and risk visitors giving up and going elsewhere.
What size should website pictures be?
The size of pictures is often given as how much space they take up on disk (file size) but a far more useful measure is how many pixels (or dots) wide and high they are. Most websites are 1100-1200 pixels at their widest so you can work out from that what size your pictures need to be.
The Website Quick Fix website is 1200 pixels wide so a picture 1200 pixels across will cover the whole width of the website. A picture that is 600 pixels across will cover half of the width of the website and so on. Scroll down the page and take a look at what different-sized pictures look like.
The lovely 😉 picture at the top of the page is a special case and meant to stretch from one edge of the screen to other, outside the normal website borders. For that reason it is 1920 pixels wide – wider than most screens are today.
What about mobile?
Making sure pictures are no bigger than they need to be is an essential part of web design. In many cases you only need to resize pictures for the maximum width of your website. The visitor’s browser will make the pictures smaller to show correctly on smaller screens.
NOTE: It is possible to make smaller versions of your pictures or hide larger pictures if the page is viewed on a small mobile screen. This can result in an increase in loading speed.
200px wide & 300px high
750px wide (Blog with Sidebar)
A good size for the featured image in blog posts is up to about 75% of the width of the website. This will leave space for the page sidebar if there is one. Otherwise use pictures the full width of the website.