CSci 220 - Lecture 17

Web Page Design

© Morris Firebaugh



Creating Web Graphics and Simple Animation


B. HTML Utilities

What Utilities would we want for HTML verification and transformations?

Note: GoLive contains 2 out of 3


C. Graphics Programs

The Two Classes of Graphics include:

Bit-Mapped Graphics

Vector (OOP) Graphics

For a good introduction to Vector Graphics on the WWW, see:

Vector Graphics on the Web

D. Ray Tracing, 3D Rendering, and Fractals

Several Program offer Realistic Rendering

Ferrari.jpg by Daryl Walter

The Waiting by Ed Baumgarten

Piano and Papers.JPG by Martin Murphy

abstra1.JPG by Harald Seiwert


E. Animated GIFs

Animated GIFs are the simplest approach to Web animation.

Features of Animated GIFs

Recommendations on Using Animated GIFs

Attributes of Animated GIFs

Here we use GifBuilder 0.5 to illustrate


Example 1. Two image banner

Steps to creating banner

  1. Collect frames (2) in folder Anim1.gif
  2. Open GifBuilder 0.5 and select "New" under File
  3. Drag two files into Frames Window
  4. Select appropriate transition under "Effects --> Transitions
  5. Under File, choose "Save As"


Example 2: The Award-winning "1984" Television Ad


F.  Laboratory Assignment # 9


Revised March 13, 2001