Netscape Composer is a "word processing" or WYSIWYG [pronounced "wisi-wig"] editor for creating web pages. WYSIWYG means "What You See Is What You Get", and pages look similar in the editor to how they will look in a browser. It comes free with the free Netscape browser.

To run Composer, run the Netscape browser (Navigator) and click on the Communicator entry in the Menu bar. Then click on Page Composer. You will see in the Composer window the menu and tool bars, and the rest of the window will be blank. This blank space represents your blank page.

Because Composer is a "word processing" program, it has many features that are similar to word processors such as Microsoft Word or WordPerfect. In addition, there are additional features in Composer that are unique to the creation of web pages. Because you are probably familiar with word processors, we won't discuss those features. Instead, let's look at some of the unique features of Composer.

Page Background

To set the background of a web page to either a solid color or to a graphic image, right-click on the page background (in an area that is not part of a table). Click on Page Properties. Click on the Colors and Background tab.

Next, to set a solid color for the background, click on the Background icon and select your color. To set a graphic image as the background, click on the Use Image check-box and enter the name of the graphic file. If the file is in a different folder than that of your home page, click on the Choose File button and then manipulate the folders to locate the file; double click on the file.

Graphic Images

To insert icons and other graphic images into your page, position the keyboard cursor where you want the image inserted. Click on the Image icon in the Tool Bar. Enter a file name in the Image location field. If you prefer, click on the Choose File... button and manipulate the folders to locate the graphics file; double click on the file and then click on OK.

Notice that the Image Properties window that allows you to insert images also allows you to influence the alignment of graphics and text, the size of the graphics, and extra space around the graphics. You can learn more about these features by experimenting with them. A better way of aligning graphics and text is through the use of tables (discussed below).

Every graphic should have a text-description attached to the graphic. Click on the Alt Text/Low Res... button. Enter a brief description into the Alternate text field that describes the graphic. This text description will load faster than the graphic, and people can read the description while they are waiting for the graphic to load. Also, blind people will be able to hear the description via their text-to-speech converters.

To modify the parameters of a graphic that is already inserted in your page, right-click on the graphic and then click on Image Properties.

To use an icon as a link, right-click on the icon to obtain the Image Properties window. Then click on the Link tab and enter the name or path to the HTML file that is the destination of the link.

To delete a graphic image, click on the graphic to select it and press the Delete key.

Horizontal Lines

To draw horizontal lines across your page (useful to separate things, but don't over do it), position the keyboard cursor at the point where you want the line inserted and click on the H. Line icon in the Tool bar.

Links

To use existing text as a link, highlight the text and click the Link icon in the Tool bar. If the link is to another web site, enter the URL (http:// address) in the Link To field. If the link is to a XHTML file in your Project folder, put the name of the file in the Link To field; do not include hard drives on your system as part of the file names--put only the name of the file! If the link is to a file in another folder on your computer, do not link it in that folder. Instead, copy the file to your Project folder and then link to it.

To use text that hasn't been entered yet as a link, position the keyboard cursor at the point where you want the link to occur. Click on the Link icon. Enter into the Link Source field the text that will be used as the link. Enter into the Link To field, the URL or file name, as explained above.

Browser Title

To give your page a title that will appear in the Browser title bar (and also in the results from search engines), right-click on the page background (in an area that is not part of a table). Click on Page Properties. Enter a title that describes your page.

Tables

Tables provide a way of organizing graphics and text in columns and rows. The intersections of the columns and rows are called cells, and graphics and text are entered into the cells. Tables are useful in aligning icons with text, and icons with icons. For example, a table consisting of one row of two cells could be used to align an icon in the left cell with text in the right cell.

Position the keyboard cursor at the point where you want the table inserted and click on the Table icon in the Tool bar. Enter the number of rows and columns you want. If you do not want cell-border lines to show in your page, set the Border Line Width to 0. The Cell Spacing parameter controls the width of the border. The Cell Padding parameter controls the amount of space between adjacent cells. Set these parameters appropriately. If you want the table to be as wide as the page window, keep the Table Width at 100% of the parent cell. If you want the table width to automatically adjust itself to just fit the text or icons that are in the table, de-select the Table Width parameter. If you want columns to automatically fit themselves to the text or icons inside, de-select the Equal Column Widths parameter.

Notice that you can change the background color of cells and tables.

To change the properties of a table that already exists, right-click on the table and then click on Table Properties.

To delete a cell, row, column, or the entire table, right-click on the object to be deleted and then click on the appropriate entry in the Delete menu.

XHTML Level Editing

After you have completed a web page, you will probably need to edit the page to make corrections and changes. You can do this editing with Composer, or you can do XHTML-level editing with a text editor.

Give Composer the path to a text editor. Click on Edit | Preferences. Enter the path to the text editor into the External Editors | HTML Source: field. For example: c:\windows\notepad.exe. Click OK.
Click on Edit | HTML Source. A window containing the HTML tags will appear, and you can use the text editor to change and save the tags.

[ Site Map ] [ Distance Learning ][ Home ] [ Up ] [ Dreamweaver ] [ FrontPage ] [ Composer ] [ Word Processors ] [ Presentation Programs ]