Unit 3: Page Layout and Graphics

Background Information

Technical Issues:

1. Most LCD projection systems have a maximum display area of 640 x 480 pixels. Even though most monitors are now capable of much better resolution than this, your page layout and graphic design should take this into account. By their very nature, many of the modules in the VGD will likely be projected at this resolution. You should also be aware that when modules are loaded in the VGD frame, the available area is reduced to about 530 x 400 pixels. Therefore, graphics, especially, should not exceed these dimensions or they will not display completely when projected.
   

2. When you produce graphics they should be set at 72 dpi (or as close as your scanner or drawing software allows) since most monitors display at 72 dpi. Many web-browsers will "blow-up" images with higher resolutions until they approximate 72 dpi. For example, a 2 X 2 inch image with a resolution of 150 dpi will be about 4 X 4 inches on a 72 dpi monitor.

   visres.cdr exported to visres.gif at 75 dpi (2K)

   visres.cdr exported to visres.gif at 150 dpi (4K)

3. Try to keep graphics files smaller than 30K. Large files take a long time to load, especially over telephone lines.
4. Solid backgrounds compress better (hence, look better) than textured ones. Dark gradients work well, but light gradients look "grainy". Notice the examples below:

   

   

Communications Issues:

1. Keep text simple and large enough to read, especially if you intend to project your pages via LCD-panel during class. Illegible pages are useless pages.
2. Graphics images should have a "reason for being". Ideally, they reinforce text-based information but do not merely repeat the information. For every image on a page, ask yourself what its purpose is (what is it supposed to communicate), and whether it fulfills that purpose.

Stylistic Issues:

1. Recent releases of web-browsers allow you to use a mind-numbing array of colors and patterns as backgrounds for your pages. Use common sense. Highly textured backgrounds, while distinctive, are tiring to read from. The same goes for bright colors. They make an impression, but you probably do not want to present 15 pages of required reading for your class on a page that makes your eyes bleed.
2. Tables, frames, and clickable maps can all be integrated into web pages to improve both their functionality and aesthetics. However, not everyone has access to a web-browser capable of supporting these features. Many of them are not even part of standard HTML! If you include substantive information in your pages in some of these "nonstandard" formats, you may want to consider having an alternate, text-only, page for those without high-end browsers.

Guide for Instructors

Student Instructions: