Illustrations on any web page are crucial - visitors will either stay at your site longer and click through other pages of your site because of them, or they will click to another web site because your illustrations take too long to appear or don't appear properly. Follow these design tips to illustrating your web pages for the best results:
Use appropriate colours in your web illustrations
If your illustration uses solid colours, stick to using only the standard 216 colours found in a typical web palette. These are the colours that will show up the same on all types of computers and web browsers. If you plan on using colour gradients or blends, test how they will look first with your screen set to only 256 colours. Even though few people use 256-color screens, images with blended colours can show up looking very dithered, muddied, unattractive, and undistinguishable. If your illustration looks bad at this low resolution, try a different colour blend that is not as harsh. (For instance, if you have a gradient of red to blue, try a gradient of green to blue instead).
Your illustrations should match the colours used in other graphics of your web site layout: masthead, sidebar, buttons, icons, image maps, and so forth.
Keep your lines thick in your illustration
Small lines that show up on your printed image will show up more thinly or not at all on your computer screen. A monitor has a much lower resolution than ink to a printed page, and makes illustrations harder to view or read. Keep the lines in your illustrations thicker and your audience will be able to see the detail of your illustration more clearly.
Your illustration should download quickly
Speed is still more important than creativity. No matter how good your illustrations look, visitors will leave your site if they are too big in file size and take too long to download. A single illustration shouldn't be any bigger than necessary. Test out your illustrations at a smaller file size, either by reducing the amount of colours or having them take up less space on your screen. Do they still look good? Then use the smaller version - your visitors will stay at your site longer because of it.
Your illustration should attract attention
Test your illustrations out with people not familiar with your web site. Do they immediately catch their eye? Your illustrations should direct people to the content of your page, and make them read on and click on to further pages. A very good illustration can also add a whole new perspective to what you are saying with your words.
Your illustration should compliment, not control
Your illustrations should look good enough to attract your visitors' attention but not so much as to become a distraction from your site's content. Allow for some breathing room (white space) to your images and between images. Don't overpower your visitor with illustrations by putting too many on a single page.
Make your illustrations relevant to the web page content
A pretty picture that doesn’t match the content of the page is a worthless picture, taking up precious downloading time and leaving your visitors' confused. Your illustrations need to compliment the message of your text. Your visitors should look at your illustration first and already be left with an impression of what they are about to read.
Save your illustrations in the proper file format
Illustrations with mostly solid colours and lines that need to look sharp should be saved as GIF files. Illustrations with gradients or blends, or that use smooth transitions should be saved as JPEG files. (The commonly used extension for saving these types of files is .gif and .jpg)
Protect all of your illustrations
Online thievery is very common, so you should protect your illustrations from uncategorized use. Place a copyright symbol with your name or the name of your company/organisation next to each of your illustrations. For added security, subscribe to a digital watermarking service like Digimarc, which can let visitors know that you are the author and copyright holder of the illustration, and also can trace the web for whoever else is displaying your images. Another recommended protection service is Gamacles Software, which prevents visitors from copying or printing the images on your screen.
All of these articles may be freely reprinted in any e-zine, newsletter, newspaper, magazine, website, etc. as long as my name and bio remain intact. |
