Horizontal Line Properties dialog box
Netscape Composer integrates powerful What-You-See-Is-What-You-Get (WYSIWYG) document creation capabilities into Netscape Communicator's already rich set of World Wide Web features. In addition to electronic mail, threaded discussion group, and file transfer features included in Netscape Communicator, Composer makes composing for the Web, email, or newsgroups a simple cut-and-paste, drag-and-drop process.
The document creation capabilities in Netscape Composer are designed to provide both experienced and beginning content creators with a simple yet powerful solution for editing and publishing online documents. WYSIWYG editing allows first-time users to create dynamic online documents easily and publish them to local file systems and remote servers with ease.
There are a lot of things you can do with Composer:
A Composer window opens containing a blank page. The original browse window remains open behind the Composer window.
A browse window opens containing Web page templates available from the Netscape Web Page Starter site (you can also access this site from the Help menu). Select a template and choose Edit Page from the File menu to use the template as the basis for a new document.
A browse window opens containing the Page Wizard. The Wizard is a special page on the Netscape home site that walks you through the steps for creating a Web page. When you've completed the steps, you'll have a page that you can then open in the Composer and continue building on as your skills improve.
Note: The templates and Page Wizard are located on the Netscape home site. You must be connected to the Internet to access them.
The current browse window becomes an edit window containing the document you were viewing.
A Composer window opens containing the specified file. The original browser window remains open but behind the Composer window.
The two Composer toolbars contain buttons corresponding to frequently-used commands. You can access most of these commands from the menus, but it's generally quicker to use the toolbars.
| Composition Tools | Use these items to create, open, and save HTML files, publish (upload) files to a remote server, view your HTML document in the browser, perform standard editing tasks, create links and targets, and insert images, horizontal rules, and tables. | |
| Formatting Tools | Use these items to apply paragraph formatting, specify fonts, font sizes and font styles, apply text color, control text alignment, and check spelling. |
You can reposition a toolbar by dragging it to the area you want. Depending on the area to which you move the toolbar, it will either snap into position (the area below the menus), or become a floating palette (anywhere else).
Pop-up menus are a handy way to get to frequently used commands: you select an object (such as text or a link) and then right-click the mouse to display the pop-up menu. The commands that are available are completely dependent on what's selected when you right-click. For example, right-clicking while on a link provides you with commands to copy the link or modify its properties. If you right-click while on an image, you'll have quick access to commands to save the image under a new name or display its properties.
| Place the pointer on | Use the pop-up menu to |
| Text | Change character, paragraph, or list properties, insert a new link, or paste from the clipboard. |
| A link | Change link, paragraph, or list properties, open the link in a browse or edit window, copy or remove the link, or add a bookmark for the link. |
| An image | Change link, paragraph, or list properties, create a link using the image, save the image under a new name, cut, copy, or paste. |
| A horizontal line | Change horizontal line, paragraph, or list properties, cut, copy, or paste. |
| An HTML tag marker | Change tag, paragraph, or list properties, cut, copy, or paste. |
| A table | Change paragraph, character, or list properties; change table, row, or cell properties; insert or delete a table, column, row, or cell; insert a link; paste. |
Several drag-and-drop operations are available while using the Composer. You can:
<provide overview information>
Note: http://home.netscape.com is the address, or URL (Universal Resource Locator), for Netscape's home page. Every link in a document has a URL similar to this one.
Once you've completed the steps outlined above, you will have authored a page that links to another page. The underlined text and different color indicate a link to another Web page.
To browse your new page:
If you're online (connected to the Internet), right now you can click on the link and view Netscape's home page. If you're not, open this file the next time you connect and test your link.
Editing text in the Composer works the same as in most word-processing applications. These features are of vital importance since writing is what you'll spend most of your time doing when creating your Web pages.
As you move the cursor over the Composer window, it appears as an I-beam. When you click the mouse, a small flashing vertical bar marks the insertion point where text typed is placed in the window. You can start typing right away.
The Composer supports the special keyboard characters, such as the ampersand and percent sign. To insert symbols, such as the copyright symbol, run the Windows Character Map application (or use the Key Caps program on the Macintosh). Change the font to Times Roman, copy the symbol you want, and paste it into the edit window.
Note: Choose Edit|Undo to cancel the effects of the most recently performed command (not all actions can be undone). Choose Edit|Redo to perform the most recent action again.
Tip: Choose Display Paragraph Marks from the View menu to see where paragraph marks are located in your document--they appear as black rectangles. A short horizontal line appears to indicate the end of the page.
You can enter text into your document by pasting from almost any source. For example, you can select text on a page you are viewing in the browse window and copy it with the Edit|Copy command. You can then paste it into the page you are currently editing by choosing Edit|Paste.
Tip: In Windows, you can right-click your mouse on selected text to quickly cut, copy, or paste the text.
Note: Unlike the Composer window, text that you cut or copy from the Browser window does not retain formatting information.
Composer checks for spelling errors using its main dictionary, which contains most common words. If Composer finds a word that is not in the main dictionary, it displays the word in the Spelling dialog box and gives you choices for correcting the possible misspelling.
You can check the spelling of one word, a selection of text, or an entire document.
To check the spelling in the current document:
The Check Spelling dialog box appears.
Checks spelling in the document and gives you choices for correcting the possible misspelling.
Displays a word not found in the current dictionary.
Type or select a word from the Suggestions list to replace the word not found in the current dictionary.
Lists suggested replacement words from the current dictionary.
Select the dictionary to which you want to add the word in the Not In Dictionary box if the word is correctly spelled but not found in the main dictionary -- for example, the name of a person or city that you type often.
Does not correct the spelling of the word in the Not In Dictionary box. Composer will continue to display the word during the spelling check.
Leaves the word in the Not In Dictionary box unchanged during all spelling checks in the current document.
Change
Changes the word in the Not In Dictionary box to the word in the Change To box. If the Change To box is empty, the name of the button changes to Delete.
Changes the word in the Not In Dictionary box to the word in the Change To box for all instances in the document.
Adds the word in the Not In Dictionary box to the dictionary selected in the Add Word To box.
Formatting your text and using color goes a long way to making your Web pages or presentations unique and interesting. Add images, horizontal lines, tables, and links and you start to understand why the Web has attracted so much attention. These elements are the stuff of the Web page.
Tip: Choose Web Page Starter from the Help menu (Guide|Web Page Starter on the Macintosh) to get information about resources for new Web page authors.
There are two types of format styles available to you in Composer:
Paragraph formatting affects all paragraphs in the selection, or the paragraph in which the insertion point located.
These paragraph formats are available in Composer:
In addition to the formats mentioned above, you can also apply center, right-justify and left-justify alignment options.
Headings divide sections of text. HTML defines six heading levels, which is reflected in the six heading choices available from the Paragraph control on the Format Tools toolbar, or by choosing Paragraph from the Format menu.The headings differ from regular text by their type size.
Examples of heading levels
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
This format is used for a Web page "signature" that indicates who wrote the page and who to contact for more information, for example:
Carlos Goldstein@netscape.com
You might want to also include the date, any copyright notices, and other applicable information. This format usually appears at the bottom of the Web page and is often preceded by a Horizontal Line.
The List Item style formats text in a list with a special symbol or bullet at the beginning of each line. The Composer provides support for the following types of lists:
Unnumbered: Preceded by a bullet or other symbol.
Numbered: Preceded by numbers or letters.
Directory: Lists of short items that display horizontally in columns, such as DOS directory listings.
Menu: Lists of short items but without any bullets or numbers.
Description: Sometimes called a Definition or Glossary list. Lists of definitions or when an indented list is needed.
Note: Netscape Navigator does not support display of the Directory and Menu styles, but other browsers may display them.
Tip: In Windows 95, you can right-click your mouse anywhere in a paragraph and choose Paragraph/List properties to select a list type from the dialog.
Most browsers remove any extra white space, tabs, and returns present in your text. However, text that contains white space and is formatted with this style displays with the white space intact. This is useful for things like code examples, tables, mail messages, etc., that you want to be displayed in a fixed-width font, like the example below:
document.write ("<p align=left> Today is: "+Date ());
Use the Description Title format for glossaries, definition lists, or other situations where left-justified short entries pair up with longer blocks of indented text. Usually used in combination with the Description Text format, as in this example:
Use the Description Text format for glossaries or other kinds of lists where a single term or line needs to be associated with a block of indented text, for example:
Lets you specify a paragraph style and text alignment for the selected paragraph(s). If you select the list Item paragraph style, additional list-specific options become available.
Paragraph style
The available paragraph styles you can apply to the selected paragraph.
Additional style
Additional attributes for the paragraph style you've selected. Select List to enable the list and Number/Bullet style fields which allow you to specify the type of list you want in your document. The Block Quote attribute can be used w/ any paragraph style.
List style
The type of list you want. Select the Unnumbered, Numbered, Directory, Menu, or Description List style.
Number/Bullet Number
Specify the type of sequential indicator to use for Numbered lists, such as 1,2,3, or A,B,C. Bullet: specify the type of bullet to use (square, circle, or open square) for the Unnumbered list style .
Starting number
The number with which to begin a Numbered list. Type a number in the box.
Align
Lets you specify whether to align the selected paragraph to the left, right, or center of the page.
Note: Netscape Navigator does not support the Directory or Menu styles (it displays these text styles as Normal), but other browsers may display them. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
You can apply character styles to one or more characters, within a paragraph, or spanning parts of multiple paragraphs. The following character styles are currently supported in the Composer and are available from Format|Character, the Character Properties dialog, and the toolbar:
Note: The JavaScript server and client tags are also treated as special character styles. For more information about applying JavaScript tags, see Using JavaScript.
Lets you specify attributes such as size, color, style, and JavaScript for the selected character(s).
Size
The point size of the selected character(s). This determines how large or small the characters appear. This box will be empty if the point size of the selected text varies. You can type a point size in the box or select one from the drop-down list. Default sets the size to that specified by the default paragraph style.
Color
The color of the selected character(s). You can select to use the document's default text color as specified in Document Properties|Appearance, or define a custom color.
Style
The style of the selected character(s), such as italic, bold, or underline. You can also select to apply a special style called blinking which causes text to blink on and off. JavaScript Allows you to specify special JavaScript attributes for the selected character(s).
Choose Color
Lets you choose a custom color from the Color dialog box.
Clear Style Settings
Resets any style checkboxes you have marked to unselected.
Clear All Settings
Resets all settings you have made in this dialog box to unselected or blank.
Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Although you can't change the font while editing a document (with the exception of a fixed-width font available when you apply the Fixed width character style or the Formatted paragraph style), you can display a different font when browsing the document (choose Composer Preferences from the Edit menu and specify the font in the General panel). Most graphical Web browsers (including Navigator) default to using a proportionally-spaced font such as Times Roman for most of the text in document .
<Add info re: font tags>
Applying color to selected textis a good way to emphasizedifferent parts of your Web page.
You can adjust font size by choosing Font Size from the Format menu or using the size increment buttons on the Format Tools toolbar.
add more information
To insert a horizontal line:
Tip: Double-clicking non-text objects in your document lets you modify their properties.
Strictly speaking, you don't need to know HTML to use the Composer. However, it pays to be familiar with what's really going on inside an HTML document when you're troubleshooting a Web page you're working on. If you don't get the results you want, it's useful to look at the raw HTML file and tags to see what the problem might be.
Formatting in HTML documents consists of tags of plain ASCII text instructions enclosed in angle brackets <>. A format area typically uses two tags: one at the beginning and another at the end. For example, to designate a particular line as a heading, you enclose the heading text inside tags that mark the beginning and end:
<H3>Hello World Wide Web!</H3>
The <H3> tag marks the beginning of text to be considered a level 3 heading (Heading 3); the </H3> tag marks the end of the text heading. Instead of the usual manual way of inserting this tag, the Composer lets you automatically apply an H1 format using the drop-down style list on the Paragraph toolbar, or by choosing Format|Paragraph.
How Composer formats correspond to HTML tags
| This Composer format | Corresponds in HTML to |
| Address | <address> |
| Formatted | <PRE> |
| List Item | <LI> |
| Unnumbered | <UL> |
| Numbered | <OL> |
| Directory | <DIR> |
| Menu | <MENU> |
| Description List | <DL> |
| Description Title | <DT> |
| Description Text | <DD> |
If you already have an understanding of HTML and want to insert particular HTML tags that aren't available from the Composer's format menus, choose Insert|HTML Tag. A dialog box appears that lets you type the HTML you want to insert at the selected place in your document.
When typing tags in this box, press Enter at the end of each line to ensure that your HTML is easily readable. Click Verify to have the Composer check the HTML you've typed. The Composer checks to make sure you have both opening and closing brackets < > around your HTML, and quotation marks around any attribute text.
This feature is particularly useful for inserting HTML form tags, and Java applet and plug-in code into your documents. Although the Composer does not display these objects, it does insert special HTML tag icons so you know where they are.
HTML tag icons
You can still insert and edit them using the HTML Tag box, and then browse your document to see them.
Tip: Double-click the tag icons to display the HTML Tag box and quickly edit your HTML, Java applet, or plug-in code.
Tables are useful for presenting information you want to display in a grid, such as a calendar, or in a spreadsheet, such as financial data. But you can also use tables whenever you want to have greater control over page layout than you normally would. For example, you could combine graphics in a table to create a resume or a newsletter. Or, you could create a table that encompasses an entire page, and then nest tables within the main table for even more layout control.
To insert a table:
About the New Table Properties dialog
Lets you create a table and specify attributes such as number of rows and columns, border line width, cell spacing and padding, table width and height, color, and captioning. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Number of rows
The number of rows in the table. Type a number in the box.
Number of columns
The number of columns in the table. Type a number in the box.
Border line width
The size (in pixels) of the border lines around cells. Type a number in the box. Type 0 to make the border invisible.
Cell spacing
The space (in pixels) between cells in the selected table. Type a number in the box.
Cell padding
The padding (in pixels) within each cell. This sets the top, bottom, right, and left margins of each cell in the selected table. Type a number in the box.
Table width
The width of the selected table. You can specify table width as a percent of the window width or as a number of pixels. If you specify the width as a percent of the window, the table width changes whenever the window changes. Type a number in the box and select "pixels" or "% of window."
Table min. height
The minimum height of the selected table. This is the smallest height the table can have. If you type more text in the table, the table automatically resizes to fit the text you enter. You can specify table height as a percent of the total window height or as a number of pixels. If you specify the height as a percent of the window, the table height changes whenever the window height changes. Type a number in the box and select "pixels" or "% of window."
Table color
The background color of cells in the selected table. You can use the document's default background color as specified in Page Properties|Appearance, or define a custom color.
Include caption
Lets you inserts space for a centered line of text above or below the selected table.
Table alignment
Lets you select a left-justified, centered, or right-justified alignment for the table within the document.
Note: If you are inserting a table within a table (called nesting tables), you can also set the minimum height and width of the nested table as a percentage of the parent cell (the cell of the table in which the nested table resides). The nested tables height and width changes whenever the parent tables height and width changes. Type a number in the box and then select "% of parent cell."
Once you've created a table, choose Format|Table (Format|Table on the Macintosh) to set various properties for rows and cells, or modify the properties you set for the table itself.
Note: The settings you choose in the Table properties dialog box always override the settings used when you first created the table.
To set table properties:
About the Table Properties dialog box
Lets you specify attributes such as border line width, cell spacing and padding, width, height, color, and captioning for the selected table. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Border line width
The size (in pixels) of the border lines around cells. Type a number in the box.
Cell spacing
The space (in pixels) between cells in the selected table. Type a number in the box.
Cell padding
The padding (in pixels) within each cell. This sets the top, bottom, right, and left margins of each cell in the selected table. Type a number in the box.
Table width
The width of the selected table. You can specify table width as a percent of the window width or as a number of pixels.Type a number in the box and select "pixels" or "% of window."
Table min. height
The minimum height of the selected table. This is the smallest height the table can have. If you type more text in the table, the table automatically resizes to fit the text you enter. You can specify table height as a percent of the total window height or as a number of pixels. If you specify the height as a percent of the window, the table height changes whenever the window height changes. Type a number in the box and select "pixels" or "% of window."
Table color
The background color of cells in the selected table. You can use the document's default background color as specified in Page|Properties|Appearance, or define a custom color.
Include caption
Lets you inserts space for a centered line of text above or below the selected table.
Table alignment
Lets you select a left-justified, centered, or right-justified alignment for the table within the document.
Note: If you are inserting a table within a table (called nesting tables), you can also set the minimum height and width of the nested table as a percentage of the parent cell (the cell of the table in which the nested table resides). The nested tables height and width changes whenever the parent tables height and width changes. Type a number in the box and then select "% of parent cell."
To set row properties:
The Row properties panel appears, allowing you to specify properties such as horizontal and vertical text alignment, and text color.
About the Row Properties dialog
Lets you specify attributes such as horizontal text alignment, and vertical text alignment, and text color for the selected table row. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Text alignment
Position of text relative to the top, bottom, and sides of cells in the selected table row. You can specify horizontal and vertical alignment or leave the alignment as it was set when the table was created.
Row color
The background color of cells in the selected table row. You can use the document's default background color as specified in Document Properties|Appearance, or define a custom color.
To set cell properties:
The Cell properties panel appears, allowing you to specify properties such as spanning additional rows and columns, horizontal and vertical text alignment, text style and wrapping, cell width and height, and cell color.
Note: If you are modifying a table within a table (called a nested table), you can also set the minimum height and width of the cell in the nested table as a percentage of the parent cell (the cell of the table in which the nested table resides). The height and width of the cell in the nested table changes whenever the parent cell's height and width changes. Type a number in the box and then select "% of parent cell."
About the Cell Properties dialog
Lets you specify attributes such as spanning additional rows and columns, horizontal and vertical text alignment, text style and wrapping, cell width and height, and cell color for the selected cell. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Cell spans
Lets you set the selected cell to span more than one column or row. Type a number in the rows box to span additional rows. Type a number in the columns box to span additional columns.
Text alignment
Position of text relative to the top, bottom, and sides of the selected cell. You can specify horizontal and vertical alignment or leave the alignment as it was set when the table was created.
Header style
Centers the text in the selected cell and sets its style to bold.
Wrap text
Lets you set the text in the selected cell to wrap to the next line when it reaches the preset width of the cell. Turning "Wrap text" off causes the cell (and the table) to expand to fit the text you type.
Cell width
The width of the selected cell. You can specify cell width as a percent of the table width or as a number of pixels. If you specify the width as a percent of the table, the cell width changes whenever the table width changes. Type a number in the box and select "pixels" or "% of table."
Cell min. height
The minimum height of the selected cell. This is the smallest height the cell can have. If you type more text in the cell, the cell automatically resizes to fit the text you enter. You can specify cell height as a percent of the total table height or as a number of pixels. If you specify the height as a percent of the table, the cell height changes whenever the table height changes. Type a number in the box and select "pixels" or "% of table."
Cell color
The background color of selected cell. You can use the document's default background color as specified in Page|Properties|Appearance, or define a custom color.
If you plan to create large tables with many columns and rows, you might
want to consider displaying tables flat in order to save time and
your computer's memory. You can still edit individual cells and modify
their properties when the table is flattened, and when you browse your
document the tables display normally. Select View|Display Tables (when
the item is checked it's selected) to display tables normally in the edit
window. When View|Display Tables is unchecked, the Composer displays a
table as one long series of cells in successive order. Borders and colors
are not displayed. The following example shows a 2-column, 3-row table
with a normal display (View|Display Tables checked) on the left, and the
same table with a flattened display on the right.
|
|
|
There are two ways that images typically are presented. The most common way is as an inline image, where the picture appears as part of the Web page. The less common way is as a separate external link that you need to download apart from Web pages. Images are actually separate image files and do not "live" in the HTML document itself. The images that appear on your Web page can be image files on your local disk, or on a remote computer.
Most of the current Web browsers support either of two image formats; the Composer supports both formats as well:
GIF files lack the higher quality of JPEG files but are usually faster because they're more compact and optimized for electronic downloading.
You can get images by drawing them yourself, scanning them, or buying them as part of a commercial clip art package. You can also find GIF images out on the Net in one of the many image archives available. If you intend to use images on your Web pages, it's wise to create your own, get permission from the owner of an image, or use royalty-free clip art so you don't infringe on a possible copyright.
Composer provides two alternatives to displaying images: alternate text and low-resolution images. Alternate text is displayed in place of images. You should specify alternate text for those readers who use text-only browsers.
Low resolution images are another alternate to normal image display. You simply specify a low-resolution image to display while the normal image is loading.
add tip re: drag and drop images, resizing images
Tip: If the document you're editing contains an animated GIF file, press Esc to stop it from continually loading so that you can work in the document.
Inserting an image in your Web page either copies the image file to the same directory as that of the parent document--the Web page you're editing, or leaves the image file where it is, depending on the settings you've specified in Composer Preferences.
Tip: To quickly insert an image, cut and paste it from the clipboard, or drag and drop it to the location you want on your page.
To insert an image:
Important: If you move an image file from the specified location, it will no longer appear on your Web page.
Lets you insert a new image or modify an existing image's properties.Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Image file name
The name of the image file you want to insert in your document, or whose properties you want to modify. The editor supports .GIF and JPG image file formats. If you're not sure of the file name or its location, click Browse to select an image file from the directory list.
Alternative image
A low-resolution version of the image specified above. This image loads first while the higher resolution image is loading on top. Don't assume that everyone has a T1 connection! If you're not sure of the file name or its location, click Browse to select an image file from the directory list.
Alternative text
The text that you want to have appear in place of the specified image file. You should always specify alternative text for readers who use text-only Web browser such as Lynx, or who have graphics turned off. If you don't include this alternative, your readers may see placeholders instead of informative text.
Alignment
The position of the selected image relative to text, top, center, or bottom. You can also specify whether to have the image right-align or left-align to the page. To see alignment changes you've made, view your page in the browser.
Dimensions
The height and width of the new or currently selected image as measured in pixels. Click Original Size to undo any changes to the size you've specified.
Space around
The amount of white space (space where no text is allowed) on the right and left, top and bottom of the image. You can also select to have a black border surround the image and specify its width in pixels.
Copy image
When checked, this option makes a copy of the image file and places it in the same directory as the current document. This setting is whatever you have specified in the Publish panel of the Composer Preferences dialog but you can override it here.
Remove Image Map
Click this to remove all link regions from the image. An image map is a special type of image that contains links to different locations within the same image.
Edit Image
Click this to edit the image using the external editor you specified in the General panel of the Composer Preferences dialog box. If you haven't specified an image editor, you will be prompted to do so.
Enter the text string you want to display in place of the image, for example, a caption or brief description of the image.
Enter the name of the lower resolution image you want to display while the main image is loading. Click Choose File to browse for the file location.
Click this edit the image file using the external image editor you specified in the General panel of the Composer Preferences dialog.
Placeholder topic - information to follow
Use the Document Properties dialog box to set various properties for documents. When you're done, click Apply to make the changes you've specified and leave the dialog box open. Click OK to make the changes and close the dialog box.
Displays information about the current document and lets you provide additional information helpful to Web users searching for specific topics. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Location
The location of the current document on your local disk.
Title
The text you want to appear in the window title when the document is browsed. Although optional, it's a good idea to specify a title for your documents since this is how most Web search tools locate specific Web pages. So, if you want readers to be able to locate your page easily, select a useful title that conveys what your page is all about.
Author
The name of the person who created the current document. This information can be helpful to readers who've found your document by using a Web search tool and must now select from a list.
Description
A brief description of the contents of your document. Again, this information can be helpful to readers searching for a specific topic.
Other Attributes
Type keywords that you want searching services such as Yahoo to use to help users locate your document on the Web. Type the category name (obtained from a catalog server) you think best applies to your document. Classification names are another method used by searching services to locate documents.
Lets you specify how to use the browser's colors for link text and document background or specify custom colors for the current document (Page Properties), or for all documents (Composer Preferences). Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Use custom...
Allows you to set your own colors for text, linked text, and document background (default) and save it in the document.
Use Browser's...
Lets you use the colors set in the General preferences panel for the current document.
Color schemes
Lets you select a scheme from the list.
Custom colors
Allows you to specify the color for Normal, Link, Active Link, and Followed Link text. Click on a button to display the Color dialog and select the color you want. Sample text in the color you've specified appears to the right.
Background
Click this to display the Color dialog and choose a solid color to appear as the background for the current document.
Use image
Check this box to use an image as the background and type an image file name. If you're not sure of the file name or its location, click Browse to select an image file from the directory list. Note: Background images appear tiled and override background color selections.
This panel displays optional information that your online service provider might want you to include in your document. This information doesn't actually appear in the document when edited or browsed--only in the source HTML. Contact your provider for more information.
The Composer Preferences dialog box lets you set various properties that you want to apply to all the documents you create in the Composer. Use the Page Properties dialog when you want settings to pertain only to the current document.
Lets you specify which applications to open when you want to make changes to HTML (advanced users) and image files. You can also indicate a default template file to use for all new documents. Click OK to make the specified changes and close the dialog box.
Author name
The default name used by the editor to indicate who created a document. This information can be helpful to readers who've found your document by using a Web search tool and must now select from a list.
External editors
The path and file name of the text and image editors of your choice. For example, if you want to use Notepad to edit the actual HTML source, type C:\WINDOWS\NOTEPAD.EXE. Choosing HTML Source from the Edit menu starts Notepad with the current document displayed. If you're not sure of the file name, click Browse to find the application. Note: When you edit HTML source using this method, you must save your changes in the source editor and then choose View|Reload to see your changes.
Template location
The path and file name of the template you want to use for all new documents. This template is used when you choose File|New Page|From Template. The default setting is the URL for the Netscape Web Page Starter site.
Auto Save
Specify the interval (in minutes) between automatic saves of your document. If you are working on a new document that hasn't been saved, the editor prompts you to save it.
Restore Default
Note: When you edit HTML source using View|Edit Document Source, you must save your changes in the source editor and then choose View|Reload to see your changes.
Lets you specify how to use the browser's colors for link text and document background or specify custom colors for the current document (Page Properties), or for all documents (Composer Preferences). Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Use custom...
Allows you to set your own colors for text, linked text, and document background (default) and save it in the document.
Use Browser's...
Lets you use the colors set in the General preferences panel for the current document.
Color schemes
Lets you select a scheme from the list.
Custom colors
Allows you to specify the color for Normal, Link, Active Link, and Followed Link text. Click on a button to display the Color dialog and select the color you want. Sample text in the color you've specified appears to the right.
Background
Click this to display the Color dialog and choose a solid color to appear as the background for the current document.
Use image
Check this box to use an image as the background and type an image file name. If you're not sure of the file name or its location, click Browse to select an image file from the directory list. Note: Background images appear tiled and override background color selections.
Lets you specify Composer settings for saving remote documents locally so you can edit them, insert images, and publish files to remote servers.When you're done, click Apply to make the changes you've specified and leave the dialog box open. Click OK to make the changes and close the dialog box.
Maintain links
Makes sure that inserted links are relative to the current document. When saving a document from a remote server to your local disk, this option insures that any links in that document to other files in the same directory are relative when saved locally. These links will work locally if you've also saved the remote files they pointed to. Links to files outside the document's directory are absolute. Unchecking this option means that the link path names are not modified and links local to the saved document may no longer work.
Keep images with
Saves a copy of the image file in the same location as the document. Since images are not located in the document itself, unchecking this option means that only the HTML document is saved locally, not the image files. Leaving this option checked (recommended) means that a document's images are always kept in the same directory as that document.
Publish to
FTP: The default location to which you want to upload your Web pages using the File Transfer Protocol. You may need to contact your internet service provider to find out what to type here. For example, if your service provider is America Online, the URL in this box might look something like: ftp://ftp.aol.com/docs/yourname/index.html.
HTTP: The default location to which you want to upload your Web pages using the Web server protocol. If you are not running your own Web server, you may need to contact your internet service provider to find out what to type here. For example, the URL in this box might look something like http://commercialweb.com/docs/yourname/index.html.
Browse to (HTTP)
The default location of your published Web pages. For example, if you publish your Web pages to: http://commercialweb.com/docs/yourname/index.html, you should type this URL in the box. You can then choose Go|Default Publish Location in the browser to display your published Web pages.
User name
The name you type when accessing the network your Web pages are located on.
Password
The password for your user name.
A hyperlink is an active part of a document. When you click a hyperlink, you can link to
Hypertext and hyperlink documents are commonplace in computing now. Consider the MS Windows, Macintosh, and OS/2 Help systems, for example. Help typically displays highlighted areas that you can click to access additional information. This other information might be contained elsewhere in the same file or in another help file on your computer. On the Web, hyperlinks access information on your own computer, and potentially on any accessible computer on the Internet. The information you access, stored in computer files, can produce words, sounds, pictures, or even action video on your own computer.
Uniform Resource Locators or URLs are street addresses for bits of information on the Internet. Most of the time, you can avoid trying to figure out your own URLs by simply navigating to the information you want to point to with your browser, and then copying and pasting the long string of "stuff" into your link. But it's often useful to understand what a URL is all about, and why it has to be so long and complex. Also, when you begin publishing your own information on the Web, you'll want to know something about URLs so that you can tell people how to find your Web page.\
Most URLs have four parts: the protocol, the host name, the directory, and the file name; for example:
http://mysystem.com/docs/index.html
http://mysystem.com
ftp://mysystem.com
gopher://mysystem.com
This is the same machine, but with three different information servers. As long as all three are installed on that system and available, there's no problem having the same host name.
Tip: To create a link to a page displayed in the browser, drag the link icon from the browse window (left of the location box) to an edit window (Macintosh and Windows only).
When you link to a local document, you're linking to a document on your computer; documents you reference don't have to be in the same directory (it's a good idea though). Linking to a remote document means you're linking to somewhere on the Internet rather than on your local disk.
You can create links in your documents by dragging them from other windows and then dropping them into the edit window (Macintosh and Windows only). For example, you can drag a link from a browse, bookmark, mail, or news window and drop it on a document in the Composer window. You can also create links using the Link Properties dialog.
Link Source displays the selected text you want to use to create a link. To change this text, select the text in your document and retype. To see the change reflected in the dialog, select the text before opening the dialog.
Note: If you don't have any text selected when inserting a new link, the title of the document to which you're linking appears in your document as the link text.
The Show targets in option lets you specify displaying either the named targets in the current document or those in the file specified in the Link to page or file box.
Lets you insert a new link or modify an existing link's properties. Click OK to make the specified changes and close the dialog box. Click Apply to preview the changes you've specified and then click Close to accept the changes and exit the dialog box.
Link source
Displays the selected text or image you want to use to create a link. To change linked text, select the text in your document and retype it. To see the change reflected in the dialog, select the text before opening the dialog. Note: If you don't have any text selected when inserting a new link, the title of the document to which you're linking appears in your document as the link text.
Link to page or file
The local file name or remote URL to which you want the selected text to link. Type a URL or click Browse File to select a file.
Select a named target
The named targets present in the current document or selected file (depending on how you've set the "Show targets in" option). Select a target to which you want to link the selected text.
Show targets in
Lets you specify to display either the named targets in the current local document or those in the local file specified in the Link to page or file box.
Browse File
Lets you select an HTML file to link to
Remove Link
Unlinks the selected linked text. The Link to page or file box is cleared. If the current selection contains more than one link, an alert box appears asking you if you want to remove all links.
Just as with text, you can configure images to behave as links in your documents. When you click a linked image, the browse window displays the page that the image is linked to.
You see the Link properties dialog box.
Choose File|Browse Document and then, click on the image to go to the linked page.
If you want to link to a specific place within a document rather than just linking to the document itself, you create a target (also called named target or anchor in HTML). You can do this by inserting a target in one document, and then creating a link in the same document, or another document that points to that target. When you click on the link in the browser, the browser opens the document containing the target and scrolls to the target location.
When you specify the path name of a file to be linked to as a single file name, Navigator Gold looks for the listed file in the current directory (same directory as the current file), even if it is looking at that file over a network. This is a relative path name. Relative path names point to the document you want to link to by describing its relation to the current document.
Relative path names
| Path name | Means |
| link.html | link.html is located in the current directory. |
| files/link.html | link.html is located in the directory (or folder) called files and the files directory is located in the current directory. |
| docs/files/link.html | link.html is located in the files directory, which is located in the docs directory, which is located in the current directory. |
| ..link.html | link.html is located in the directory (or folder) above the current directory (the same directory the current directory is in). You can use multiple "../" to indicate a file location further up the directory structure. |
Absolute path names point to the document by starting at the top level of your directory hierarchy and working down through all the subdirectories to reach the file. You should use absolute path names when linking to a page from another Web site, such as the Netscape site.
Note: Check both publish options in the Composer Preferences dialog to take care of this automatically.
Generally, when linking together your own documents, you'll want to use relative path names. If you specify your links as absolute path names and then move your files elsewhere on the disk, or rename a directory or a disk listed in that absolute path, then your links to these files might not work.
Absolute path names or URLs
| Path name or URL | Means |
| /docs/test/link.html | link.html is located in the directory /docs/test. |
| /C|/docs/html/link.html | link.html is located on the C: drive in the directory docs/html. |
| http://netscape.com/link.html | link.html is located on the Netscape Web server. |
Now that you've learned the basics of Web page authoring with Navigator Gold, it's time to let other people on the Internet see what you've accomplished. In this chapter you'll learn how to publish your Web pages and create even more advanced pages using the new scripting language, JavaScript.
Once you have finished creating your Web page, or perhaps an entire Web presentation and tested it on your own system, you can publish it to a server. Right now your page exists on your local disk; you can browse your Web page, but no one else can. When you publish to a server, you're copying your Web pages (HTML files) to a Web server so that others can see what you've done.
A Web server is a program that runs all the time and waits for Web clients (such as Navigator) to connect to it and request data, usually a file. Servers and browsers communicate using the HyperText Transfer Protocol (HTTP), a language created for transferring hypertext documents over the Web. Web servers are often called HTTPD servers.
Note: The "D" in HTTPD stands for daemon. A daemon is a UNIX term for a program that sits in the background and waits for requests. You don't have to be on UNIX for a program to behave like a daemon, so Web servers on any platform are still called HTTPD servers, or simply HTTP servers.
Ideally, you'll be able to publish your Web pages using the same organization that gives you access to the Internet. If you get access to the Internet through a commercial provider, that organization might offer Web space that you can use as well. Ask your system administrator if they offer Web server access.
Filenames have different conventions and restrictions depending on the platform. It's important to understand these distinctions before publishing your Web information, because you want your documents to be as portable between platforms as possible. If you are working with more than one platform, naming your files is very important.
For example, if you're moving your files to or from DOS-based systems, you'll need to follow the 8.3 rule--file names must be only 8 characters long with 3-character extensions. Also, if you're moving files from a Macintosh to other systems, don't use spaces or other funny characters, use only letters and numbers and keep your file names under 8 characters.
The one-button publishing feature in Navigator Gold makes publishing your Web pages quick and easy. You can select which files or directories you want to upload (publish) to a remote server. You can also specify the remote server site.
If you have specified default publishing preferences in the Composer Preferences dialog, those settings appear in the Publish dialog.
Note: If a file on the remote server where you're publishing has the same file name as the one you're uploading, it will be replaced with the new one without asking you to confirm the action.
http://commercialweb.com/ docs/yourname/index.html
Once you've typed some locations here, in the future you can select from the list of remote locations you've established. Click Use Default Location to have the editor automatically enter the location you've specified in your Editor preferences.
Click OK. Once the files have been uploaded successfully to the specified server, you can choose Go|Default Publish Location in the browse window to view the page(s) you have just published.
Learn about each item on the Publish Files dialog box.
About the Publish Files dialog
Lets you select which files or directories you want to upload (publish) to a remote server. You can also specify the remote server site.
Publish
The file name of the current document you want to upload to a remote server.
Include files
Select Images in the document to display all of the image files in the current document (default). Then select any image files you want to publish along with the document. Select All files in documents folder to display all of the files (.HTML, .GIF, and .JPG) in the current document's directory. Then select the files you want to publish along with the document. This is a quick way to publish an entire Web presentation that is made up of several .HTML files. Clicking the Select None or All buttons lets you quickly select and deselect files in the list. Note: If a file on the remote server where you're publishing has the same file name as the one you're uploading, it will be replaced with the new one without asking you to confirm the action.
Location
The location of the remote site you want to publish your Web pages to. You may need to contact your internet service provider to find out what to type here. For example, if your service provider is America Online, the URL in this box might look something like: ftp://ftp.aol.com/docs/yourname/index.html. Or, if a Web server protocol is used, http://commercialweb.com/docs/yourname/index.html. Once you've typed some locations here, in future you can simply select from the list of remote locations you've established. Click the Use Default Location button to use the location youve specified in the Composer Preferences|Publish dialog.
User
The name you type when accessing the network your Web pages will be located on.
Password
The password for your user name.
Save Password
Saves your password information so that you only need to type it in the box once instead of each time you publish your Web pages.
You can also use FTP to transfer (or upload) your files to a Web server. Composer lets you access FTP servers in the same way you access Web (HTTP) servers.
Note: Most FTP client software lets you choose either ASCII text or binary transfer mode. Although HTML files themselves can be transferred as text files, other files, such as JPEG and GIF files, cannot be correctly transferred that way. In the Composer, files are uploaded to FTP sites in binary mode by default. To point Composer to an FTP site, use the following syntax in the location field:
ftp://username@ftp.foo.com/directory1
You might find the FTP directory and content pages have minimal formatting. When possible, the browse window shows the type, size, date, and a short description of each file in a directory. A directory is presented as a list of links; each link is often preceded by a small icon indicating another directory or a file. Clicking on a directory link displays a subdirectory. Typically, at the top of a subdirectory is a link that displays the parent directory.
After you have accessed an FTP server, you can upload files to the site by dragging and dropping them from the Windows File Manager or Explorer to the browse window. This process is easier if all your Web page files are located in one directory on your local disk.
JavaScript, a Netscape-developed scripting language derived from Java, provides developers with a simplified language to create scripts and small programs. With Composer, you too can take advantage of the power of this scripting language in your Web pages.
JavaScript is a small, property-based scripting language. Scripts written in JavaScript can enhance the features of Web pages, as well as client and server applications. For example, a JavaScript script embedded in HTML can recognize and respond to user-initiated events such as form input and page navigation.
You can insert JavaScript in the pages you edit with Composer by applying a special character style to the JavaScript you've typed in your document. For example:
Select the text you've just typed and choose Format|Character|JavaScript (Client). The text color changes to red and displays in a fixed width font.
Today is: Fri Mar 12 13:05:32 1996
When you view the HTML source, you'll see <SCRIPT> and </SCRIPT> HTML tags around your JavaScript statements.
Even though the Web is relatively young, there are already some definite do's and don'ts regarding content creation. If you heed some of the following credos regarding text, page length, graphics, and color, you'll be on your way to presenting an attractive and well-turned Web page, one with content that readers will enjoyably sink their teeth into.
Time spent planning before you start "cooking" up your creation is time well spent. Consider these issues:
As the Web grows in popularity, more browsers are becoming available. This means you can't assume that folks reading your pages are using the same browser you are. Even those who do use the Navigator might not use it all the time (they might use a different browser at home or at work).
Don't make your document overly dependent on HTML features that can't be seen by all browsers. If you decide to use Netscape-only HTML tags, consider how your page might look to someone whose browser doesn't support those tags. Some browsers might not accept your graphics, so provide alternative text. Also, Navigator (and many other browsers) lets users choose how they want the pages they view to look. Users can choose fonts and font sizes, override a page's colors and backgrounds, and generally ignore a lot of the formatting options a Web author has specified.
Do assume that a user's screen size, number of available colors, and screen resolution will be different from yours, even those readers using the same browser. This means that a page that looks great on your screen might look completely different on someone else's. This is another strong reason to concentrate on content first, and use design options as enhancements only.
Most current personal computer monitors display 640 x 480 pixels on 13- to 15-inch screens. Designing your pages so that the information is presented in short, clearly segmented chunks will make it easier to keep pages concise.
A good rule of thumb for writing a page meant to be read onscreen is to make it no longer than two to three 640 x 480 screens' worth of information, including local navigational links at either the beginning or the end of the page layout. If you make the page longer than the window, your reader has to remember too much information that's already scrolled off the screen.
A disadvantage of a very long Web page is that the reader must depend on the vertical scroll bar slider to navigate. Small scrolling movements can completely change the screen contents, leaving the reader no familiar landmarks.
Keep closely related information within the confines of a single Web page, particularly when you expect the user to print or save the text. If you want to provide a good online interface for pages and easy printing or saving of the content, divide the page into chunks of two to three printed pages of worth information, including inline graphics or figures. Or provide a link to a separate file that contains the full-length text combined into one page.
While the graphic design of your pages should be pleasing, it is ultimately the content that determines a page's value to others. Follow these simple guidelines to giving good content:
Graphics add a lot to the visual appeal and information content of a page. But poor use of graphics can frustrate your readers or keep them from understanding the message you're trying to send.
Practically every published Web author will agree--keep images small! You should aim to keep the total file size of images used on a page to less than 30K. Remember that not everyone seeing your page has a 28.8 modem. If you need to use a large image, you might want to consider using a thumbnail of the image and then linking it to the full-size copy. You can reduce file size by using design programs to eliminate unnecessary colors.
Use backgrounds intelligently. Backgrounds that are "loud" make it extremely hard to read the text that's on top of them. Don't let your backgrounds interfere with the message you're sending the reader. For a background to work well, color contrast is not enough. The background either needs to be very light (for dark text) or very dark (for light text). A background that contains an image should have low contrast, so it's not too distracting.
The two types of image formats used by most Web browsers are GIF (CompuServe Graphics Interchange Format, .GIF extension) and JPEG (Joint Photographic Experts Group, .JPG extension). The JPEG format works best for photos and continuous tone images. The GIF format works best for inline images, line art drawings, most logos, and screen dumps. Both formats should use a resolution of 72 dpi (dots per inch) and use RGB (red-green-blue) color mapping.
Since you can't assume your readers are using a graphical browser to view your pages, be sure to enter an alternative description in the Text field of the Image Properties dialog box (choose Insert|Image). This way, readers using text-based browsers will see the alternate text description, and those using graphical browsers will also see something if the image fails to load.
Here are some other techniques that can help minimize download times for images:
It's tempting to add lots of colors and font styles to a page just because you can. But the result is more likely to frustrate a reader and detract from the message you're trying to get across. After all, it's the content you want your audience to focus on, and that means presenting a page that's easy to read. Even though most graphical browsers (including Navigator) use a proportionally spaced font such as Times Roman as the default for text, many browsers are user-configurable, meaning the user can choose any font for viewing your page.
Consider typography as the tool you use to paint patterns on the page. The first thing your reader sees is not the title or other details of the page, but the overall pattern and contrast of the page. The reader's eye scans the page first as a purely graphic pattern, then begins to track and decode type and page elements.
Good typography depends on the visual contrast between one font and another and the contrast between text blocks and the surrounding empty space. There are a few basic typographic principals that can help make your pages easier on the eye:
Thoughtful and consistent use of color in backgrounds can really help pull your pages together into a cohesive presentation. In general, light pastel backgrounds are best for reading substantial amounts of text. If you are showing a lot of pictures, a black background can make your photos look good and give your pages a gallery-like effect. Using tiled backgrounds makes everything above them "float," causing your readers to work much harder to read your text. Using a white background can make text look good and your document look clean, but if you have a lot of pages, it can be extremely wearing on the eyes.
And last, but not least---the proverbial icing on the cake. These elements are considered the hallmarks of the work of a professional Web author:
Headers: A consistent titling design at the top of your Web page allows your readers to immediately know what the main point of the document is, and what (if any) relationship the page might have to other pages in a related group. Unlike a browsing a book, which is linear in design, a Web author can never be sure what other pages the reader has seen before linking to the current page. Graphics placed above the main heading should not be so large that they force the title of the page on a standard office-size monitor (640 x 480 pixels) to go off the screen.
Footers: Ideally, each page should have a footer that contains your name, organization, navigational elements (links or icons), copyright information, and revision/change dates.
Email Address: Like any fine work of art, a good Web page should have a signature or some other form of contact information. You can provide a link to an email form your readers can use to send comments and feedback to you. Select the Link tab in the Properties dialog box. In the Link to field, type the HTML tag mailto: followed by your email address.
At the very least, provide your name, organization, and street address, in case your page is viewed on a browser that doesn't support email forms.
Navigation: Include a target (a return link) to your top level on each page so readers have a quick way of returning to the beginning. It also helps to include links to an index or table of contents, other sections, and previous and next pages. You might want to add these targets to the bottom of the page, so the reader always knows where to find them. If your links only flow downward from the home page, the pages in your document will become dead ends.
Links: Avoid the "click here" syndrome when defining a link; for example, "Get information about whatever is available by clicking here." Readers then have to remember where they're going to once they jump to another page. It's better to link to words or phrases that are a meaningful part of a sentence; for example, "Information about whatever is now available."
If you use links to items on the same page, remember to use relative links, as absolute links (full URLs) can cause a browser to reload the page each time a link is selected.
Time Stamps: Date your revisions and indicate those pages that have been changed or are new additions.
You can add new functionality to Composer by taking advantage of the plug-in tools available from Netscape. To download the sample plug-ins:
On Macintosh, this is the folder "Plug-ins" that's in the same folder as the Navigator application.
On Unix, this is /usr/local/netscape/plugins, or whatever the environment variable NPX_PLUGIN_PATH specifies.
On Windows, this is the directory "Plugins" that's in the same directory as the Navigator.exe file.
Your new plug-in will appear in the Tools menu of the Composer window.
