Image formats
Whether you are inserting an image within the text or as a complete page, you have different options for the image formats. Which one to pick depends on a number of factors.
Our advice is to use the following:
- Graphs/logos/infographics/complete pages:
- Base: SVG (with outlined text) or PNG
- PDF: PDF (or SVG if design doesn't include shadows/transparency)
- Photos:
- Base: JPEG
- PDF: Possibly higher resolution JPEG
See the descriptions below for an explanation per format.
PNG
Pixel-based (raster) format. Can be used as "Base" variant for images, ending up in the ESEF report and on the website (if applicable). Best raster image for design elements, logo's, graphs, etc.
JPG
Similar to PNG option, can be used as "Base" so that this file will be used for ESEF and possibly website. Best raster image for photos.
SVG
Vector-based format. This means that text and shapes will look good on any zoom level, and not be pixelated. The file size will generally also be much smaller compared to a raster format (except for photos). Can be used both as base variant for ESEF/Website and as PDF variant to be used in the PDF version of the report.
Be careful in usage of this format, there are some aspects to consider for proper usage:
- For web-based outputs (including ESEF): be aware that fonts are usually not embedded in the SVG. This means that if you are using non-standard fonts, the reader of your report may not see the same font as in the design. A solution is to convert any type to outline when exporting to SVG.
- For print/pdf outputs: be aware that shadows and other forms of transparency may cause issues. If you encounter this, using a PDF might be a more suitable option.
Vector-based format, best option for getting designed elements into your PDF report reliably. Cannot be used as "Base" variant, as it is not suitable for use in ESEF and website.
Image recommendations
An image in the image library is actually a set of variants of the image. There is an instance for each output channel, having its own requirements.
|
|
(2) PDF - print quality |
|
(3) PDF - download quality |
|
(5) website - mobile |
|
Background/full page image |
Size A4 + 3 mm bleed ('snijranden') without crop marks |