COMM 380: World Wide Web Design and Production

Dr. Paul Martin Lester, Professor
California State University, Fullerton
714/278-5302; Email | Homepage
Office: H-324F

Assignment 4: Using PhotoShop for Splash Pages

A splash page is an opening, largely graphic, frame that introduces a homepage. It sets the mood for the site. In other words, if the overall content of the site is staid and serious, a splash page contains muted colors and symmetrical placement of one main image. If the homepage content is fun and whimsical, the splash page reflects that spirit with a variety of colors, placements, and numbers. For this assignment you will create a simple splash page intended for your own, personal homepage using the PhotoShop software program.

Examples of Splash Pages
dailytitan.fullerton.edu/
commfaculty.fullerton.edu/lester/workshops/rosmi.html
homeless project
blair witch project
don't fail to check out these artistic sites:
www.superbad.com
www.lanquid.com/l
www.day-dream.com

PhotoShop Hints

  • Start up PhotoShop on your computer. Create a New file that is 5" x 5", a resolution of 72, a Mode of RGB Color, and the Contents Transparent.
  • Make sure you can see the Levels (or Layers) dialog box.
  • From the Swatches box, pick a color and select the Paint Bucket. Click in the work area.
  • Create a New Level (or Layer).
  • Select colors and the brush or pencil tools, if desired. For type, select a color for the text, select the Type tool and click in your work area. Select your typeface and attributes and type in as much text as you want. Press the Enter key. Move the text where you want it. You can also import an image.
  • If you want to use pictures, see me for details.
  • BEFORE EVERY NEW ELEMENT, create a New Level (or Layer). Repeat this procedure until you have a design that you want. If you are not finished, save the picture file with any name you will remember. When finished, from Image, select Mode and then Indexed Color to flatten the layers. Return to Image then Mode and select RGB. Under File select Save and save this file in JPG format using the convention, "splash.jpg" (no quote marks).

    HTML Creation Rules

  • In the Assessories folder, start up Microsoft NotePad with a new file.
  • EVERY html file MUST contain the following commands at the top of a file:
    <HTML>
    <HEAD>
    <TITLE>Write a Unique Title Here</TITLE>
    <META NAME="Type Your Name Here" CONTENT="Type a Brief Description Here">
    <META NAME="KeyWords" CONTENT="Type At Least 5 Keywords Divided by Commas">
    </HEAD>
    <BODY BGCOLOR="Color" TEXT="Color" LINK="Color" VLINK="Color" ALINK="Color" BACKGROUND="image file name (if desired)">
    NOTE: You must use browser-safe colors.
  • Your file contents go next. For this assignment, all it will contain is:
    <CENTER><img src="splash.jpg"></CENTER>
  • At the end of the file the following commands MUST be included:
    </BODY>
    </HTML>
  • Name and Save this file as assign4.htm in the same location as your image file.
  • Return to Netscape and use Open File to see what your html file looks like on the Web. Return to your NotePad file, make changes, save those changes, return to Netscape, reload or refresh the file to see your changes. Continue this back-and forth procedure until you get something that makes you happy.
  • Turn in a print-out of your HTML file with your disk. Turn in a one-page explanation of why this splash page reflects your personality and homepage content. Budget enough time during class so I can upload your files to the School's server.