4 Replies Latest reply on Sep 14, 2007 11:14 AM by Newsgroup_User

    How do I chose the appropriate graphic format?

    TSanchez012 Level 1
      How do I choose betweent he different graphic formats to use on the web? Is anyone better than the other?

      Thanks
        • 1. Re: How do I chose the appropriate graphic format?
          Level 7
          Photo ---> JPG
          Line art/image with large blocks of color ---> PNG/GIF
          Image with texture/shadows ---> JPG

          That's about it.

          --
          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
          ==================


          "TSanchez012" <webforumsuser@macromedia.com> wrote in message
          news:fce597$pht$1@forums.macromedia.com...
          > How do I choose betweent he different graphic formats to use on the web?
          > Is anyone better than the other?
          >
          > Thanks


          • 2. Re: How do I chose the appropriate graphic format?
            Level 7
            On Fri, 14 Sep 2007 18:19:19 +0400, TSanchez012
            <webforumsuser@macromedia.com> wrote:

            > How do I choose betweent he different graphic formats to use on the web?
            > Is anyone better than the other?

            Just a little more prolific copy of what Murray said:

            JPEGs were constructed for full color images with "gradations". JPEG
            compression is based on the idea that you may omit some data from "smooth
            gradation" image during compression, and then more or less reconstruct
            that data during decompression. You'll get some color shifts here and
            there, but overall "perceptual" quality of the image will be good enough.

            GIF is very different kind of image. It was introduced long ago when even
            VGA monitors (having no more than 256 colors) were considered quite cool.
            So, GIF can't have more than 256 colors. On the other side, that colors
            are not "reconstructed" the way it happen with JPEGs, they are just
            *exact* colors described in GIF palette. That's why GIF are much better
            that JPEGs than it comes to limited colors sharp images, like black text
            on white background, but are not so good when it comes to photos.

            PNG was built after GIF and JPEG. It is quite flexible format. It allow
            limited color images like those in GIF, but provide more efficient
            compression. It also allow full color images like JPEG, but since PNG is
            loseless, it cannot compete with lossy JPEG in terms of file size. Full
            color PNG provide more detail and color accuracy than JPEGs, but full
            color PNG with best compression is typically at least twice as big as JPEG
            with minimal loss, and normally ten times bigger (average) that JPEG with
            acceptable loss in quality.

            Some more things to take into account:

            1) GIF can be animated. There was an attempt to create animated version of
            PNG, called MNG, but MNG is not yet supported by Web browsers, and, in
            fact, it is supported by *very* few applications. So GIF still remain the
            only *classic* animated format. All the alternatives are Flash or movie
            formats.

            2) GIF can have one of the colors of the palette marked as "transparen".
            JPEGs can not have any transparancy. PNG may use either the "GIF-style"
            palette-based transparancy, or alpha-channel based one. The latter makes
            problems with IE, however.

            Oh well, I beleive I'm too much prolific now.

            --
            Ilya Razmanov
            http://photoshop.msk.ru - Photoshop plug-in filters
            • 3. Re: How do I chose the appropriate graphic format?
              Level 7
              > Oh well, I beleive I'm too much prolific now.

              Bragging, or confessing? 8)

              --
              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
              ==================


              "Ilya Razmanov" <ilyich@ioc.ac.ru> wrote in message
              news:op.tynnintm6e3g07@toadie...
              > On Fri, 14 Sep 2007 18:19:19 +0400, TSanchez012
              > <webforumsuser@macromedia.com> wrote:
              >
              >> How do I choose betweent he different graphic formats to use on the web?
              >> Is anyone better than the other?
              >
              > Just a little more prolific copy of what Murray said:
              >
              > JPEGs were constructed for full color images with "gradations". JPEG
              > compression is based on the idea that you may omit some data from "smooth
              > gradation" image during compression, and then more or less reconstruct
              > that data during decompression. You'll get some color shifts here and
              > there, but overall "perceptual" quality of the image will be good enough.
              >
              > GIF is very different kind of image. It was introduced long ago when even
              > VGA monitors (having no more than 256 colors) were considered quite cool.
              > So, GIF can't have more than 256 colors. On the other side, that colors
              > are not "reconstructed" the way it happen with JPEGs, they are just
              > *exact* colors described in GIF palette. That's why GIF are much better
              > that JPEGs than it comes to limited colors sharp images, like black text
              > on white background, but are not so good when it comes to photos.
              >
              > PNG was built after GIF and JPEG. It is quite flexible format. It allow
              > limited color images like those in GIF, but provide more efficient
              > compression. It also allow full color images like JPEG, but since PNG is
              > loseless, it cannot compete with lossy JPEG in terms of file size. Full
              > color PNG provide more detail and color accuracy than JPEGs, but full
              > color PNG with best compression is typically at least twice as big as JPEG
              > with minimal loss, and normally ten times bigger (average) that JPEG with
              > acceptable loss in quality.
              >
              > Some more things to take into account:
              >
              > 1) GIF can be animated. There was an attempt to create animated version of
              > PNG, called MNG, but MNG is not yet supported by Web browsers, and, in
              > fact, it is supported by *very* few applications. So GIF still remain the
              > only *classic* animated format. All the alternatives are Flash or movie
              > formats.
              >
              > 2) GIF can have one of the colors of the palette marked as "transparen".
              > JPEGs can not have any transparancy. PNG may use either the "GIF-style"
              > palette-based transparancy, or alpha-channel based one. The latter makes
              > problems with IE, however.
              >
              > Oh well, I beleive I'm too much prolific now.
              >
              > --
              > Ilya Razmanov
              > http://photoshop.msk.ru - Photoshop plug-in filters


              • 4. Re: How do I chose the appropriate graphic format?
                Level 7
                Those are pretty good observations and summaries.

                The only thing that springs to mind is:

                1 - create a logo type image in FW (limited colours for example)

                2 - export the logo (Export area tool is pleasant) at

                + maximal GIF
                + minimal GIF
                + maximal JPEG
                + some arbitrary JPEG settings
                + PNG 32 (with full on alpha channel)
                + PNG 24
                + PNG 8

                3 - do the above with an image taken on a camera

                4 - assess what seems to work and not work too well

                5 - try again this time using default options in FW

                6 - try again using your best estimated options

                The process of doing the above will give (or at least should give) some
                insights into how the various image formats behave and how each has
                settings you can use.

                Allow maybe three or four hours to do the above (resist every temptation
                to rush it into ten minutes especially as the skills can be quite
                important)

                7 - once you have settled on the best options publish them on a website
                (you can open a diino account for free that provides 2 Gig storage space
                and html can be uploaded to a folder so to behave like it was a 'proper'
                website - see diino.com)

                8 - post back here with your findings