Envira Gallery Blog
Digital Photography Tips, Tutorials and Resources
How to Save Images for Web and Speed Up Your Website
by Waseem Abbas on Jan 21, 2016
Is your website loading too slow? Often photographers don’t save images properly which can significantly slow down the website. In this article, we will show you how to save images for web and speed up your WordPress site.
Why Website Speed is Important?
Website speed is crucial for SEO. Google has said that faster websites rank higher in search results.
Aside from that, a case study by Strangeloop showed that a one-second delay causes 7% of sales, 11% fewer pageviews, and 16% decrease in customer satisfaction.
A large image can increase your load time by up to 5%. Let’s take a look at how you can optimize that.
What You Should Know About Image Optimization
If you want to optimize your images for the web, then you need to do two things before uploading images on your website.
First is to choose the right image format. We recommend that you use JPEG for large colorful photos, and PNG for small or transparent photos.
Second, you must use image compression for minimum possible size without sacrificing on quality.
While there are multiple photo editing software available, we’re going to use Photoshop in our example to display how to properly can save images for web.
How to Save Images For Web Using Photoshop
First thing you should do is open your image in Photoshop.
Next, you need to go to File and select Save for Web. It will open a popup where you will see different options for saving the image.
For Photoshop Creative Cloud users, you need to go to Files » Export and select Save for Web.
You can optimize the image by changing the size and format. We recommend using JPEG High. After choosing this option, you will notice the change in image quality.
This image was originally 752 KB which is now reduced to 56 KB. Go ahead and save the optimized image, so you can upload it on your website.
If you make this a habit, you will surely improve your website speed.
If you find Photoshop expensive, then you should check out these 9 free image optimization tools for image compression.
We hope this article has helped you learn how to save images and speed up your website. You may also want to check out our guide on how to easily edit images in WordPress.
If you like this article, then please follow us on Facebook and Twitter for more WordPress and photography tutorials.
Using WordPress and want to get Envira Gallery free?
Envira Gallery helps photographers create beautiful photo and video galleries in just a few clicks so that they can showcase and sell their work.
Many people does not realize how important it is to optimize their images first and foremost before uploading it to their site. This has been a very common problem for us who optimizes websites because we have to download the old images and then reupload it in the website.
Hey Vincent, you are absolutely right. This tutorial is written to spread the awareness of optimizing images before uploading them into WordPress. Feel free to share the love with others. 🙂
Hi. I have a website and i was not aware of the images optimization option using save for web. Yet i tried to make my images smaller in size and then uploaded them on website. So if an image on my mobile was of around 1 MB and i use paint brush to reduce its size to less than 100KB. when i programmed it using PHP , my website was really fast. However, with same pics when i make wordpress website, its considerably slow and with every new post I am adding, its getting more slower. Can u suggest any thing? Thanks
This is all true but… Recently, when wordpress creates it’s custom sizes on upload, it seems to but removing all compression of the JPG files reverting them to an umcompressed size. Then you need to use a plugin to re-optimize the pics again online.