Image format recommendations
DAM can store any file type (also non images) but storing images is a key function of DAM since it acts as an image provider for webshops.
In the role of image provider, DAM transforms images in regard to size, format etc. to fit in a specific part of the webshop (for example product list, product page, etc.). These transformations require both memory and CPU time on the server that runs it, so naturally the less work that needs to be done, the quicker the images can be served and more images can be transformed within a time unit.
The logical consequences of this as a rule of thumb are:
Don't store images that are larger (height x width) than necessary for the purpose.
Don't store images in formats that are more complex (ai, psd vs. jpeg, png etc.) than necessary for the purpose.
DAM is intended to store files in original formats based on which the transformed versions are automatically created as requested by the webshop.
These original files might be large images in high resolution, and that's fine, however the point is you should still be mindful about the format and size of the original files that are uploaded in DAM. For example in case the orignal file is a psd file and it's transformed to a JPEG for the webshop, that's fine, however if the original file is already a JPEG in size 10000 x 5000 and it's transformed to another JPEG in size 100 x 50 it's seems that the original image is unnecessarily large and you should consider storing the image in a smaller size.
Choosing which formats to store
Based on the above, you should be mindful about the kind of images that are stored in DAM. This table outlines our recommentations.
| File | Program | Typical use cases | Websafe type (to get full benefit in webshop) |
|---|---|---|---|
| JPEG | From camera | Images taken with a camera - without layers or transparency | Jpg |
| GIF | Photoshop -- animation | Animation with more images or layers | Gif |
| PNG | Photoshop (graphics with transparency) | Icons, splashes | Png |
| TIFF | Camera | Raw format from camera | Png |
| E.g. from Adobe Reader | Primarily used for textbased magazines -- not often used on webshops | Png | |
| EPS | Vector graphics | Logos where the layers are flattened, great for scaling and keeps porposions | Png |
| SWF | Flash file | Rarely used, not many browers support | Png |
| AI | Illustrator | Working-file for logos | Png |
| PSD | Photoshop | Banners, big graphics with layers and big design files | Png |
| SVG | Illustrator (Vector graphics) | Logos and graphics -- makes it easy to change colors of the graphic | SVG (if enabled) / Png |
| BMP | \ | Rarely used | Jpg |
Websafe conversion
In the table above the column "Websafe type (...)" illustrates how the various orignal formats are converted to a format that is compatible with web browsers. The general conversion rules are as follows:
- The original file format supports transparency --> png
- The original file format does not support transparency --> jpeg
- The original file contains animation --> gif
How to check output quality
If you're ever in doubt about whether an image wil look good after a certain transformation such as a resize, you can verify it manually.
- Go to the original image in DAM
- Go to transformation tab
- Choose transformation(s) (size, output format, predefined setting, etc.)
- Click Download file with the settings defined above