What format is your logo - jpeg, gif, png, svg?

elcidofaguy

Active Member
My preference is png file format... The quality of the image is usually better versus jpeg, gif.... Here are some advantages:
  • Supports full transparency
  • Supports a full spectrum of colours
  • Completely lossless (doesn’t degrade over multiple saves like JPEG does)
  • “Progressive rendering”
 

ulterios

Well-Known Member
All the logo's that I have made are in the .png format for a few different reasons, the main one being that mine have all had transparent backgrounds and the .png format is widely used.
 

ProfMike

Active Member
I tend to use the png format, mainly because as previously stated the quality of the images and mainly because I want to be able to use the transparent backgrounds. This way the images blend into the site colors much better.
 

KeralMTG

Active Member
I tend to use the png format, mainly because as previously stated the quality of the images and mainly because I want to be able to use the transparent backgrounds. This way the images blend into the site colors much better.
I have some transparent images that are png and gif. Are png better quality than gif? I get many from free stock websites or creative common but you usually can not pick format. I did not know if one is better quality than other.
 

ProfMike

Active Member
There are many differences between the GIF and the PNG format. The reason that I use PNG is the lossless quality and the compression of a png file is 5 to 25% better than that of a GIF file.

Let's look at some specs on the two formats.

GIF (Graphics Interchange Format)
The GIF format is a format that uses a LZW algorithm for compression. This compression algorithm traces and keeps track of the colors to help in the reduction of the file size. The strongest point with using the GIF format is that the support for GIF across the major browsers is well documented and GIF has been the default choice for simple graphics across the web for many years. Although that is beginning to change.

PNG (Portable Network Graphics)
PNG is a extensible file format for the lossless, portable, well compressed storage of raster images. PNG has provided us a patent-free replacement for GIF and many of the TIFF images in use today. There was a patent held on the GIF LZW algorithm that limited how GIF images could be deployed when GIF was in the heights of its popularity, that patent has since expired. Indexed-color, grayscale, and truecolor images are supported, plus an optional alpha channel. Sample depths range from 1 to 16 bits.

For the Web, the PNG file format has three main advantages over GIF:
  • alpha channels (variable transparency),
  • cross-platform gamma correction (control of image brightness) and color correction
  • two-dimensional interlacing (a method of progressive display).
PNG also compresses better than GIF in almost every case (5% to 25% in typical cases).

So I hope that explains why, in my opinion png is a much better format for use on the web. Many of the points I have laid out here come directly from the W3C standards on web development.
 

KeralMTG

Active Member
There are many differences between the GIF and the PNG format. The reason that I use PNG is the lossless quality and the compression of a png file is 5 to 25% better than that of a GIF file.

Let's look at some specs on the two formats.

GIF (Graphics Interchange Format)
The GIF format is a format that uses a LZW algorithm for compression. This compression algorithm traces and keeps track of the colors to help in the reduction of the file size. The strongest point with using the GIF format is that the support for GIF across the major browsers is well documented and GIF has been the default choice for simple graphics across the web for many years. Although that is beginning to change.

PNG (Portable Network Graphics)
PNG is a extensible file format for the lossless, portable, well compressed storage of raster images. PNG has provided us a patent-free replacement for GIF and many of the TIFF images in use today. There was a patent held on the GIF LZW algorithm that limited how GIF images could be deployed when GIF was in the heights of its popularity, that patent has since expired. Indexed-color, grayscale, and truecolor images are supported, plus an optional alpha channel. Sample depths range from 1 to 16 bits.

For the Web, the PNG file format has three main advantages over GIF:
  • alpha channels (variable transparency),
  • cross-platform gamma correction (control of image brightness) and color correction
  • two-dimensional interlacing (a method of progressive display).
PNG also compresses better than GIF in almost every case (5% to 25% in typical cases).

So I hope that explains why, in my opinion png is a much better format for use on the web. Many of the points I have laid out here come directly from the W3C standards on web development.
Thanks for the information. So then it would be better to have a png image if I have any choice over gif?

I never did really look up about it and just thought they were the same since they seem to look the same when I have seen 2 of the same image but png and gif. I also never did hear about tiff.
 

ProfMike

Active Member
If given a choice I would always choose png formats.

No, they are not the same and in fact have very few technical aspects in common. The main reason for the development of the png format was that the GIF format used a patented LZW algorithm for compression. This made many developers nervous as there was no guarantee that the compression algorithm would remain license free.
 

ims

Looking for Stars...
Staff member
@ProfMike Seem you forgot to explain about JPG format. Really a useful post!

PNG also compresses better than GIF in almost every case (5% to 25% in typical cases).

I agree with you on this but how if compare between PNG and JPG, which one is better for website logo? which one compresses better?
 

ProfMike

Active Member
Ahhh..... but that was not a part of the question, the question was on png and gif.

If transparency is needed, which many times it is, then you stick with the png format. But if size is more of a concern then you go with jpg. JPG is one of the highest quality, based on the compression scheme, and smallest file size.
 
  • Like
Reactions: ims

Dean

Well-Known Member
Ahhh..... but that was not a part of the question, the question was on png and gif.

If transparency is needed, which many times it is, then you stick with the png format. But if size is more of a concern then you go with jpg. JPG is one of the highest quality, based on the compression scheme, and smallest file size.
Hi Mike. Since you are on the subject, I have a question for you. I have done a little looking in the past but couldn't find a clear answer.

If transparency is not needed for something, say like a logo on a white background, would their be any advantage of using a .png over a .jpg other than size of the image? I'm just curious if the two formats were basically about the same size file, would one have an advantage over the other or is it just a preference thing?

I had hear somewhere that a .png is better for mobile quality, but I am not sure how much to trust the source of the information. I have many things I think of when considering image usage on my sites and didn't know if one or the other had any specific advantages over the other.

Any insight and information will be appreciated, especially since I know you are very knowledgeable in these fields and I have come to trust what information you share.

Cheers, Dean
 
I use Jpeg, I think GIF is suitable for banners
 

KeralMTG

Active Member
If given a choice I would always choose png formats.

No, they are not the same and in fact have very few technical aspects in common. The main reason for the development of the png format was that the GIF format used a patented LZW algorithm for compression. This made many developers nervous as there was no guarantee that the compression algorithm would remain license free.
Thanks, I did not know there was really any difference with them. So if I have some good images that I am or will use for my blog should I convert the gif images to png images?
 

ProfMike

Active Member
Dean,

If everything is equal and the image quality is comparable I would use the jpg format. The compression will be better. On small images the difference in size is not that noticeable without transparency but every little bit helps when your page loading is being considered. I normally stick with png because the images I use are usually complex and when dealing with business sites and also the colors for logos and trademarks has to be exact.

I had not heard that comment about mobile devices but I will do some research and testing. Looking at the comment in a neutral light and understanding the technical specifications on each format it kind of makes sense as png files tend to scale down and up better than jpg. But that statement is made understanding the technical format and not based on any true testing. It is an interesting question.

I will do some additional research and let you know what I find out.
 

Dean

Well-Known Member
Thanks Mike, I really appreciate the information.

I normally stick with png because the images I use are usually complex and when dealing with business sites and also the colors for logos and trademarks has to be exact.
So then a png is better to be more accurate for colors if you want them to retain their accuracy? I saw something regarding color quality, last year I think, but I can't remember exactly what the details were or where I saw it. I do tend to see a lot more of the newer images used around the web being in the png format.

I had not heard that comment about mobile devices but I will do some research and testing. Looking at the comment in a neutral light and understanding the technical specifications on each format it kind of makes sense as png files tend to scale down and up better than jpg.
A couple of years ago when I started thinking about making my website more mobile friendly I had read something about png's being better for mobile device viewing than jpg, which was one that I was using a majority of. That's one reason why I started using png's whenever I can. I don't remember all the details but I saw similar information from a few different resources. I don't know how accurate that is but frm the details I saw, it seemed like it would be accurate.

Thanks again for your input and information, it's always valued!

Cheers, Dean
 

Sudipta Sen

Member
I have been curious what format you are using for your logo - jpeg, gif, png, svg?

and why you chose it?

Normally logos are made in vector format. They are based on images made up of vectors (a kind of mathematical lines). This makes the logos scalable. They can easily be sent, whilst maintaining a very small file size. But they can be blown up to such an extent that they can cover the side of a building. Vector logos are built in specialist programs, such as Adobe Illustrator. They have filename extensions like .
 

tedzk26

New Member
The biggest difference is that a PNG file is lossless, while a JPEG file uses lossy compression. So, a JPEG file should be smaller, but the quality will be worse.
 
Top