ShopFactory has a powerful Picture Manager built in to make your life easy. It can automatically adjust image sizes to create thumbnails, to limit the maximum size of an image and can also link a thumbnail to the larger picture.
ShopFactory has a powerful Picture Manager built in to make your life easy. It can automatically adjust image sizes to create thumbnails, to limit the maximum size of an image and can also link a thumbnail to the larger picture. So if you have taken a picture of an item with your camera, just store it on your computer - preferably with a descriptive name. ShopFactory will use the name as title - and take care of all the image management required (including sizing and image file format compression).

But, it is important to know what image types are available to use, the difference betweenimage types, and when to use each type.
Image Formats What is the difference between JPG GIF PNG?
The difference in image types is the result in use of compression. By default, most images have a fairly large file size, which is not viable in some cases to use on web sites. The most commonly compressed image file types are .jpg, .gif and .png. Other image formats such as .bmp, .tif, and .psd are uncompressed and simply should not be used for websites since they are a larger file size and will download slower on a visitor’s browser.

JPG
JPG file format (short for Joint Photographic Experts Group) is a type of image compression that works best with photographs and complex images. JPGs use a compression method that removes non-human-visibile colors from images to decrease file sizes. Be careful, though. If you decrease the quality of a JPG too much, you will begin to lose important visible color information that cannot be recovered.

The JPG file format also allows you to save progressive JPGs, which will load in stages. You may have experienced this before when visiting a website and watching as an image slowly loses its blurriness and becomes clearer.
Use JPGs for product photos, human portraits and other detailed images where color variances and fine details are important. Do not use JPGs if you need transparency, which is the ability to see through an image and decipher the background behind it. JPGs do not support transparency.

GIF
A GIF (Graphics Interchange Format) reduces the number of colors in an image to 256, from potentially thousands of colors coming from a digital camera. GIFs also support transparency.
GIFs have the unique ability to display a sequence of images, similar to videos (animated GIF), which is a series of separate GIF images that are linked together to automatically create motion, or animation.

GIFs, like JPGs, also have the ability to load in segments on web pages. These images, known as interlaced GIFs, tend to be slightly larger than regular GIFs, but they allow a GIF image to be partially visible as it is loading on a web page.

GIFs can be used effectively for limited-color images, such as logos and graphs, or for images where transparency is important. Do not use GIFs for full-color product photos and human portraits where color variances and fine details are important since GIF colors are limited to 256.
Although the GIF format is still in use, it should generally be avoided in favor of the PNG format, which does nearly everything better.

PNG
PNG (Portable Network Graphics) were created as an alternative to the GIF file format, when the GIF technology was copyrighted and required permission to use. PNGs allow for 5 to 25 percent greater compression than GIFs, and with a wider range of colors. Like GIFs, PNG file format also supports transparency. But, PNGs support variable transparency where users can control the degree to which an image is transparent. The downside to advanced transparency in PNGs is that not all older browsers will display the transparency the same.

PNGs also support image interlacing, similar to GIFs, but PNGs use two-dimensional interlacing, which makes them load twice as fast as GIF images. If you are interested in this interlacing technology, more information can be found on the web.

SVG
SVG (Scalable Vector Graphics) also deserve a mention. SVGs are a web standard based on XML that describe both static images and animations in two dimensions. The standard has actually been around for more than a decade, but with the recent emergence of HTML5 - SVG will be used more and more. For now, know that SVG allows you to create very high-quality graphics and animations that do not lose detail as their size increases. This means that with SVG you could create one graphic that looked great on a tiny mobile phone screen or on a 60-inch computer monitor.

When to Use What?

While there is no magic formula to determine which image type is best, there are some guidelines you can follow to make an informed decision.
First, if the image uses a wide range of colors, do not use the GIF format.
PNGs or JPGs are best for images with a wide color scheme.
JPGs are best suited for photographs or images containing photographic elements and fine details.

PNGs are better suited for images involving text, charts, screenshots and detailed illustrations.
When determining which file type to use, for an image that does not contain photographic elements - it is a good idea to keep in mind transparency and complexity. For an image that has a lot of colors or requires advanced variable transparency, PNG is the preferred file type. Generally you would use an image with transparency when you want to show the background color through your image for some reason (IE: You have a white background in the source image of your product, which you “mask” out in a paint program and save as a PNG image which is then used to show the subject of the image against the website background).
If the image has few colors and does not require any advanced alpha transparency effect, GIF is the way to go. Keep in mind that any use of transparency, or variable transparency, should be tested in multiple browsers to ensure that the effect is the same.

Finally, if you are ever in doubt which file type to use, a simple test exists that can help you narrow down the decision making process. In your image editor, export your image for each of the three file types and compare both file size and image quality between your exported images. This can help you quickly determine which file format gives you both the best picture quality and smallest file size.
Changing File Formats
If you don’t have access to a commercial design suite with advanced import and export options, there are plenty of free alternatives that allow you to save images in different formats. If you are a Windows user, Microsoft Paint will allow you quickly open up an image and save it as a different file type. This is a basic program and does not allow for any transparency in images and its compression system by no means rivals that of a commercial design suite, but it will do the trick in a pinch. For Mac users, there is an equivalent alternative to MS Paint called Paintbrush.

More advanced free alternatives that allow you to save images in different file types are GIMP, for both Windows and Mac OS; Pixelmator, exclusively for Mac OS; and Aviary, the web-based design suite.

Summary
It’s a good idea to familiarize yourself with JPG, GIF, and PNG and their various uses. These are the three primary image formats used on the web today. Knowing when to use which format will lead to better image quality and faster website load times.