Creating and Editing Web pages
with Netscape Composer

Getting Started

Alternatively, use Netscape to navigate to a page you wich to edit. Choose Edit Page from the File menu. The current Navigator window becomes a Composer window containing the document you were viewing.

In either case, the Menu Bar shown below will be at the top of the screen.

• Your page needs a title. This is the title that appears as a bookmark and when someone finds your page with a search engine. It is not the same as the filename (see below). Give your page a title by selecting "Format" from the menu bar, then selecting "Page Colors and Properties." Click on the "General" tab and fill in your title in the "Title:" box.

 
• The name you give your file is important. Some file naming hints:
• Name your home page INDEX.HTML
• Give your file a simple name with no spaces, apostrophes, asterisks, or any other special characters.
• Use only lower case letters in the file name.
• The file name must end with .html, e.g., myfile.html

 
• Remember to Save your page frequently after you have made changes.

Editing Text

• To put blank lines between paragraphs, press ENTER.

 
• To insert a linebreak (start a new line without inserting a blank line), press SHIFT-ENTER (hold the Shift key down while pressing ENTER).

 
• To bold text, highlight any sections you want to change and then click on the  button.

• To italicize text, highlight any sections you want to change and then click on the  button.

 
• To change the alignment of your text, highlight any sections you want to change and then click on this pull-down menu button. . Select left, center or right alignment.

 
• You may want to include headlines as part of your document. Headlines are used to distinguish between different sections of your document. Generally, headlines are big, bold, and are separated from the text by a blank line. Composer supports six levels of headings, ranging from HEADING 1 (largest) to HEADING 6 (smallest). To insert headlines, click on the  window located in the button bar. You will see this window. . Select the desired headline size, and type your text. When done, click on the window again, and select NORMAL.

 
• To change the font size of a letter, word, or other section of text, use the mouse to highlight the text you want to change. Then, click on the font size button .  The text can be as small as this, which is 8 point, or as big as this, which is 36 point.

 
• To insert a horizontal line, click on the  button.

Creating Links

Adding Links to other Web resources from your page:

• To link to a document at another location, use the mouse to highlight the text you want to be clickable.

 
• Click the  button. Click on the Link to: box. Type the full URL of the location to which you want to link, e.g., http://www.beloit.edu. Click OK.

• To link to another document within the same directory as your original page, use the mouse to highlight the text that you want to be clickable. Then, click the  button.

 
• Click in the blank area next to the Link to:  text. Type the name of the file that you want to link to, or click on Choose File... and navigate to the file to which you wish to link. Click OK. The selected text will turn blue and will be underlined to indicate that it is now a link.

• Use the mouse to highlight the text that you want to be clickable. Then, click the  button.

 
• In the Link to: box, type mailto:your_email_address  For example, mailto:dahlgrens@beloit.edu

 
• Click OK

Adding color to your Web page:

• The default background color for Web documents is gray; however, you may select any other color for your background. To do this, select PAGE COLORS AND PROPERTIES from the FORMAT menu.

 
• Click on the COLORS AND BACKGROUND tab. Click the BACKGROUND color. Select the color of your choice and click OK.

• The default color for Normal Links is blue. For Active links it is red. For Visited links it is purple. However, you may select any other colors for these options.

 
• From the FORMAT menu, select PAGE COLORS AND PROPERTIES.

 
• Click on the COLORS AND BACKGROUND tab.

 
• Click on the drop-down box beside the type of link you want to change.

 
• Select a color as you did for the background.

 
• When finished, click OK.

• Highlight the text for which you want  to change the color. Click the TEXT COLOR button, .

 
• Select a color as you did for the background.

 
• When finished, click OK.

Inserting Images into your Web page:

• To insert an image on your page, place the cursor where you want the image to be and click on the  button.

 
• You will be prompted to locate the image file.

 
• If the image is on your local machine (hard drive or diskette), you may locate the file by clicking the CHOOSE FILE button. Highlight the image file name. Click OPEN. Click OK. This will automatically place the image in the document.

 
• If the image is located on a remote server, type the URL for the image file. Click OK. This will automatically place the image in the document.

• There are several ways to alter the way that an image appears within your document. These include: changing the alignment of the image on the page, wrapping text around the image in a particular way, specifying a particular width and height, and adding a border to the image.

 
• After inserting an image, you may adjust its alignment on the page by clicking on the image. Select FORMAT and then IMAGE PROPERTIES. Click on the PARAGRAPH tab and select one of the alignment options. Click OK.

 
• You may also want to change how the text wrapping around the image. To do this, click on the image. Select FORMAT and then IMAGE PROPERTIES.  Select one of the wrapping options. Then, click OK.

 
• Top Align will align text with the top of the image. Middle Align is the default option, which aligns text with the middle of the image. Bottom Align will align text with the bottom of the image. Left Align will move the image to the left and wrap text around the image on the right. Right Align moves the image to the right and wraps text around the image on the left.

 
• To change the width and height of an image, click on the image. Select FORMAT and then IMAGE PROPERTIES. Type in a size in the DIMENSIONS box. Click OK.

 
• You may type in values for the WIDTH and/or HEIGHT in the appropriate boxes. If you specify only one value and select the CONSTRAIN Box for the other value, the image will be resized proportionally.

 
• To add a border to an image, click on the image. Select FORMAT and then IMAGE PROPERTIES. Enter a value in the box labeled SOLID BORDER. Click OK.  A border width of 1 would indicate a very thin line; 5 would be a very thick line.

• You may want to make an image clickable as a link to another document. To do this, click on the image that you want to link to another document.

 
• Then, select FORMAT and then IMAGE PROPERTIES. Click in the blank area next to the LINK TO: box. Type the DOCUMENT NAME or URL of the location that you want to link to. Click OK.

 
• The image should now have a blue border around it to indicate that it is a link to another location. Specify BORDER=0 if you don't want a blue line.

If you want to use a specific image as your background, you must first create the image in a graphics package like Paint Shop Pro or Adobe Photoshop or obtain it from the Web. The browser will tile the image across the Web page, so you may only need a small piece of an image.

• From the FORMAT menu, select PAGE COLORS AND PROPERTIES.

 
• Click on the COLORS AND BACKGROUND tab.

 
• At the bottom of the window, click the CHOOSE FILE... button to select a Background Image. Locate and highlight the image file that you would like to use for a background. Click OK.

 
• The image will automatically tile across your Web page. If you dislike the background or want to use another image, then uncheck the USE IMAGE box from the COLORS AND BACKGROUND tab. This will automatically delete the background image you have chosen.

Inserting a table into your Web page:

• Click on the TABLE button or select Insert, then Table.." from the menu bar.

 
• The Table Properties box will appear and you can fill in the number of rows and columns you want, specify the alignment of the table on the page, the border width, the table width, and much, much more. When you're done, click OK.

 
• To enter data into the table, click in the appropriate table cell and start typing.

• You can change the properties of an existing table by placing your mouse cursor within the table and then selecting the Format menu and Table Properties.

 
• You can insert rows or columns into your table by selecting the Insert menu and then Table. A sub-menu will appear from which you can select Row or Column.

 
• To remove a table or delete an individual row or column, place your cursor within the table, select the Edit menu, then Delete Table. The sub-menu will allow you to choose what you want to delete.

Previewing your page:

Publishing your page to the Web:

• Save your document and make sure the filename includes the .HTML extension.

 
• Select "Publish" from the "File" menu or click on the Publish button.

 
• Be sure the Page Title and the HTML Filename boxes are filled in.

 
• In the box labelled "HTTP or FTP Location to publish to," type the name of your Web directory, e.g., http://www.beloit.edu/~dahlgrens/

 
• Fill in your username and  password and click OK. The page and associated graphics will be uploaded to your web directory on the web server.

 
• Another option is to save the file on your hard drive and use WS_FTP or Fetch to transfer the files to your web directory.