Optimize your Website Images for Free: SEO requires that your website pictures be optimized
Optimize your Images for Free: SEO requires that your website pictures be optimized
You probably know this already, but your website images MUST be optimized before uploading. “Optimizing” is the practice of getting your pictures down to the optimal file size. In other words, your website images should not go from digital camera to website page without first being reduced in size—both in file volume and image dimensions. Not only will your un-optimized (often at 5MB or greater!) picture take forever to download into the viewer’s device (be it desktop or handheld) but you will likely compromise your search engine position. However, if you don’t have the tools or knowledge to optimize your website images, hang in there. We’ll be covering that too.
The Importance of Image Optimization: The Basics
Enhancing User Experience: Images that load quickly are expected when a user visits your website. Nothing is more frustrating than pictures taking too long to materialize. Optimizing them ensures they load quickly while making for a better experience. Also, quick-loading images help to ensure the visitor does not lose patience and leave your page.
Boosting SEO Rankings: Google, and other search engines, prioritize websites that load quickly. And higher rankings mean more visibility, which leads to more traffic to your site.
Types of Image Optimization
Compression: To what degree you should compress your images is important. Although this usually comes with practice, there are some basic guidelines to follow.
- If there is lettering, is it still clear and solid?
- Check the background: look for bit-mapping (un-smooth transitions).
- Is the color still satisfactory?
In Photoshop, the “save to web” option usually takes much of the guesswork out of optimization. It uses a scale of 1-100, (the 100 setting being way too big–unoptimized). At 20, you’re likely to see visible degradation of your image—but not always. Nearly all the photo optimization tools will give you a before-after view, so balance file size with the sharpest image possible.
For example, if you have an image that you wish to fill half the width of your (desktop monitor) viewing area, approximately 850 (w) x600 (h) pixels in size, you may find that the 30 setting is about right. This will likely crunch your original down to about 60kb in file size—depending on how much color and complexity is composed within the image.
File Format
Different image formats serve various purposes. JPEG (.jpg) is the default for photographs, while PNG (.png) is better for images requiring transparency—but produces larger file sizes. GIF (.gif) is usually the best format for graphics. WebP is an emerging format offering excellent compression and quality, usually auto-created from websites such as ShortPixel Image Optimizer.
Resizing Images: As stated above, uploading images that are larger than necessary can slow down your page’s performance. Resizing images to fit their display dimensions on your site can significantly reduce load times. Make sure to scale images according to where they will be used on your site.
Enhanced Mobile Experience
With mobile browsing being more popular than desktop, ensuring that your images are optimized (responsive) for various screen sizes is critical. Responsive images adapt to different devices, providing a seamless experience for all users.
Tools for Image Optimization
The big dog in photo optimization and enhancement is Adobe Photoshop. However, it’s not a cheap tool and learning how to use its applications can take a long time. Moreover, for the purpose of website photo optimization, you can easily conquer the task with one of the free online optimization services.
Free Online Compressors: Optimize your images for free
Several online tools will allow you to compress and optimize images for free—without sacrificing quality. They are generally user-friendly and intuitive.
The quickest and easiest route to optimized images may be Compressjpg.com and Compresspng.com (which are the same online source). All you need to do is toggle your image format choice from the navigation options, drag your image into the optimization area, and it will figure out the compression for you.
The Alternatives to Photoshop
Although saying “alternative” varies with your needs, here are some more free online photo editors/optimizers to review. (In no particular order.)
Photopea: (web-based) Photopea runs in your browser, so you don’t need to install any software, making it accessible from any device. It has a familiar interface that closely resembles Photoshop, making it easy for users to transition without a steep learning curve. Photopea is free, but a more robust version is available when you opt for the premium option. Photopea also supports PSD Files.
Web Resizer: (web-based) Web Resizer is similar to Photopea, but may not optimize as cleanly as the rest in this list. But it is a very easy tool to use.
GIMP: (installable app): Open-source GIMP has been around since 1995 and remains well respected in the image manipulation arena. The rewards can be plentiful for those who wish to spend some time with this robust program. However, optimization is fairly simple with GIMP.
Photoshop Express (installable app): This is basically Photoshop-lite. It’s user-friendly and designed with simplicity in mind. You get many color-management options paid Photoshop offers but without the fine-tuning tools.
To summarize, optimizing your website images does not have to be a daunting, expensive, adventure. But it is a vital part of website maintenance. And with the free optimization tools listed above, you can take care of your optimization tasks quickly and without expense. [BTW, the above banner image has been optimized to 42KB (from the original 4.52MB).]