Preparing Images

From CGWiki

Jump to: navigation, search

Contents

The 5 Things About Images Everyone Should Know

How to resize their images

This does not happen very often, but it does happen nonetheless. Webcomicker A scans his/her comic on a scanner at 600dpi, saves it and posts it without any processing. This results in a comic so big that when the page loads, you only see a minute corner of the whole comic. In other words, impossible to read. Resize to fit screen, please.

A good maximum size for a comic's width is 800 pixels. Anything more makes the comic awkward to read, unless the comic in question is an infinite canvas comic that stretches sideways.

Likewise, a good maximum height for a comic is 600 pixels, unless you are already 800pixels wide max and plan on scrolling down.

Remember, it's best to keep scrolling confined to one dimension. Either sideways or downwards. Although not impossible, doing both and making it work without annoying the reader is incredibly difficult.

That they should optimise their images

This has to be the single most annying thing I find about a lot of webcomics. There still exist people who do not access the internet through a high-speed internet line, so having comic files at 1MB per page which takes ages to load over a 56kps is absolutely unacceptable! Most decent image programs have optimisation features. In Photoshop it's called "Save for Web" (look under "File"). In Gimp and PaintShop Pro you can do that too. ALWAYS optimise your images.

That they should NOT over-optimise their images!

This is the other end of the spectrum. Some people over-optimise their images, resulting in blocky comics with unreadable text that look simply awful. Use your common sense. There's not point slaving away at a beautiful comic then compressing it so it looks like crap. I notice this happens particularly often with JPGs.

The difference between GIF, JPEG and PNG formats.

I notice even some professional webcomickers don't know about this. Let me explain a nutshell which format is best for what kind of comic:

  • GIF - Works well for comics in black-and-white or with flat colours. Inked and CG comics usually compress into high-quality images with small file sizes. GIF can also be animated. The Gnu Image Manipulation Program (GIMP) cannot save in GIF format due to GIF patent issues.
  • PNG-8 - Very similar to GIFs, except that it cannot be animated. Created to bypass the GIF format patent, after the creator of the GIF compression algorithm started charging royalties for the use of GIFs.
  • PNG-24 - A higher-quality version of PNG-8 compression, capable of compressing photo-quality images and with high quality transperency effects. I notice a number of old browsers do not support this format fully though.
  • JPEG, JPG - Used for photos, and also for images with high levels of gradients. Comics done in pencils, traditional art media (watercolor, colour pencil etc) or with airbrushed digital colouring are recommeded to use the JPEG format. Be warned, the JPEG format is unlike the GIF and PNG, and is not a lossless format. This means that you have to control the level of JPEG compression, since the higher the compression, the crappier the image looks. The trick is to find a happy balance between the image size and picture quality.

How Not to Give Readers Eyes-strain by Ensuring Proper Contrast.

This usually occurs with pencilled comics that have been scanned straight in without any inking or darkening of lines. If you don't want to in, there are many ways to darken your lines easily. Using the Brightness/Contrast, Balance or Levels feature of your image editing program are just a few examples. Be kind to your readers, don't give them eye-strain by trying to read faint comics.


Free Graphics Programs

  • The GIMP - The GNU Image Manipulation Program. This free Photoshop-like application is available for Windows, Mac and Linux/UNIX platforms, and is constantly being updated.


External Links

How to Make Your Webcomic Not Look Like Crap - Self-explanatory Keenspace Monthly article. A short and blunt tutorial that explains some basic things everyone should know. The article is intended to be sarcastic and humorously harsh, so if you're the sensitive type, you might want to be prepared.

Return to the Tutorials page

Personal tools