was successfully added to your cart.

Optimize Images for the Web in Photoshop

By December 16, 2013Quick Tips, Tips & Tricks

Learn how to optimize images for web with this quick tutorial

If you run an online store or blog image optimization is very important part of building a successful online presence. Reducing site load time benefits you and your visitors and encourage Google to index your images to their image directory. In this quick tutorial i will show you how to optimize your images and reduce the image size significantly.

Tutorial Details and Resources

Difficulty: Beginner

Apps Used: Adobe Photoshop

Estimated Completion Time: 5′ Minutes

Resources: –

Step 1 > Open Image in Photoshop

Open the image you want to optimize by drag and dropping to Photoshop or go to File > Open and browse the image you want to optimize. If you don’t want to edit the colors or crop the image you are ready for the final step.

 

Optimize Images in Photoshop

Step 2 > Optimize the Image

Go to File > Save for Web or press (Alt + Shift + Ctrl + S). In the new window use the 2-Up preview method and make sure the “Optimized” box is checked. As you can see even with 100% maximum quality optimized file is only 850kb, 100% less than the origianial image (1.93mb)! Huge difference compared to the original and the best thing is that you can’t see any differences in overall image quality. You can still lower the quality less than 100 and the file size will shrink even more. Next, press “Save” to save your optimized image.

 

Optimize images for web in photoshop step 3

Verdict

With this method you can reduce the overall size of your images and make your site load faster. To optimize even further your images make sure file names have something to say to search engines. Avoid using numbers (133.jpg) or default file names from digital cameras like (IMG_12_20014). Describe your images with useful keywords for better SEO (Search Engine Optimiazation.

Graphic Designer Bundle

Download collection of icons, backgrounds, vectors & other design elements

Download Now

Author: Dreamstale

We provide free and premium web resources for everyone. Download our graphic design elements, icons, backgrounds, vectors and everything else. Stay tuned for more freebies, Photoshop tutorials and inspirational articles.

Never Miss Freebies & Deals

We promise not to spam you, just the good stuff!
SUBSCRIBE
close-link