Optimizing Your Images for the Web

Saving files for web can be pretty tricky. Trust me. I had to learn how to optimize my images when I began saving them for web. Coming from a background in print, switching to web orientated images isn’t quite as simple as you are lead to believe.

Saving images correctly can have a huge impact on how your clients interact with your site. When you think about it, the artwork and images that display on your site are what clients base their opinions on. Therefore, how your images are optimized can greatly impact your ecommerce conversion rate and your SEO. One of the biggest ways images can affect these two things is through load time. Compressing your files in the best way to increase load time. A 46KB file will load much more quickly than a 250KB file. Consider this, Google considers load time when they rank your site. If your site does not load efficiently, that one second delay can be a killer to your sales and SEO traffic! Also, visitors to your site tend to care way more about speed than anything else. A few seconds can make all of the difference! According to Strangeloop Networks, a one-second delay can decrease your sales by 7%, drop your page views by 11%, and decrease your overall customer satisfaction. Especially if this visitor is on their smart device. How many times have you exited out of an app because it refused to load? Mobile browsers are the largest beneficiaries of great image compression. Ignoring how your images load on mobile devices could drastically decrease your mobile ecommerce conversion rate. It’s not a market you can afford to lose out on when so much of the web is consumed daily on devices other than a desktop computer.

What Should You Be Doing?

So how do you save your images? For the most part, the only two image formats you should worry about are JPEG and PNG. If you have a bright and colorful photo that showcases your best flowers you will want to use JPEG. For images with flat color and items with transparency you will want to use PNG. Be careful, though…if you are trying to obtain a photorealistic images PNGs are usually a much higher quality image. The PNG file format is uncompressed and so the file size will be much larger than a JPEG of the same dimensions for a photo realistic image. Photoshop is my first step for compression. This application has a great ‘save for web’ function that can easily transform your image into an optimized machine. If you do not have Photoshop or if you are looking for additional compression on top of what you already get from ‘save for web’, there are many standalone options you can use. I can suggest tinyPNG, ImageOptim, and JPEGmini. Another important thing to mention about saving your files correctly, is to make sure that they are the correct dimensions for your needs. If you are trying to upload a feature area in FlowerManager, you want to make sure it is 735px × 365px. Trying to cram a 2000px image into this tiny space can affect how it looks on your site and the download speed. The same rings true for product photos, home specials, category headers, etc.

Optimizing your images for web can improve your site’s load time and make sure that your images are as beautiful as they can be. If you are not saving your images correctly, start doing so now. Your clients will thank you for it and you’ll reap the rewards!