Creating Web Pages with Netscape Composer 

To start using Netscape Composer:

• Click the Composer icon in the lower-left corner of any Netscape window.

	Composer icon

 
To create a web page, use one of the methods described below. Once you've started a page, you can add and edit text just as you would in a word processor.  When you first start decide where you want to save all of your files -- either in one folder on the desktop or on a disk.  Later they could be uploaded to a server.

To create a new page from the Navigator browser:

• Open the File menu, choose New, and then Composer Page. A Composer window containing a blank page opens.

To edit a page you're currently browsing in Navigator:

• In the Navigator window of the page you're viewing, open the File menu and choose Edit Page. You see a Composer window that contains the page you're viewing.

To create a new page in Composer:

• Click the New button in Composer's toolbar.

To start from an HTML  file (a Web page that your created using another software (ex. Word, FrontPage)) stored on your local drive:

1. Open the Window menu and choose Composer. You see the Composer window.
2. Open the File menu and choose Open File. You see the Open HTML File dialog box.
3. On your local drive, locate the file that you want to edit.
4. Click Open to display the specified file in a Composer window.

To edit a web page:

1. Open the Window menu and choose Navigator.
2. Go to a web page by typing the URL of the page (for example, http://home.netscape.com) in the Location Bar and pressing Enter (Return on Macintosh OS).
3. Open the File menu and choose Edit Page.

To format text as a heading:

1. Click to place the insertion point anywhere within the text that you want to format.
2. Using the drop-down list in the Format toolbar, choose the level of heading you want, from 1 (largest) to 6 (smallest). Choose "Heading 1" for your main heading, "Heading 2" for the next level, and so forth (or you can click "body text"  at the left on the format toolbar.

To apply a list item format:

1. Click to place the insertion point within the line of text that you want to format.
2. Open the Format menu and choose List.
3. Choose the list style:
4. • Bulleted: Each item has a bullet (dot) next to it (as in this list).
   • Numbered: Items are numbered.

Tip: You can quickly apply a list style to a block of text by selecting the text and clicking the Numbered List or Bulleted List buttons on the Format toolbar.

To align a paragraph or text in your page, for example, centering or aligning to the left or right:

1. Click to place the insertion point within the paragraph or line of text you want to align.
2. Open the Format menu and choose Align; then choose an alignment option.

Note: You can also use the Format toolbar to align text.

Working with Lists

To end a list and continue typing body text:

• Click to place the insertion point at the end of the last list item and press Enter (Return on Macintosh OS) twice to end the list.

To change one or more list items to body text:

1. Click to place the insertion point within the list item, or select the list items.
2. In a numbered list, click the numbered list button (or in a bulleted list, click the bulleted list button) in the Format toolbar.

Changing Text Color, Style, and Font

To change the style, color, or font of selected text:

1. Select the text you want to format.
2. Open the Format menu and choose one of the following:
3. • Font: Use this to choose a font. If you prefer to use fonts specified by the reader's browser, select Variable Width or Fixed Width.

     Note: Not all fonts installed on your computer appear. Instead of specifying a font that may not be available to all who view your web page, it's generally best to select one of the fonts provided in the menu since these fonts work on every computer. For example, the fonts Helvetica, Arial, Times, and Courier generally look the same when viewed on different computers. If you select a different font, it may not look the same when viewed using a different computer.

   • Size: Use this to choose a relative font size or select an option to increase or decrease text size (relative to the surrounding text).
   • Text Style: Use this to select a style, such as italic, bold, or underline, or to apply a structured style, for example, Code.
   • Text Color: Use this to choose a color from the color picker. If you are familiar with HTML hexadecimal color codes, you can type a specific code or you can just type a color name (for example, "blue"). 

To change the background color of the page:

1. Click anywhere in the page.
2. Click the background color block in the Format toolbar.
3. Choose a background color from the Block Background Color dialog box.
4. Click OK.

Inserting Horizontal Lines

Horizontal lines are typically used to separate different sections of a document visually. To insert a horizontal line (also called a rule) in your page, begin from the Composer window:

1. Click to place the insertion point where you want the line to appear.
2. Open the Insert menu and choose Horizontal Line.

Inserting a Table

Tables are useful for organizing text, pictures, and data into formatted rows and columns. To insert a table:

1. Click to place the insertion point where you want the table to appear.
2. Click the Table button on the Composition toolbar. The Insert Table dialog box appears.
3. Type the number of rows and columns you want.
• (Optional) Enter a size for the table width, and select either percentage of the window or pixels.
4. Enter a number for the border thickness (in pixels); enter zero for no border.

   Note: Composer uses a red dotted line to indicate tables with a zero border; the dotted line disappears when the page is viewed in a browser.

5. Click OK to confirm your settings and view your new table.

Changing a Table's Properties

This section describes how to modify properties that apply to an entire table as well as the rows, columns, or individual cells within a table. If you are not currently viewing the Table Properties dialog box, follow these steps:

1. Select the table, or click anywhere inside it.
2. Click the Table button on the toolbar, or open the Table menu and choose Table Properties. The Table Properties dialog box contains two tabs: Table and Cells.
3. Click the Table tab to edit these properties:
• Size: Use this to specify the number of rows and columns. Enter the width of the table and then choose "% of window" or "pixels." If you specify width as a percentage, the table's width changes whenever the Composer window's or browser window's width changes.
• Borders and Spacing: Use this to specify, in pixels, the border line width, the space between cells, and the cell padding (the space between the contents of the cell and its border).

  Note: Composer uses a dotted outline to display tables with a zero border; the dotted line disappears when the page is viewed in a browser.

• Table Alignment: Use this to align the table within the page. Choose an option from the drop-down list.
• Caption: Choose the caption placement from the drop-down list.
• Background Color: Use this to choose a color for the table background, or leave it as transparent.
4. Click Apply to preview your changes without closing the dialog box, or click OK to confirm them.

To view, change, or add properties for one or more cells:

1. Select the row, column, or cell, then open the Table menu and choose Table Properties. The Table Properties dialog box appears.
2. Click the Cells tab to edit the following properties:
• Selection: Choose Cell, Row, or Column from the drop-down list. Click Previous or Next to move through rows, columns, or cells.
• Size: Type a number for Height and Width, and then choose "% of table" or "pixels."
• Content Alignment: Select a vertical and horizontal alignment type for the text or data inside each cell.
• Cell Style: Select Header from the drop-down list for column or row headers (which centers and bolds the text in the cell); otherwise choose Normal.
• Text Wrap: Select "Don't wrap" from the drop-down list to keep text from wrapping to the next line unless you insert a paragraph break. Otherwise, choose Wrap.
• Background Color: Select a color for the cell background or leave it as transparent.
3. Click Apply to preview your changes without closing the dialog box, or click OK to confirm them.

Tip: To change the text color or background color of one or more selected cells or the entire table, select the cells or click anywhere in the table and then click the text color or background color icon in the Format toolbar.

Tip: To change the color of cells to the color last used, select the cell, then press Shift and click on the background color picker. This is useful when you want to use one color for individual cells.

Adding and Deleting Rows, Columns, and Cells

Composer allows you to quickly add or delete one or more cells, columns, or rows in a table. In addition, you can set options that allow you to maintain the original rectangular structure or layout of the table while you perform editing tasks.

To add a cell, row, or column to your table:

1. Click inside the table where you want to add a cell (or cells).
2. Open the Table menu and then choose Insert.
3. Choose one of the cell groupings. (You can also insert a new table within a table cell.)

To delete a cell, row, or column:

1. Click a row, column, or cell to place the insertion point. Or, select neighboring cells to delete more than one row at a time. To select neighboring cells, drag over the cells you want to select. To select individual cells in a table, hold down the Ctrl key (Windows) or the Command key (Macintosh OS) and click on the cells you want to select.
2. Open the Table menu and choose Delete.
3. Choose the item you want to delete.

To join (or merge) a cell with the cell on its right:

• Click inside the cell on the left, open the Table menu, and choose Join with Cell to the Right.

To join (or merge) adjacent cells:

• Select adjacent cells by dragging over them.
• Open the Table menu, and choose Join Selected Cells.

 Inserting an Image into Your Page

You can insert GIF, JPEG, BMP, and PNG (Portable Network Graphics) images into your web page. You can also use them to create links. When you insert an image, Composer saves a reference to the image in your page.

Note: If you plan to publish your pages to the web, it's best not to use BMP images in your pages.

Tip: It's best to first save your page before you insert images into it. This allows Composer to automatically use relative references to images once you insert them. You should also have the image file in the same folder or on the same disk as your pages.

To insert an image:

1. Click to place the insertion point where you want the image to appear.
2. Click the Image button on the toolbar, or open the Insert menu and choose Image. You see the Image Properties dialog box.
3. Type the location and filename of the image file, or click Choose File to search for an image file on your hard drive or network.
4. Type a simple description of your image as the alternate text that will appear in text-only browsers (as well as other browsers) when an image is loading or when image loading is disabled.

   Alternatively, you can choose not to include alternate text.

5. If needed, click other tabs so you can adjust the settings (for example, alignment) in the Image Properties dialog box.

Editing Image Properties

Once you've inserted an image into your page, you can edit its properties and customize the layout in your page, such as the height, width, spacing, and text alignment. If you are not currently viewing the Image Properties dialog box, follow these steps:

To edit the properties for a selected image:

1. Double-click the image, or select it and click the Image button on the toolbar to display the Image Properties dialog box.
2. Click the Location tab to edit these properties:
• Image Location: Type the filename and location of the image file. Click Choose File to search for an image file on your hard drive or network.
• URL is relative to page location: If checked, Composer converts the URL to be relative to the page's location. This is especially useful if you plan to publish your pages on a web server so that others can view them. Using relative URLs allows you to keep all your linked files in the same place relative to each other, regardless of their location on your hard disk or a web server.

  Unchecking this box causes Composer to convert the URL to a full (absolute) URL. You typically use absolute URLs when linking to images on other web servers (not stored locally on your hard disk).

  If you have never saved or published the page, you must first save the page in order to enable this checkbox. (This checkbox is not available if you open the Image Properties dialog box in a message compose window.)

• Alternate Text: Enter text that will display in place of the original image; for example, a caption or a brief description of the image. It's a good practice to specify alternate text for readers who use text-only web browsers or who have image loading turned off.
• Don't use alternate text: Choose this option if the image does not require alternate text or if you don't want to include it.
3. Click the Dimensions tab to edit these properties:
• Actual Size: Select this option to undo any changes you've made to the dimensions and return the image to its original size.
• Custom Size: Select this option and specify the new height and width, in pixels or as a percentage. This setting doesn't affect the original image file, just the image inserted in your page.
• Constrain: If you change the image size, it's a good idea to select this in order to maintain the image's aspect ratio (so that it doesn't appear distorted). If you choose this option, then you only need to change the height or width, but not both.

Setting Page Colors and Background

You can change the background color or specify a background image for the page you're currently working on. These choices affect the way text and links in your page appear to people viewing the page through a browser.

To set the colors and background for the current page, begin from the Composer window:

1. Open the Format menu and choose Page Colors and Background.
2. Edit any of the following properties:
3. • Reader's default colors: Select this if you want your page to use the color settings from the viewer's browser for text and links.
   • Use custom colors: Select this if you want to specify the colors of text and links. For each element, select a color from the drop-down list. Sample output for each type of link appears in the pane on the right.
   • Background image: Select this if you want the background of your page to be an image. Type the name of the image file or click Choose File to locate the image file on your hard drive or network.

Creating Links Within the Same Page

To create a link within the same page, for example a link that the reader can use to jump from one section to another, you must create an anchor (target location), and then create a link that points to the anchor. Anchors are also called named anchors.

1. Click to place the insertion point at the beginning of a line where you want to create an anchor, or select some text.
2. Open the Insert menu and choose Named Anchor. You see the Named Anchor Properties dialog box.
3. Type a unique name for the anchor in the Anchor Name field (up to 30 characters). If you include spaces, they will be converted to underscores ( _ ). If you selected some text in step 1, this box already contains a name.
4. Click OK. An anchor icon appears in your document to mark the anchor's location:

To create the link on which readers can click to jump to the anchor:

1. Select the text or image that you want to link to the anchor.
2. Click the Link button or open the Insert menu and choose Link. You see the Link Properties dialog box.
• If you're creating a link to an HTML file on your computer, click Choose File to locate it.
• If you're creating a link to a named anchor (target), select it from the list of the anchors currently available in the page.
• If you're creating a link to a level heading (for example, Heading 1 - Heading 6), select it from the list of headings currently available in the page.
3. Click OK.

Note: To test the link you just created, open the File menu and choose Browse Page, then click the link.

Tip: If you did not first create named anchors, you can use the Link dialog box to create links to headings that already occur in the page.

Creating Links to Other Pages

You can create links from your page to local pages on your own computer or on your workplace's network, or to remote pages on the Internet.

Tip: It's best to first save or publish your page before you create links to other pages. This allows Composer to automatically use relative references for links once you create them.

To create a link to another page:

1. Click to place the insertion point where you want to create a link, or select the text or image that you want to link to the anchor.
2. Click the Link button. You see the Link Properties dialog box.
3. Define your link:
• Link text (other pages you created): At the Links Properties dialog box, click "choose file" and locate  and select the file you want to use as a link.  
• Link Location: Type URL of the Web page  you want to link to.   Make sure you begin the url with http://
• Link to an e-mail address:  Begin the link with mailto: and then type the e-mail address.
  
• URL is relative to page location: If checked, Composer converts the URL to be relative to the page's location. This is especially useful if you plan to publish your pages to a web server so that others can view them. Using relative URLs allows you to keep all your linked files in the same place relative to each other, regardless of their location on your hard disk or a web server.
4. Click OK.
5. To test the link you just created, click the Browse button and then click the link to make sure it works as expected.

Using Images as Links

You can make images, such as JPEG, GIF, or PNG files, behave like links in your pages. When the reader clicks a linked image, the browser window displays the page that the image is linked to.

1. Select an image on your page.
2. Click the Link button on the toolbar, or open the Insert menu and choose Link.
3. Use the Link Properties dialog box to link the image to a url or to a separate local page.

Saving and Browsing Your New Page

You can save Composer documents in HTML (Web page format) or text-only format. Saving a document in HTML format preserves the document's formatting, such as text styles (for example, bold or italic), tables, links, and images. Saving a document in text-only format removes all the HTML tags but preserves the document's text.

To save a document as an HTML file:

• Open the File menu and choose Save or click the Save button on the Composition toolbar.

  If you haven't already given your page a title, Composer prompts you to do so. Composer displays the page title in the browser window's title bar when you view the page in the browser. The document's page title also appears in your list of bookmarks if you bookmark the page.

  Composer then prompts you to enter a filename and specify the location where you want to save the file. Make sure you preserve the .html extension in the filename. The first page of a Web site should be named index.html

To change the filename or location of an existing HTML file:

• Choose Save As and select a different filename or location.

When you save a page in Composer, all parts of the page (the HTML, images and other files, such as sound files and style sheets), are saved locally on your hard drive. If you only want to save the HTML part of the page, you must change the Composer preference for saving pages. 

All images must be saved as separate files or they won't be seen on your page.

To save a document as a text-only file:

1. Open the File menu and choose Export to Text.
2. Enter the filename and specify the location where you want to save the file.