by Eric Ladd
Coding HTML can get very tedious at times, especially if you're doing it all by hand. Typing out every character was the only option available to the first Web page authors because only simple text editors like Notepad or vi were available to them. Eventually, people developed macro libraries for word processors like Microsoft Word or WordPerfect. These libraries extended the abilities of the word processors to include special menu options and toolbar buttons that supported common HTML authoring tasks. This was followed by the development of dedicated HTML authoring software like WebEdit, HTMLEd, and HotDog. These programs provided special editing environments with all sorts of menus, toolbars, and shortcuts to assist authors with their work.
The new sensation in the world of HTML editing programs is the
WYSIWYG (what-you-see-is-what-you-get) editor, which allows you
to set up a document as you want it to look on a Web page-and
the program writes the HTML code for you. While this is convenient
in that all you have to do is place your page elements where you
want them on the screen, it also makes experienced HTML authors
wary. The cause for the concern is that such programs enable anyone,
regardless of their knowledge of HTML, to author a Web page. Veteran
HTML authors aren't worried about losing some sacred status in
the Internet community. Rather, they're worried that increased
access to Web publishing will increase the glut of dreadful content
currently existing on the Web that has little redeeming value.
| NOTE |
Another annoying thing about many of the newer HTML editing programs is that they insert comments or <META> tags into your HTML that advertises the fact that you used the program to create your pages. Experienced HTML authors will find this "feature" to be a nuisance |
In spite of these concerns, software companies are busy writing
and releasing WYSIWYG HTML authoring programs. Netscape was among
the first to release such an editor. Packaged with the popular
Netscape Navigator browser, the editor is called Netscape Navigator
Gold. This chapter introduces you to the editing capabilities
of Navigator Gold and how you can use it to assist with your HTML
authoring tasks.
| NOTE |
Just as it does with Navigator, Netscape seems to be releasing new versions of Navigator Gold all the time. For the most up-to-date information on Navigator Gold, visit http://home.netscape.com/comprod/products/navigator/gold/index.html. |
Like most Netscape software, you can download Navigator Gold from Netscape by directing your browser to
http://home.netscape.com/comprod/mirror/client_download.html
The file you download is a self-extracting executable that you should store in its own directory.
To install Navigator Gold, follow these steps:
If you downloaded an evaluation copy, you have 30 days to complete your evaluation. If you decide to keep Navigator Gold, you must pay $79.00 to license your copy. Students, faculty, and staff at educational institutions and personnel at charitable non-profit organizations may use Navigator Gold free of charge but should still register their copy of the software with Netscape.
If you bought your copy of Navigator Gold outright or if it came bundled with your Netscape Enterprise Server, then you can just install and enjoy it.
When you first start Navigator Gold, you see the Netscape Navigator browser window shown in Figure 18.1. To use the editing features of Navigator Gold, switch to the Navigator editor window. There are two ways to do this: You can either load an existing page into the editor, or you can start an entirely new page.
If you have a document loaded in the browser (refer to Figure 18.1) and you want to edit it, select File, Edit Document or click the Edit toolbar button. If the document you want to edit is on a remote machine, Navigator Gold will prompt you to save a copy of it locally with the dialog box you see in Figure 18.2. Note that the dialog box lets you change links and save images as part of creating a local copy of the page. Clicking Save opens the Netscape Navigator Gold editor window with the document loaded into it. Figure 18.3 shows the browser document from Figure 18.1 in the editor window.
Figure 18.2 : Before editing a file on a remote machine, you have to create a local copy of it.
You can load a page that's already on your hard drive by choosing File, Open File in Editor. This opens a dialog box that lets you browse for the file to open.
Your other option for getting started with Navigator Gold is to start a new Web page. When you select the File menu and place your mouse pointer over the New Document option, you get the following choices:
Choosing Blank opens the editor window with nothing in it. This
gives you the freedom to create a document entirely from scratch.
The From Template and From Wizard options are explained in the
next two sections.
| NOTE |
To make use of the From Template or From Wizard options, you need to be connected to the Internet since both options involve pages on Netscape's Web site. |
Templates The From Template option loads a page from Netscape that provides links to templates for several types of documents commonly found on the Web (see Figures 18.4 and 18.5). By adding your own content to one of these templates, you can create your own pages in no time.
Figure 18.4 : Netscape has several templates ready to go on its own site.
Once you've selected a template, you can use it by doing the following:
| CAUTION |
Only registered users of Netscape Navigator Gold should download and modify the templates on the Netscape site. |
| TIP |
You can also create your own templates and store them on your hard drive. When you need one of your own templates, you'll need to open it by choosing File, Open File in Editor. |
Wizards If you choose to start a new document using a wizard, you'll jump to a different page on the Netscape site. The page is framed (see Figure 18.6) with regions where you can
Once you're done adding content to your page, follow these instructions to load the page into the Navigator Gold editor:
Navigator Gold supports you in many ways as you create and make changes to your documents. Helpful features discussed in the next several sections include
Before you get too far into the editing process, you should configure the editing environment to make your job as simple as possible. You do this by choosing Options, Editor Preferences from the Navigator Gold menu. Doing this reveals the dialog box displayed in Figure 18.7.
Figure 18.7 : The Editor Preferences dialog box gives you three tabs worth of options to set.
The General tab lets you set global editing preferences such as the author's name, external programs for editing HTML source code and image files, where to find templates when starting a new document with a template, and whether Navigator Gold should automatically save your document (and how often). Being able to reset the location of templates is useful if you plan to store a lot of your own templates on your hard drive. By making the editor look in your templates directory, you can save yourself from having to browse for that directory each time.
The Appearance tab of the Editor Preferences dialog box (shown in Figure 18.8) gives you control over the background and colors used in the document. You can just use the browser's default color scheme or you can define your own. In creating a custom color scheme, you can choose colors for the background, body text, unvisited links, visited links, and active links. If you want to tile an image for your document background, you can provide the URL or path to the image near the bottom of the dialog box.
Figure 18.9 shows the Publish tab of the Editor Preferences dialog box. Here you can set up options for how your document should ultimately be saved-especially if you're saving to a remote server. The Maintain Links option changes the HTML code so that hyperlinks will work from the location where the document is stored. This involves changing the URL in your HREF attributes to point to files on the remote machine. The Keep Images with Document option makes a copy of all of the images on a page in the same directory the HTML code for the page is stored.
Figure 18.9 : You can configure Navigator Gold for saving to a remote server from the Publish tab.
| TIP |
If you store your images in a separate images directory, be sure to uncheck the Keep Images with Document checkbox. |
The lower half of the dialog box is dedicated to setting up the location of the FTP or Web server where your documents will ultimately reside. Additionally, you can specify your ID and password so that the logon process can occur without you having to type them in each time.
The Navigator Gold editor provides three toolbars with buttons that perform common tasks. Referring to Figure 18.10, the toolbars are (from top to bottom) the Character Formatting toolbar, the File/Edit toolbar, and the Paragraph Formatting toolbar.
The Character Formatting toolbar provides several buttons that let you adjust font properties. Once you have some text highlighted, you can decrease or increase its size, make it bold, italicized or fixed width, set its color, designate it as hypertext, or clear any styles previously applied to it. The last five buttons on the toolbar have less to do with font properties and more to do with placement of objects on your page. These buttons allow you to place a named anchor, an image, a horizontal line, or a table. The Object Properties button, at the end of the toolbar, calls up a dialog box showing the properties of a selected item and lets you make changes to the properties as needed.
Buttons on the File/Edit toolbar give you quick access to common file (new document, open, save, and print) and edit (cut, copy, paste, and find) operations. The View in Browser button switches back to the Netscape Navigator browser and lets you see how your work in progress will look to an end user. The Publish button at the far end of the toolbar saves your document on its destination server.
The Paragraph Formatting toolbar gives you buttons that enable you to format blocks of text into bulleted or numbered lists; increase or decrease indenting; and set left, right, or center alignments.
There are two drop-down lists embedded in the formatting toolbars as well. The Paragraph Style drop-down list in the Paragraph Formatting toolbar contains a listing of styles frequently applied to text (see Figure 18.11). To apply one of these styles, just highlight the text and select the appropriate style from the list. The Font Size drop-down list is found on the Character Formatting toolbar (see Figure 18.12). You can use this list to set the size of highlighted text. Positive values make the text larger while negative values make it smaller.
Figure 18.11 : You can apply a style to highlighted text from the Paragraph Style drop-down list.
Figure 18.13 shows the Insert menu, which is available only in the editor. This important menu enables you to place Links, Images, a Horizontal Line, and line breaks (including single-line breaks, breaks to the first clear margin space, and nonbreaking space) into your document.
Each menu selection opens a dialog box in which you can provide the specifics of what you're inserting. The options in the dialog boxes directly correspond to attributes of the HTML tag used to place the type of object you're inserting. For example, note that the Properties dialog box that appears when placing an image (see Figure 18.14) contains options for specifying alternative representations, alignment, size, and spacing.
Figure 18.14 : Dialog boxes enable you to specify the attributes of the items you insert.
Another important feature found under the Insert menu is the HTML Tag option. Selecting this option opens the HTML Tag dialog box (see Figure 18.15). You can type the tag you want to insert into the dialog box, and Navigator Gold will build that tag into the source code it writes. In this way, you can include tags not supported by Navigator Gold, and you have a means for including future HTML tags as well.
| TIP |
If you want to see the HTML source code for your document, choose View, View Document Source at any time. |
Placing tables is particularly easy with Navigator Gold. By choosing the Insert, Table option (and choosing Table from the pop-up list of options), you get the New Table Properties dialog box shown in Figure 18.16. Here, you can specify all of the attributes you want your table to have, including borders, spacing, alignment, and captions. Figure 18.17 shows how Navigator Gold places a blank table on the page after you click OK in the dialog box. Once the empty table is on the page, you can type text into the individual cells and format it however you choose.
Figure 18.16 : You set up all of a table's properties before it is placed on the page.
Figure 18.17 : You populate the blank table by typing the contents directly into each cell.
The Properties menu is also unique to the Navigator Gold editor.
You can use the Properties menu to open property dialog boxes
for Text, Links, Images, Horizontal Lines, HTML Tags, and the
entire Document. Once in a dialog box, you can modify the attributes
of an item. The Character, Font Size, and Paragraph options open
up drop-down lists that let you change the characteristics of
each of these page elements.
| TIP |
You can also open the property dialog box for an item by right-clicking it and selecting the appropriate properties option from the context-sensitive menu that appears. |
The Document Properties dialog box is very useful as it gives you quick access to much of the information you would store in the document head. The General tab of the Document Properties dialog box is shown in Figure 18.18. Here, you can set the document's title, author, a general description of the content, keywords, and a classification (what kind of Web page the document is).
| NOTE |
Don't forget how important it is to put a descriptive title on your document. It's helpful to both users and Web robots. Some robots also make use of any keywords you specify. |
The Appearance tab is exactly the same as the one in the Editor Preferences dialog box. You can specify color schemes and a background image for the document by filling out the fields on this tab.
The Advanced tab, shown in Figure 18.19, lets you set up <META> tags in the document head using either the HTTP-EQUIV attribute (for Netscape system variables) or the NAME attribute (for other user-specified information).
When Netscape released Navigator Gold, it also debuted the Netscape Gold Rush Tool Chest-a compilation of different Web authoring resources to assist new and experienced authors in their work. The Tool Chest page on Netscape's site is shown in Figure 18.20.
Figure 18.20 : Netscape gave Web authors a big boost with its Gold Rush Tool Chest.
The Tool Chest is full of goodies for HTML authors of all levels of experience. When you open the chest, you'll find
| CAUTION |
Don't take the copyright information lightly. Many sites explicitly forbid you to download images or other page elements for your own use. Navigator Gold users have permission to download Templates and other items in the Tool Chest for personal use, however. |
Probably the greatest advantage of Navigator Gold is that you
don't need to know a bit of HTML to author Web documents. In the
editor window, you enter and format text, paragraphs, and lists
just as you would in your favorite word processor. You can insert
images, links, rule, and line breaks using the Insert menu and
the appropriate dialog boxes. Thus, you can do most of the tasks
that go along with composing a Web document without typing a single
HTML tag!
| NOTE |
While it is true that you don't need to know HTML to author pages with Navigator Gold, having a basic understanding will help you understand the nature of quantities specified in many of the dialog boxes. It also lets you insert non-standard HTML tags that Navigator Gold may not yet support. |
Another advantage of Navigator Gold is its WYSIWYG display. This eliminates the need for a preview option because the document appears in the editor window just as it will appear in the browser window.
Beginners will find Navigator Gold easy to use because of its familiar interface. It combines the formatting options common to most word processors with cut-and-paste and drag-and-drop capabilities. Figure 18.21 shows the drag-and-drop feature being used to copy a link from a bookmark list to the browser window.
Advanced users will enjoy being able to work with more elaborate page items like multimedia files and Java applets-right in the editing window. JavaScript authors can create and execute scripts right in Navigator Gold's interpretive environment.
When you're finished with a document, you need to do two things. First, save it to your hard drive. Second, publish it to the machine that will serve the page to browsers that request it.
Navigator Gold's save option (choose File, Save or File, Save
As) is fairly standard. If you have yet to save the file, use
the Save As option so that you can browse to the directory where
you want to save it. After the document has been saved once, future
saves can be performed with the Save option.
| NOTE |
If you accidentally choose File, Save the first time, you'll still get a File, Save As dialog box. |
With the document saved, you're ready to publish it to a server. Very often, the machine you author the page on and the machine that will serve the page are not the same. This means you have to send a copy of the page (and all supporting elements like images, applets, and so on) to the server so that visitors can see your work.
To help you do this, Navigator Gold provides a Publish option under its File menu. You can also access Gold's publishing features by clicking the Publish button on the File/Edit toolbar; this is why Netscape touts Navigator Gold as having "One Button Publishing." The Publish dialog box is shown in Figure 18.22. The ability to include all or some of the other files in the document's folder is helpful because images and other page elements are likely to be stored in the folder. This way you can transmit these files along with the source code for the page. The Publishing Location part of the box lets you specify the name of the server (Web server or FTP server) that you want to send the document and its related files to, and what your logon ID and password for that machine are. When Navigator Gold publishes a document, it uses the options you specified on the Publish tab of the Editor Preferences dialog box to complete the operation.
| TIP |
If a group of authors is using Navigator Gold to produce pages for an intranet site, you can password protect the documents so that only authorized users have access to them. |
| NOTE |
Navigator Gold transmits files to remote servers |