Tools, file formats and colours in digital media
The programmes formats and basic concepts you need to know to deliver the right product in the right quality
A good product can be ruined by the wrong format or wrong resolution. So the technique behind files colours and programmes is not an appendix to the trade — it is part of the craft. Here are the basic concepts you use every day.
§Raster graphics and vector graphics
There are two basic ways to save graphics. Raster graphics (also called pixel graphics) is built of a grid of coloured dots — pixels. Photos are raster graphics. If you enlarge too much the image becomes blurry and blocky. Vector graphics instead describes shapes with mathematics — lines curves and surfaces — and can be scaled up and down without losing sharpness. Logos and icons are made as vector graphics precisely because they need to be used both on a business card and on a building.
§Resolution and image size
Resolution tells how many pixels an image contains. Print typically requires a high resolution so the dots are not visible, while screens manage with lower. An image that looks good on a website can therefore be far too coarse for print in large size. You can always make an image smaller without losing quality, but you cannot conjure up details that were never there — that's why you'd rather shoot in too high a resolution than too low.
§File formats — choose by purpose
Each file format has a purpose. Choose based on where the file will be used, not out of habit.
| Format | Type | Usually used for |
|---|---|---|
| JPEG | Pixel, compressed | Photos for web and sharing where small file size counts heavily |
| PNG | Pixel, can have transparency | Graphics for web with sharp edges or transparent background |
| GIF | Pixel, few colours, animation | Small animations and simple graphics |
| SVG | Vector | Logos and icons for web that need to scale sharply |
| Side/dokument | Delivery to print and shareable documents with fixed layout | |
| TIFF | Pixel, high quality | Images for professional printing without compression loss |
§RGB and CMYK — two worlds of colors
Screens mix light and use the RGB colour space (red, green, blue). Print mixes ink and uses CMYK (cyan, magenta, yellow, black). They cannot show exactly the same colours: a bright, glowing colour on screen may look dull in print. Therefore, you set up your document in the colour space it should be delivered in — RGB for screen and web, CMYK for print — and don't be surprised when a colour shifts during conversion.
§Programs and equipment
In daily work you work in programs for image processing, vector graphics, page layout, video and web. In addition to equipment: a calibrated screen so colours are displayed correctly, and often a graphics tablet for precise work. Backup is part of the equipment, not a luxury — projects that only exist in one place are lost sooner or later. A calibrated screen and safe backup are two of the cheapest insurances you can give yourself.
§Font types and licenses
Fonts are also tools, and they are often protected by licenses. You may not use any font commercially just because it is on the machine. Make sure that the fonts a project uses are allowed for the purpose and deliver them if the recipient should be able to open the file properly. The same rule applies to images: only use material you are allowed to use.
“The right format in the right resolution and the right color space is the difference between a product that works and one that must be remade.”
— Professional view on technique in digital media.