[The HTML Writers Guild]
HWG.Org
Resources
Lists
Classes
Services
Books
Interact
Join!
News
Events
Contact
Sitemap
Search
HWG Lists Charters and Instructions hwg-graphics

HWG-Graphics List FAQ

Table of Content

  1. Introduction
  2. What is the basic difference between a gif and a jpg?
  3. What is 'interlaced' and 'non-interlaced'?
  4. What is 'png' and which browsers/graphic applications support it?
  5. What does 216 color web-safe palette mean?
  6. Which is the recommended resolution/color depth to use?>
  7. How do I make cool backgrounds with a side-bar on the left?
  8. Are there any good resources for PhotoShop and PaintShop Pro filters?
  9. What is the difference between a 'vector' and 'bit-map graphic?
  10. What does 'gamma' mean?
  11. What are 'actions' in PhotoShop and how do I use them?
  12. Is it alright to obtain graphics from other web-sites?
  13. Why are Flash animations smaller in KBytes than animated gifs?
  14. How do I optimize file sizes, and to what point should I sacrifice image quality?
  15. What is 'anti-aliasing'?
  16. What is AOL's 'art' format and how do I work around it?
  17. I would like to know about different movie formats?
  18. What is VRML?
  19. What is DHTML and CSS?
  20. What are some choices of software I can use?
  21. For More Information.
  1. Introduction.

    This document contains answers to commonly asked questions on the HWG-Graphics mailing list. If you feel that you have a question that should be added, you may submit it to the list at hwg-graphics-help@hwg.org

    Table of Content

  2. What is the basic difference between a gif and a jpg?

    (a) GIF: (bitmap, stream-based): max. 256 colors (8 bit) / lossless compression (LZW) / possibility of animation in gif 89a / 1-bit transparency in gif 89a / possibility of storing additional text information (gif 89a).

    (b) JPEG: (data stream): max. 16.7 million colors (24 bit) / lossy compression (JPEG) / option of setting both compression ratio and file resolution (settings for resolution: 72 dpi for PC's / 96 dpi for MAC's).

    Table of Content

  3. What is 'interlaced' and 'non-interlaced'?

    'Interlaced' means that the image is not being loaded line by line, but in several 'passes'. At first, one sees a version of the image which contains very little detail, but while the image is still being loaded, it gradually becomes more clear, until the loading process is finally completed. The equivalent for the JPEG format is the so-called 'progressive encoding'.

    Table of Content

  4. What is 'png' and which browsers/graphic applications support it?

    Short for Portable Network Graphic (pronounce: ping!). Bitmap format developed to replace the GIF format due to the fact that the LZW (Lempel-Ziv-Welch) algorithm used in GIF is copyrighted. Has several advantages over GIF as follows:

    (a).up to 48 bit color depth/16 bit greyscale.
    (b).8-bit transparency.
    (c).automatic gamma correction (if the software supports it).
    (d).automatic detection of file corruption.
    (e).possibility to align one out of five possible filters for data compression.
    (f).compression algorithm [LZ77 derivant] is freely available and not copyrighted.
    Not supported in some older browsers without plugin.

    Table of Content

  5. What does 216 color web-safe palette mean?

    When in 256 bit color mode [8 bit color depth], browsers have a so-called 'web-safe' or 'browser-safe' color palette, which is a common denominator for the different computer systems. This palette consists of 256 colors, of which only the first 216 colors are common in the different applications. From the remaining colors, 20 colors are used for the system palette with the last 20 colors being more or less freely available.

    Table of Content

  6. Which is the recommended resolution/color depth to use?>

    Depends, but for web design a resolution of at least 800 x 600 is preferred. Color depth: at least 16 bit (while it is still recommended to save GIF's with a 'web-safe' palette

    Table of Content

  7. How do I make cool backgrounds with a side-bar on the left?

    This can be achieved by using appropriate paint program and can also be achieved by using frames, tables or CSS (Cascading Style Sheets).

    Table of Content

  8. Are there any good resources for PhotoShop and PaintShop Pro filters?

    Here are a few, if anyone knows of more, please do let us know.

      Jasc Incorporated - Paint Shop Pro.
      PSUG-Paint Shop Pro. filters
      ICnet Graphic Software-Photoshop/PSP compatable filters.
      Andromeda Software Inc., - Photoshop filters.


    Table of Content

  9. What is the difference between a 'vector' and 'bit-map graphic?

    In vector graphics the objects contained in the file are being stored as mathematical equations, so-called vectors. Vector files are usually plain text files, and therefore the compression is much more efficient than in bitmaps, because it is not necessary to store each pixel - only the mathematical description of the object(s).

    Bitmaps store the image data as so-called 'pixels' [short for 'picture element']. The color information is either being stored in a color palette, or together with each pixel.

    Table of Content

  10. What does 'gamma' mean?

    Please see Gamma FAQ

    Table of Content

  11. What are 'actions' in PhotoShop and how do I use them?

    'Actions' let you automate tasks in Photoshop, e. g. applying a set of different filters, etc.. 'Actions' also allow the possibility of batch processing. For further information see the Photoshop manual/help file.

    Table of Content

  12. Is it alright to obtain graphics from other web-sites?

    Please see Copyright FAQ

    Table of Content

  13. Why are Flash animations smaller in KBytes than animated gifs?

    Flash animations are a vector-based file format with interesting features such as automatic scalability, interactivity, etc.

    Table of Content

  14. How do I optimize file sizes, and to what point should I sacrifice image quality?

      (a)GIF - color reduction: GIF files do not necessarily have to be stored with a
      color depth of 8 bit (256 colors); for text sometimes 16 colors (4 bit) are enough!
      (b)JPEG - setting the proper compression ratio [for the correct resolution see here].
      There are various programs obtainable for optimizing, XAT Internet Technology
      being one.

    Table of Content

  15. What is 'anti-aliasing'?

    "Anti-aliasing" is an algorithm used by graphics applications to remove the "jaggies" at the borders of text etc.. To apply this feature, make sure to check the option in your graphics program [in Paint Shop Pro you have to be in 16-bit color mode to apply anti-aliasing, although the effect will remain when the color depth is being reduced later on].

    Table of Content

  16. What is AOL's 'art' format and how do I work around it?

    The fact is, 'art' is not a file format, but a compression scheme. Uncheck and "Use compressed graphics" in your AOL preferences.

    Table of Content

  17. I would like to know about different movie formats?

    There are several movie formats on the web, each of which requires a certain plugin to view in your browser. The most commonly used formats are 'Quicktime', .AVI, .MPEG, and the Realplayer format.

    Table of Content

  18. What is VRML?

    Short for "Virtual Reality Modeling Language". File format developed to store description of virtual reality scenes. Viewing VRML files on the web requires a plugin.

    Table of Content

  19. What is DHTML and CSS?

    Both are enhancements of HTML (DHTML = dynamic HTML; CSS = cascading style sheets) and open up new possibilities for layout/graphic design of websites. For further information on DHTML see here, on CSS here. See also the CSS FAQ.

    Table of content

  20. What are some choices of software I can use?

    Table of Content

  21. More Information.

    If you have any problem or require assistance pertaining to this list, please do not hesitate to contact the List Guides who will be available to help at hwg-graghics-help@hwg.org
[Valid HTML 4.0!]
This page is maintained by hwg-lgmanager@hwg.org. Last updated on 23 October 2003.
Copyright © 2003 by the HTML Writers Guild