11 Replies Latest reply on Jul 27, 2007 8:24 AM by theboyfromthefens

    PNG or GIF?

      Pretty sure this is a simple one - the PNG version of the company logo I'm using is around 250Kb, whereas the GIF file is about 20Kb.

      I keep reading in various places that using PNG for graphics files is preferable to GIF. Certainly so for designing the files, but using a GIF version is better for the site itself, given its smaller file size?

      Thanks in advance, Matt.
        • 1. Re: PNG or GIF?
          Level 7
          Make an 8-bit PNG of the logo. It'll be 10-15% smaller than the GIF.

          Your readings have not included the bit-depth of the PNG - there is a huge
          difference between 8-bit and 24-bit images!

          --
          Murray --- ICQ 71997575
          Adobe Community Expert
          (If you *MUST* email me, don't LAUGH when you do so!)
          ==================
          http://www.dreamweavermx-templates.com - Template Triage!
          http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
          http://www.dwfaq.com - DW FAQs, Tutorials & Resources
          http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
          ==================


          "theboyfromthefens" <webforumsuser@macromedia.com> wrote in message
          news:f8a7k2$8t4$1@forums.macromedia.com...
          > Pretty sure this is a simple one - the PNG version of the company logo I'm
          > using is around 250Kb, whereas the GIF file is about 20Kb.
          >
          > I keep reading in various places that using PNG for graphics files is
          > preferable to GIF. Certainly so for designing the files, but using a GIF
          > version is better for the site itself, given its smaller file size?
          >
          > Thanks in advance, Matt.
          >


          • 2. Re: PNG or GIF?
            Level 7
            Are you using Fireworks to create the logo? The native file format in
            Fireworks (PNG) is a different version of PNG than what you'd use on the
            web. Have you gone through the optimization process to optimize the PNG
            for the web?

            Also - PNG is not necessarily preferred over GIF. Older browsers don't
            support PNG at all. In fact a few old browsers crash upon loading a PNG.
            (So what. These browsers are ancient. Still - you've got to know your
            target audience.) You'd probably optimize as either PNG-8 or PNG-24.
            PNG-8 uses a 256 color palette similar to GIF. PNG-24 supports millions
            of colors like JPG, but is fully supported by fewer browsers.

            More info at http://www.w3.org/QA/Tips/png-gif with links to even more info.


            --
            Alec
            Adobe Community Expert
            • 3. Re: PNG or GIF?
              Level 7
              > Also - PNG is not necessarily preferred over GIF. Older browsers don't
              > support PNG at all.

              I think all browsers have supported 8-bit PNG images, Alec. It's the
              24/32-bit ones that have been trouble.

              > PNG-24 supports millions of colors like JPG, but is fully supported by
              > fewer browsers.

              It's supported by all modern browsers *and* IE7. The link you give is a
              little misleading since it doesn't specify how support varied depending on
              the bit-depth.

              --
              Murray --- ICQ 71997575
              Adobe Community Expert
              (If you *MUST* email me, don't LAUGH when you do so!)
              ==================
              http://www.dreamweavermx-templates.com - Template Triage!
              http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
              http://www.dwfaq.com - DW FAQs, Tutorials & Resources
              http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
              ==================


              "Alec Fehl" <jacalart@hotmail.com> wrote in message
              news:f8a81a$8d3$1@forums.macromedia.com...
              > Are you using Fireworks to create the logo? The native file format in
              > Fireworks (PNG) is a different version of PNG than what you'd use on the
              > web. Have you gone through the optimization process to optimize the PNG
              > for the web?
              >
              > Also - PNG is not necessarily preferred over GIF. Older browsers don't
              > support PNG at all. In fact a few old browsers crash upon loading a PNG.
              > (So what. These browsers are ancient. Still - you've got to know your
              > target audience.) You'd probably optimize as either PNG-8 or PNG-24. PNG-8
              > uses a 256 color palette similar to GIF. PNG-24 supports millions of
              > colors like JPG, but is fully supported by fewer browsers.
              >
              > More info at http://www.w3.org/QA/Tips/png-gif with links to even more
              > info.
              >
              >
              > --
              > Alec
              > Adobe Community Expert


              • 4. Re: PNG or GIF?
                Level 7
                IE3 doesn't support PNG8 at all, and very early NS browsers crash. Like
                I said - truly ancient. But who's the target audience? If they are
                students in a 3rd world country with a "$100 laptop", they may be using
                IE3! Know your target audience. 99% NOT even an issue, but good to know
                anyway.

                Yes - PNG24 is supported by all modern browsers - but not its alpha
                transparency. Lots of folks still using IE6.

                --
                Alec
                Adobe Community Expert
                • 5. Re: PNG or GIF?
                  Level 7
                  > transparency. Lots of folks still using IE6.

                  but you can fix it for IE6...


                  • 6. Re: PNG or GIF?
                    Level 7
                    .oO(Murray *ACE*)

                    >Make an 8-bit PNG of the logo. It'll be 10-15% smaller than the GIF.

                    It always depends on the image itself. Sometimes a TrueColor PNG can be
                    smaller than a palette-based, simply because you don't have to store the
                    color palette.

                    Micha
                    • 7. Re: PNG or GIF?
                      Level 7
                      .oO(Alec Fehl)

                      >IE3 doesn't support PNG8 at all, and very early NS browsers crash. Like
                      >I said - truly ancient. But who's the target audience? If they are
                      >students in a 3rd world country with a "$100 laptop", they may be using
                      >IE3!

                      Quite true, but if such dinosaurs are an issue, I would probably use
                      server-side techniques like content negotiation to deliver a "safe" GIF
                      or JPEG to these old browsers and a modern PNG to recent ones.

                      >Know your target audience. 99% NOT even an issue, but good to know
                      >anyway.

                      Agreed.

                      >Yes - PNG24 is supported by all modern browsers - but not its alpha
                      >transparency. Lots of folks still using IE6.

                      There are workarounds. Or maybe do the same as above - let the server
                      decide. IE 6 doesn't mention image/png in its ACCEPT header - this can
                      be used.

                      Micha
                      • 8. Re: PNG or GIF?
                        Level 7
                        It would have to be a special image (two color?), but yeah....

                        --
                        Murray --- ICQ 71997575
                        Adobe Community Expert
                        (If you *MUST* email me, don't LAUGH when you do so!)
                        ==================
                        http://www.dreamweavermx-templates.com - Template Triage!
                        http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
                        http://www.dwfaq.com - DW FAQs, Tutorials & Resources
                        http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
                        ==================


                        "Michael Fesser" <netizen@gmx.de> wrote in message
                        news:1ckha39oqesq3ve76btdo8rbak75mg5jng@4ax.com...
                        > .oO(Murray *ACE*)
                        >
                        >>Make an 8-bit PNG of the logo. It'll be 10-15% smaller than the GIF.
                        >
                        > It always depends on the image itself. Sometimes a TrueColor PNG can be
                        > smaller than a palette-based, simply because you don't have to store the
                        > color palette.
                        >
                        > Micha


                        • 9. Re: PNG or GIF?
                          Level 7
                          .oO(Murray *ACE*)

                          >It would have to be a special image (two color?), but yeah....

                          Not necessarily. Sometimes it's quite surprising when I play around with
                          the PNG export options in Paint Shop Pro to get the smallest possible
                          file size with nearly equal quality: Sometimes the (reduced) palette
                          wins, sometimes TrueColor, sometimes even a reduced "web-safe" colored
                          image (OK, very rarely). There are a lot of factors that play a role ...

                          Micha
                          • 10. Re: PNG or GIF?
                            Level 7
                            The PNG compression algorithm constantly surprises me, frankly.... It's SO
                            good.

                            --
                            Murray --- ICQ 71997575
                            Adobe Community Expert
                            (If you *MUST* email me, don't LAUGH when you do so!)
                            ==================
                            http://www.dreamweavermx-templates.com - Template Triage!
                            http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
                            http://www.dwfaq.com - DW FAQs, Tutorials & Resources
                            http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
                            ==================


                            "Michael Fesser" <netizen@gmx.de> wrote in message
                            news:j9oha35u45rbn26eu7odut82g2il4mqs1g@4ax.com...
                            > .oO(Murray *ACE*)
                            >
                            >>It would have to be a special image (two color?), but yeah....
                            >
                            > Not necessarily. Sometimes it's quite surprising when I play around with
                            > the PNG export options in Paint Shop Pro to get the smallest possible
                            > file size with nearly equal quality: Sometimes the (reduced) palette
                            > wins, sometimes TrueColor, sometimes even a reduced "web-safe" colored
                            > image (OK, very rarely). There are a lot of factors that play a role ...
                            >
                            > Micha


                            • 11. Re: PNG or GIF?
                              Level 1
                              Thanks everyone. I've quite simply ignored the 'optimise for web' save process, haven't I....

                              I'll pay more attention to the detail in future.

                              I can see from my analytics that my audience is without exception ie6+ or recent firefox, it's predominantly a young professional lot.

                              Thanks again. Matt.