Project 1

Design an Original Website


Design a three-page website on any topic, using original graphics (GIFs and JPEGs, inserted into the HTML using the IMG tag), simple text formatting (including H1-H6, P, B, and BR tags), and hyper-links (using the A (anchor) tag). At least one page should have enough content to make NAME anchors within the page useful; links on that page, and from other pages, should jump to these NAME anchors. Design everything to fall to the left of the browser window; if you like, some elements may be centered in the browser window (using the DIV tag with its ALIGN attribute set to "center" around the images you wish to center; headings and paragraphs may be centered simply by adding the ALIGN attribute set to "center" directly to the tags themselves!). Obviously, you do not yet know enough HTML to mimic professional designs, but you should be able to create something simple and legible with clear navigation. You may create site navigation using ordinary text links, or you may use hot-linked images to create graphical navigation elements.

Do not expect your website to be perfect looking; this is merely an opportunity for you to exercise your basic skills. You may create a site on any topic. If you can't think of a topic, you may use one of the following:

  1. My Family Outing
  2. My Pet's Favorite Toys
  3. Why I Like or Dislike (A Musical Group? A Museum? Zoo Animals? Environmental Issues? My Mother-in-Law? Oil Painting? Chechnya? Kabuki Theater?)
  4. The "New" Banana: A Fruit with A Peel.
  5. My Favorite Smells
  6. Blue Foods
  7. My Favorite Recipes
  8. Bathroom Fixtures
  9. Driveways I Have Known
  10. Ugly Lamps (Or Other Furniture)
  11. Childhood Memories
  12. Family History

Don't fixate on creating mounds of content; a few choice paragraphs and one or two pictures per page are sufficient (although more is always welcome!). Since you only have one week to complete this exercise, I am not expecting polished content; even placeholder (gibberish) content is acceptable. The pictures do NOT have to be beautiful; even childish scrawls or stick figures translated into GIFs are perfectly acceptable.

Upon completion of this exercise, make a folder on your hard drive to contain the final website (NO SPACES IN THE NAME!). Put your 3 HTML pages, and their accompanying graphics, into this folder (you may use a sub-folder to hold your graphics, if you wish, as long as you code your IMG tags to correctly access that sub-folder!). Test your website from this main folder, making certain that everything works and displays properly; make corrections, as needed. The first page of the site MUST be named "index.html"; otherwise, I won't know which page to load first! Once the site is FULLY debugged, use StuffIt Deluxe or StuffIt for Windows to create a .sit archive of the folder. Note: Do NOT include your original Photoshop (.psd) files!

To submit your exercise to me for review and grading, attach your .sit archive to a message in the threaded discussion for this module. Include any questions or comments that you have concerning the project in the text message.

You will be graded on technical competence. If your pages display, your hyper-references work, and all of the images load as they should, you will get credit for the assignment. If your pages do NOT work correctly (if the links are broken, or the images are not included or are incorrectly compressed), you will NOT get credit for this assignment; make certain your exercise is THOROUGHLY debugged before you submit it! PC Users: DON'T drag-and-drop images into HomeSite to get "cheat" URLs; this method creates absolute URLs which work ONLY on your hard drive, and are invalid anywhere else!

WARNING: Do NOT use a WYSIWYG editor, such as Dreamweaver or Adobe GoLive, to create this exercise! Do NOT recycle MY exercise files for this exercise! You will NOT get credit for this exercise if I catch you doing these things! You must code everything yourself, from scratch.

If you have any trouble making your .sit archive, read the documentation included with StuffIt or contact one of our TAs. On the Macintosh, StuffIt's MagicMenu extension makes compression as simple as selecting the folder to be stuffed, and choosing the "Stuff" option from the pulldown menu. Additional StuffIt FAQs and other information are available from