Twitter
Email
RSSSpeed Up Your Site: Image Formats
On the first part of this series we discussed how to optimize images in order to reduce their size and consequent load time (click here to read). Apart from optimizing the images it is also important to choose the right format. You should use the GIF, PNG and JPEG formats based on the type of the image and on size constraints of your website. Below you will some guidelines for each format:
JPEG: Stands for Joint Photographic Experts Group. This format was created for photographs and fine art-work. You should use JPEG images whenever you are displaying a photo or a true-color image. Notice that if you are using compression to reduce the file size you should use a 50% compression rate for optimal results.
GIF: Stands for Graphics Interchange Format. The GIF format is connected with the history of the Internet, mainly because of its small size. JPEG images support millions of colors while GIF ones will integrate a maximum of 256 colors. You should use this format for flat-color images like logos, buttons or text images. GIF is also the format of choice for animated images.
PNG: Stands for Portable Network Graphics. The PNG format was created specifically for the Internet, with the objective of replacing GIF images. The main advantage of PNG images over GIF ones is that they support 24-bit colors and alpha transparency. That said not all the browsers recognize some of its features. You should use the PNG format for simple images that require more than 256 colors.
Speed Up Your Site Series:
- Optimize Images
- Image Formats
- Optimze Your CSS
- Use a Slash on Your Links
- Use the Height and Width Tags
- Reduce the HTTP Requests
Got Your Free eBook?
- Subscribe to the Daily Blog Tips newsletter and you will be able to download the "Make Money Blogging" eBook for free.
- You will also receive tips to improve your blog, strategies to make money and useful resources from around the web.
Related Articles
Subscribe
24 Responses to “Speed Up Your Site: Image Formats”
Got something to say?
Sponsors
Recent Articles
- Bloggers These Days…
- What Is Smart Pricing on Google AdWords?
- Find Brandable Domain Names with Wordoid.com
- Blogging Lessons From TechCrunch and Mashable
- 22 Ways To Find Advertisers For Your Website
- The Marketplace for Websites is Heating Up
- How To Increase Your Blog Traffic With Article Marketing
- Got Blogging Related Questions? Ask Away!
- Business Idea: Copyright Protection For Web Publishers
- Blogging Dynamite: The Power of Connections
- Ever Considered Launching a Membership Site?
- 5 Tips To Get The Most Out of Your 99Designs.com Contest
- Do I Need to Register A Business To Make Money With My Website?
- Because 10,000 People Can’t Be Wrong
- Download Google’s SEO Report Card
Actually you should state that PNG is the preferred format over GIF. It offers better compression than GIF. JPEG images are best for photos because there is a lot of color then the JPEG algorithm works best.
When you have lesser number of colors you choose a PNG format, the reason is because each color information and the specific pixel is stored in the file.
Ajay, I agree that PNG is preferred over GIF for simple images like logos or buttons that have complex or many colors. If you are working with a flat-color image that uses less than 256 colors, however, I think that the GIF compression will offer a better quality-size relationship.
Thats was interesting, and very useful, thanks.
Interesting comparison.
I have also noticed throughout the years that different software can produce different formats in lower sized image formats. So I think you have to try different things like IrfanView to see which program produces best quality and size for which formats.
Also, this is a bit off-topic, but what is your and everyone’s view on the following link. It takes about Microsoft creating its own new image format:
http://www.betanews.com/articl.....1148594312
Sorry for the long and external link.
irfan View is a good software for converting and compressing images.
I use jpeg mostly. GIF for transparent images. And png when other two formats doesnt work (jpeg often messes it up if the image has lots of text in it).
Very insightful posts here, thank you so much for taking the time to put these together.
rihanna stop the music
Anyway, occasionallyleaning down into the sexy amanda bynes states with one had.
use png formation
i see some spams in the comment !!
thank you for the tip, i will use the GIFs