Tips And Techniques
Wise Color Choices
- Net safe is always a good bet. Remember, these are the colors that don't dither when loaded in any browser on any machine capable of showing 8-bit color. You can view these colors by using the EdTech color picker at http://www.edtech.neu.edu/colors/.
- Don't touch that color! If you blend, lighten, or anti-alias
a colored object, what you really doing is mixing its color with another color
(most likely the background). Once you've done this you no longer have the
original color you started with, and chances are good the new color won't
be in your original palette. This will add to your file size, and possibly
not look good.
But... it's true that some of the "cool" stuff is done with blending and mixing of colors. So I want to be clear that I'm not saying you can't do these things; I'm just saying that if you do, you should expect a bit of extra work on the color palette to keep that cool look! Hey, it's worth it, right? - Less than 216... the net safe palette is 216, 8-bit
color allows 256 colors, but you don't need to use all of these. Here is
a way around it:
- After you've converted to indexed color, convert back to RGB.
- When you are back in RGB, again convert the file to indexed color. This time you should be asked to make an exact palette, which will be a subset of the net safe 216 palette and, therefore, give you a smaller file size. It may only be 1 or 2 K, which seems insignificant. But when you multiply that by 10 or 12 files and you will start to see something significant, especially over a 56K modem.
Application-specific
In many programs there is a difference between exporting a file and saving a file. You should always try, at least once, taking a file and saving it and then exporting it. You might be surprised by the difference in file size. In older versions of Photoshop, this was a problem, however this is less of an issue now.
Differences
Operating systems, actual hardware components (monitors, etc.), and browsers are all different. No matter how hard you try you will never get your sites to look the same on all machines all the time! So figure out who your target audience is, or maybe your lowest common denominator, and work from there. It also might not hurt to note this standard on your site.
Test, test, test!
There's no substitute for building a "test graphic," or a few even, and some "test HTML pages," to look at in a few browsers and on a few platforms. Faculty and staff are welcome to use machines in the EdTech Center for that purpose. Once you are done with your site you should do this again, just to be sure.
Text
Some text looks OK anti-aliased, while other text looks really bad! The more you use a typeface, the more familiar you will become with it. It's only when you know the nuances of a font that you'll be able to use it well. Until you do try both ways and see what looks better and you'll be just fine!
GIF stuff
Remember that dithering makes bigger files.
JPEG stuff
Remember to work from the original. If you don't, you're really reducing the quality (even if you don't see that first). Also blurring before you save can help reduce the file size.
And now the long awaited exercises...
