Week 1: Introduction to the Web and HTML

Topics:
Publishing on the Web and Introduction to HTML

Sample Questions:

  • What is the Internet_
  • What is the World Wide Web_
  • How do these networks actually work_
  • How do I search for information on the WWW_
  • How do I register a domain name_
  • Why publish on the Web_
  • Who is the audience_
  • What is the process of making a Web site_
  • What is design_
  • What is appropriate Web content_
  • What is HTML_
  • What is HTML not_
  • What do I need to produce HTML_
  • How do I make an HTML document_
  • How do I view this document when it's done_

Sample Exercises:
Search for information about minorities and the computer industry using a search engine. Locate a "reliable" and cost-effective ISP in the SF Bay Area. Identify two WWW sites that have a successful GUI, write a short paragraph describing what works on both sites. Produce a simple Web page with instructions for people visiting OpNet from around the Bay Area. Write up meta tags appropriate to this page. Include them in the header. Include my name with the proper accent marks on this page. Write a meta "refresh" tag that will bump users from this page to the appropriate page in Yahoo! maps. Read the introduction to the Yale Web Style Guide"

Week 2: HTML and an introduction to Adobe Illustrator

Topics:
HTML tables and links. Usenet. Images on the WWW. An introduction to Typography and Illustrator.

Sample Questions:

  • To link, not to link and how to link_
  • What is an inline link_
  • What is a relative link_
  • What is an absolute link_
  • What is Usenet_
  • How can I use anonymous FTP sites_
  • Can I use telnet_
  • How do you download images_
  • How do you embed images within a Web page_
  • What is typography_
  • How does one pick or specify fonts_
  • What is Adobe Photoshop_
  • What are pixels_
  • What is image resolution_

Sample Exercises:
Make a very simple portal for young, rich, business professionals. Include links, color, and the extensive use of tables or make a very simple portal for old, poor, retirees. Include links, color, and the extensive use of tables. Collect a short list of anonymous FTP sites and write two short paragraphs about what can be found there. Include these two paragraphs and a link to the sites in your two portal pages. Collect a list of USENET groups that would be of interest to either portal's audience. Link to these two lists of groups on your portal pages.


Week 3: Adobe Illustatror and Photoshop

Topics:
The pen tool, anchors and pathfinder tools in Illustrator. Layers and Transformation, Masks, Layer Effects and Type in Photoshop 5.0

Sample Questions:

  • Using the pen tool to draw an object.
  • Creating complicated illustrations by combining objects.
  • Adding type to an illustration or using type as an illustration.
  • Creating Web graphics with Illustrator and remaking AI files in Photoshop.
  • How do you select an image_
  • What are some strategies for punching out images_
  • What kinds of things can you do with layers_
  • How do you transform a selection_
  • What are your options for saving "finished" files_

Sample Exercises:
Using both layer image modes and the transform options, create single shocking illusion. Design a logo with Adobe Illustrator.

Week 4: JavaScript, CGI and Cascading Style Sheets.

Topics:
Basic concepts behind Javascript. Cookies. CGI scripts. An introduction to CGI, PERL, and database-driven Websites.

Sample Questions:

  • What are events in Javascript_
  • What are navigator objects_
  • How do I use functions and methods_
  • What are cookies and how do they work_
  • How do client-side image maps work_
  • How do I use CSS_
  • How to combine Javascript and CSS to produce DHTML_
  • The making of HTML FORMS.

Sample Exercises:
Create an image rollover using images on a foreign server (with absolute urls'). Create a "pop-up" window of a set size. Create a basic image map for navigation. Use CSS to position elements on your page and create alternative typographic styles.


Week 5: Frames, Flash, Forms, Dynamic Frames, UNIX

Topics:
What HTML tags are used for setting frames_ What is the structure of a site that uses frames_ When might be a good time to use frames_ The shell and Unix commands. Flash animations and movie making. Multiple frames. Sample Questions: How does one make a symbol or button in Flash_ What built-in buttons exist_ Can they be edited_

Sample Exercises:
Make a contact page for your personal site that use a (CGI to be provided by JosZ at a later date), CSS for positioning, JavaScript (for rollover or popup window), an image map and tables. Font specification should be made. Colors should be consistent and striking.



Return to Home Page