Images by Computer > Images for Printing + Web > Web Image Formats > Manipulating Images for Web
Images by Computer
- Pixel is the smallest unit of image information which can be controlled by a computer
- Digital Image ia s sequence of pixels in a rectangle disposition
- Image Dimension is measured in Width x Height pixels
- Color System: each pixel has got a colour from a maximum range of any of these Color Systems:
- BLACK AND WHITE: uses 2 colours = 1 bit
- SCALE OF GREYS: uses 256 greys = 8 bits (1 Byte)
- RGB: uses 256 colours per channel = 24 bits (3 Bytes, one per channel: Red, Green, Blue)
- CMYK: uses 256 colours per channel = 32 bits (4 Bytes, one per channel: Cyan, Magenta, Yellow, blacK)
- Image Resolution is the number of pixels per pysical size, the most common used is DPI (dot per inch)
- Color Profile define a color mapping of a particular device, and has to be carried on during all the image manipulation process to preserve consistence in color representation. Use sRGB color profile, as it is a standard for many devices
Images for Printing + Web
- Printing
- It uses ink, so the color system is CMYK
- Resolution is only important for printing, and a good resolution for printing is 300 dpi
- Web
- it uses light, so the color system is RGB
- Resolution is not relevant for web images, as all images are displayed in the screen at 72 dpi
Web Image Formats
- JPG: Losy data compression (loosing image quality) | Any color system
- GIF: Lossless data compression (no loosing image quality) | Only 256 colours | Transparencies | Animation
- PSD: Lossless data compression (no loosing image quality) | Any color system | Transparencies | Layers
Manipulating Images for Web: Use Photoshop
- Color System: in Photosop: Image > Mode
- If the image is in full color, verify that the image mode is RGB (never leave CMYK as this is for printing)
- If the image is in grey scale, verify that the image mode is GRAY SCALE (the file size is much smaller than RGB)
- Image Resolution: This is not relevant for web, as on the screen that number is ignored and 72 dpi is used
- Resampling pixel dimensions: In Photosop: Image > Image Size
- Downsampling: Reduce width and height pixels > Allowed > But you lose those pixels forever
- Upsampling: Increase width and height pixels > Forbidden > Or you'll get a blur image, as new pixels are created
- Save Image: As PSD, never as JPG or GIF (as we lose quality or colours) >>> THIS IS YOUR MASTER
- Save Image for Web: If it is a photo: As JPG or If it is a graphic: As GIF >>> THIS IS YOUR IMAGE FOR WEB
Images Utilities
