Image requirements for your website.

Format

Your photos must be in JPEG, GIF or PNG format before you upload them.  JPEG is the best format for photos. You should be able to change most other image types by opening the file, then clicking save as from the file menu. 

Filesize

The filesize of your photo file should be less than 200k. You can check the filesize by right clicking the file and clicking view properties...

Note 1 meg is bigger than 100k. If you see the word megabytes, then your image is far too big... The average size taken by digital cameras is normally around 250-400 kilobytes. You should use your lowest settings on your camera, or VGA settings... Otherwise you will need to compress these images before you can upload them to the web... You can do this after you have uploaded them also, but a large file size will make it take ages to upload.

Dimensions

You can also check this if you right click on a photo file and then click "view properties".

Full Width Banners where the template stretches the full width of the browser  - 1600px wide.

Base Thumbnails for use on standard pages 320x320 pixels or 480x480px.

For product images that are to be opened in a popup 900px gives a good balance between download size /speed and viewing detail.

Full-width images on templates can range from 980px for older websites up to 1600px for newer templates.

Resolution and Fuzzy Images

Every template has different rules, or focuses on a different width.

A typical desktop computer uses 1920px width,  so a full width banner might be that size. However,  such resolution is hard to read sentences across such a width, so many templates have width constrained to 1200px, with all visual elements contained within that.

If the image takes up half the page, then that might be 600px to 960px

If an image is of a lower resolution than the target position,  it may look fuzzy or blurry, as it may be upsized.

If an image is of a higher resolution than needed, it may simply waste bandwidth and take longer to download.

When a browser or device has a lower resolution, such as an iPad or mobile phone, then the image will be squished. For example, a phone might have around 400px to 500px width in portrait mode.

Its generally safer to use larger images than smaller images. Most templates have been setup with the right sizes for that theme. 

By default, a typical product image is sized 960px, which is slightly larger than half a full screen width. Often it will render at 480px to 600px.

By default, thumbnails on a category page are rendered at 320px, and some smaller thumbnails may be 160px under the hood.

Upload Errors

If your photos are not in the right format or size, they may be too big to upload to the content management system or they will make your website run slowly.