Home Computer Applications adobe photoshop Convert Normal Image To Website Friendly Image In Adobe Photoshop

Convert Normal Image To Website Friendly Image In Adobe Photoshop


Website Friendly or Web Optimized Image

A website friendly image is also know as web safe image . These type of images do good impact on webpage loading time. A fast loading webpage is important in SEO . You can convert a normal image to website friendly image in adobe Photoshop with the following steps .

Convert Normal image to Optimized

Open abode Photoshop and select the image which you want to convert . To download sample image right click on the link and select “save link as” to save image on desktop. After download image open it in adobe Photoshop .

Look At Image Size and Dimensions

In top menu go to “Image” and then go to image size . See the image size in this window . In Pixel dimension  “width” is 2000 pixel and and image “height” is 1125 pixel  . In Document size “width” is 14.51 cm , “Height” is 8.16 cm and image resolution is 350 pixel . Image size is 1.15 MB .


width and dimensions before optimization
width and dimensions before optimization


Now notice that 1.15 MB image is not website friendly . When you place this size image on webpage ,page loading speed time increased . To reduce image size and make it website friendly follow these steps .

Check image loading time

Go back to main menu then go to “File” . Click on “Save for web and devices” .Look at the lower left corner of this window . You can see image properties here .



In this image see the highlighted area . 215 sec@56.6 kbps is the image loading time . It means this image take 215 sec to load . Which is too much time .

To optimize image follow these steps .

In “Image Size” fill maximum “width” 600 pixel . This is because normal screen display size for webpage is maximum 600 pixels .

Set the image “Quality” to 68 . You can set it anywhere within 60-100 . 60 means miner low quality and 100 in full quality . In some type of image you have no need to full quality such as blog images .

  • Image type is “jpeg
  • Check the box “Optimized” .
  • Image Quality to “Bicubic Sharpner” .


web friendly image
web friendly image

Check image loading time again

After do all change look at again on the lower right corner for check the image loading time . Now you can see the image size is 68.61 K and loading time of image is 13 sec @ 56.6kbps . It means when you use this image of web page , image loading time is reduced 20 times .

With this way you can create a web optimized image for your website . Image optimization is slightly different for different type of images such as logo image, favicon image , image for post , image of product , thumbnails , background image etc.