20 Jan 2013
Are your readers complaining about a slow site? If you have a fast web host, then you should seriously look into your web graphics, because you may have missed some WordPress SEO techniques there.
Can WordPress optimize images without changing their quality? Yes, you can do this by either using some free plug ins or tools that can optimize images for web before uploading them to your website.
If an image is not optimized for web, it is packed with extra bytes that can slowdown your site. And ignoring it could mean giving away precious positions in search results.
The Usual Scenario
Ok so, you have a superb content with exquisite images to illustrate your ideas, and your readers click your site link because you have a spicy title that is worth checking out. Content-wise, you are doing very well.
Then, at last one of your visitors got through, but later complained about slow loading, which gave you an impression that others might have lost patience and bounced out via the emergency “X” button.
Optimizing WordPress Images Using Plugins
The following plugins can compress existing web graphics with a remarkable fraction, without losing the image quality. This algorithm is called lossless data compression.
(1) EWWW Image Optimizer. This popular plugin is compatible with 3.5 Elvin. It’s rated 4.7 out of 5 stars with over 18,000 downloads.
(2) WP Smush.it. This plugin is compatible with version 3.3.2. The only drawback of this popular plugin, is that it won’t work if Yahoo’s service is down or overloaded. This plugin is rated 4.3 out of 5 stars with over 300,000 downloads.
(3) CW Image Optimizer. This plugin is compatible with version 3.3.2. It yields similar results with the first two plugins, although it will require extra Linux utilities to do the image compression. It’s rated 4.3 our of 5 stars with over 9,000 downloads.
NOTE: An image with a smaller size loads faster in browsers.
Optimizing Images for Web Using a Tool
Unless you want to upload an already optimized image from a picture market to your site without changing its dimensions, you’ll need a tool to optimize that image for web.
For illustration, we will use Adobe Fireworks, formerly Macromedia Fireworks, to optimize images for web. (Adobe Photoshop will have similar procedure.)
We aim to save a file in JPEG format because it looks better in a smaller file size, although JPEG is a lossy format, that’s why you need to carefully follow these steps to preserve its quality.
(1) After loading your image in Fireworks, preview it using File->Image Preview…
(2) In the Image Preview window, optimize image by choosing:
- JPEG format
- a quality between 92 and 100
- Progressive browser display (for loading images quickly from blurry to clear and not line by line).
(3) Export file using File->Export…, then choose Image Only.
Fireworks has an option to compress file, but you don’t need to use it because the plugins will take care of your web graphics automatically.
Things to Consider When Optimizing Images
(1) Unless you are using animation, choose PNG over GIF because GIF is not free, and PNG is an improved GIF.
(2) Although, PNG is a lossless format, its file size is relatively bigger than JPEG, and PNG can contain information you may not want to share with others but goes along with your image when people download it.
(3) If possible, don’t resize an image bigger than its original size. But if you really need to do this, use a tool, like SmillaEnlarger, to enlarge an image without distorting much of its quality.
→ Subscribe to Blog Via Email to receive updates directly to your email.
Disclosure: Pixmac is an excellent picture market, so we have no problem recommending it to you (and using our affiliate link).