Lesson 5

 To locate free resources that you can use for image editing  Determine the optimum image file size  Decide on the best image file format (jpeg or jpg, gif or png)  Export optimized images from Photoshop  Slice images in Photoshop

 Optimizing images for the web means preparing images for the web, in other words it is-  Knowing how to reducing a Raw camera file size and making it smaller  yet maintaining a sharp appearance for a great viewer experience in terms of looks and loading speed The key concept in this lesson is ‘Image Optimization’

Resolution vs Pixel size Resizing means making an image smaller. This can be achieved in several ways. Option 1 - To Resize is keep the aspect ratio while reducing the overall file size (weight) Option 2 – To crop is reduce pixel size but to cut away unwanted portion of an image happens-when-you-pick-a-lower-pixel-count-setting/ in-photography / Click to READ

 A monitor is like a metal mesh screen divided into inch squares. There are a set number of squares that span the width and height of any digital device such as a smart phone.  You can not push the squares closer together or make changes in the size of the squares.  There are 72 pixels per inch therefore, when preparing images for the web, the options are to crop unwanted parts or resize the entire image to smaller size.  Both options reduce the pixels amount. Resolution reviewed –

Images that have been cropped and resized loose pixels. The result is a blurry image. Web and Graphic designers understand the effect images have on human psyche. They spend valuable time sharpening images to make them attractive enough to keep viewers on the site for as long possible.

Sharpening an image can be achieved in any photo editing software. In Photoshop, the application is called Unsharp Mask Filter The technique has been around for many years in the film and print industries. In the pre-digital technique era they created a slightly out of focus positive transparency of the original negative. Therefore, instead of exposing the negative on photographic paper, it was instead exposed to another sheet of film to create a positive image. The new positive image and the original negative image get sandwiched together and since the shot was slightly out of focus, the edges in the combined image show a slight halo in the exact opposite color.

The other means with which images can be optimized is to save them as different file formats. There are 5 file formats that images can be save as but not all are suitable for the web – There are – Raw file format or.rff Joint photographic group or.jpg Portable network graphics or.png Tagged image file format or.tiff Graphic interchange format or.gif FILE FORMATS

And last but not least– Slicing an image Slicing an image is cutting up an image into smaller parts like a puzzle. The benefit of slicing are - You can create different links using different parts of that image. And The ability to save the different parts into different file format types.

Assignments to complete 1. Listen to video tutorial_L 5 2. Lesson project_ L5 3. Self-study_L 5 4. Review Qs_L 5