Site INDEX




Useful Digital Skills for Artists

Imaging Skills

Print& Scan

Web Skills



Practicing Authoring a Web Site with Dreamweaver or Composer

Cynthia Beth Rubin

 

Adobe Go Live, all generate standard HTML.

Although each program has its own strengths and weaknesses, you can move from one to the other, or change elements by hand.

Instructions below for Dreamweaver and Netscape Composer can be applied to other authoring tools, with only lsight differences


1. Make a new Folder for your Practice Web Site

  • Work on the HARD DRIVE, not on your ZIP disk. Make sure that you ZIP is not in the drive when are working.

  • If you plan to experiment with inserting images, make sure that they are properly saved as .gif or .jpeg, then put a copy in this folder (with a nice short name, no spaces, no symbols or slashes)
  • Work on the HARD DRIVE, not on your ZIP disk. Make sure that you ZIP is not in the drive when are working.



2. Open up a new Document in Dreamweaver or Netscape Composer

  • Click on the Launcher to Open Dreamweaver or Netscape.
    (or go to Applications on Hard Drive)
    You may have to use "Find" to locate the Application.

  • An Untitled Document will appear in Dreamweaver.
    In Netscape Composer, go to New, then Blank

  • If you are using DREAMWEAVER you must define your Site
    Go to SITE in the top menu
    Go down to DEFINE SITES
    Add your site to the list
    Click on the little folder to find the location (this will be the folder that you just made)
    do not put down the http:// address -- you will not be uploading directly from Dreamweaver

  • SAVE the page in the Web Test Folder.
    Go to FILE and down to SAVE
    Be sure to leave the .html in the name, and to make the name SHORT without spaces (such as short.html)


3. Choose the Basic Colors for the Page

  • DREAMWEAVER:
    • Go to Modify in menu
    • Go down to Page Properties
    • Use the HTML Color Picker to choose colors
    • Click on the little box next to background, text, etc.


  • NETSCAPE COMPOSER:
    • Go to Format in menu
    • Go down to Page Properties
    • Choose Colors and Backgrounds
    • Choose Custom Colors
    • Click on the little box next to background, text, etc.

  • Be sure to stick to Web safe colors (web safe colors have repeated numbers and/or letters, such as 0033FF, or 993300

4. Type in Some Practice Text and Experiment with Color

  • To Practice, just type in Any Text at all

  • Modify the Color of the Text, by Highlighting Portions of what you typed

    • DREAMWEAVER:
      • Go to Text in menu
      • Go down to Color
        or

      Click on the little box next on top line of Properties Window, that will lead to colors

    • NETSCAPE COMPOSER:
      • Simply Click on the Color Palette icon on the menu bar
      • Choose the Color you Want

5. Experiment with Size

  • Use the same practice text, or add to it.

  • Modify the Size of the Text, by Highlighting Portions of what you typed

    • DREAMWEAVER:
      • Go to Text in menu
      • Go down to Size
        or

      Click on the little box next on top line of Properties Window, that will lead to various sizes

    • NETSCAPE COMPOSER:
      • Go to Format in menu
      • Go down to Size
        or
        Click on the sizes in the menu bar

6. Experiment with Serif and Sans-Serif Fonts

  • Fonts for the web are generally designated in only families of serif or sans-serif fonts

  • Although you can designate any font for a page, users can only read text in fonts that they have!

7. Experiment with Links

  • Make two pages, with different html names.
    (note - every page is named in two different ways:
    the html name that is the web address
    the longer name that is the Browser Bookmark

  • Be sure that both Pages are saved in the same folder (Your Web Test Folder)

  • Create a Link between them:

    Highlight a bit of Text:

    • DREAMWEAVER:
      • Go to the little folder next to Link in the Properties Window
      • Move through the folders of your hard drive until you find the other page that you made
      • Click on it, and the name should load


    • COMPOSER:
      • Go to the Insert in Menu
      • Down to "Link"
      • Click on Choose File
      • Move through the folders of your hard drive until you find the other page that you made
      • Click on it, and the name should load


  • Repeat the practice by making a link from the other page to this page.
    (repeat all of the above steps)

Proceed to:

Web page preparation