If your main HTML editor is Microsoft Word, or you have a copy of Microsoft Word and you've been using something else, you may really like Internet Assistant. Although Internet Assistant (IA) only offers basic support for HTML tags in your documents, that might not be so bad. Especially since there's nothing wrong with editing the rest of the document by hand.
Internet Assistant is a free add-on for Microsoft Word version 6.0 and above. A separate version is available for either Windows 3.1 or Windows 95. (A Mac version should also be available by the time you read this.) You can download them from Microsoft's Web site at http://www.microsoft.com/.
Internet Assistant actually adds two different elements to Microsoft
Word. After installation, a few new menu items exist for your use, including
Insert, Hyperlink. But Internet Assistant also adds the ability
to view basic HTML documents from within Microsoft Word with the command
File, Browse Web (see fig. 28.1).
Fig. 28.1
The MS Word/Internet Assistant browser.
Creating HTML documents in Internet Assistant isn't really much different
from creating a typical Word document. The key is to use the HTML template.
In Word, choose File, New. In the new document, select the
HTML template for use with your new document. Then place your cursor and
begin typing. You can use bold, italics, or underlining as you type.
You can also use the HTML style sheet definitions to help you change basic text to HTML markup. Consider the example, just typed directly into a new HTML-template Word document, like the following:
BigCorp's Customer Service Pages
To change this text from normal text to a Heading 2 (<H2>), select the text with the mouse in Word, and then pull down the style menu and select Heading 2. Word automatically formats the selected text to conform to the HTML standard for Heading 2. As an added bonus, you can see how it might look in a browser window (see fig. 28.2).
As with Word templates in general, you can always select the style first, then type your text.
Fig. 28.2
Changing text to an HTML header.
Creating a list in Internet Assistant is pretty easy, too. For an ordered or unordered list, all you need to do is enter the text for your list, hitting return after each. An example might be:
Downloadable Support Files
Frequently Asked Questions
Send Us a Note
Toll-Free Numbers
The next step is to select the entire list with the mouse. With all of the above highlighted, you can either select the appropriate list button in the buttonbar or select the list type in the pull-down style menu. For instance, if you click the Bullet List (UL) button in the button bar, you'll get something like what's shown in figure 28.3.
Fig. 28.3
Changing regular text to a bulleted list.
If you're interesting in indenting list items, like when creating an outline, the Internet Assistant will let you do that, too. Use an unordered list like the following:
Section 1
Chapter 1
Part 1
Part 2
Chapter 2
You can use the Internet Assistant button bar to move some of these
over. First, you can select all of the text under Section 1 and click once
on the Increase Indent button to move everything over once. You can also
choose Format, Increase Indent. Select Part 1 and Part 2,
or Chapter 1, and you can click the button once more to indent those, too
(see fig. 28.4).
Fig. 28.4
Indenting (nesting) your lists.
Some HTML mark-up in Internet Assistant requires that you follow special instructions, depending on the Windows version you're using. Internet Assistant 1.0 for Windows 3.1 handles definition lists differently from IA 2.0 for Windows 95. Start by typing the first word from your list, then hit Tab and type the definition. You do this for your entire list, as in the following example:
Mr. Ted Smith President, CEO. Ted's a huge Cubs fan, an avid golfer,
father of three daughters and Carol's husband. He also works here.
Ms. Gina Miles CFO. Gina enjoys hiking, mountain biking and weekend
lecturing. Also a Cubs fan, Gina enjoys attending the games with her husband
Mike.
Mr. Rick Felps EVP, Marketing. Rick's passion is his '67 Mustang
Convertible, which he often drives to the lake on weekends for fishing outings.
Rich hates the Cubs, preferring the Phillies.
Now, by selecting the text and choosing the definition list (DL) option from the pull-down menu, the names will become definition terms (DT) and the descriptions become definitions (DD).
In Windows 95, things are a little more involved. Using the sample text, choose all of the text and make it a definition list using the pull-down menu. Then, select each element separately and make it either a definition item or definition, as appropriate. That will cause the definitions to standout from the definition terms (see fig. 28.5). You can also hit Return after each DT to place the definitions below their respective terms.
You can also assign shortcuts to common HTML styles. Choose Format,
Style to open the Style dialog box. Pick the correct style, choose
Modify, and then select the Shortcut key. Then you just enter a keyboard
combination for that style.
Fig. 28.5
Changing regular text to DL terms and definitions.
Notice that Internet Explorer's pull-down style menu will also let you create a <DL COMPACT> list. To do this, follow the appropriate procedure above but choose definition compact instead of definition list.
Microsoft Word defaults to the HTML file format when you use the HTML template (in Internet Assistant) to create your document, so you can basically save your Web page in the same way that you might save a regular MS Word document.
With an HTML document active, choose File, Save. The Save
As dialog box appears (see fig. 28.6). Give your file a name in the File
name box. Make sure HTML Document is selected in the Save as type
menu at the bottom of the dialog box. When you're finished, choose Save.
Now you've got an HTML document for your Web site.
Fig. 28.6
Saving your HTML documents.
Let's create a simple page in Internet Explorer and use what you've learned so far to create a new HTML document. To begin, create a new Word file based on the HTML template. You may also want to save this file to give it a name. Then, just type Listing 28.1 (or something similar).
Listing 28.1 iatest.htm A Sample Page for Internet Assistant
BigCorp's Customer Service Pages
To help you get the most out of our products, or just help if you're having
a problem, we've create the following Web pages with downloading files, tips,
tricks, fixes and answers to your questions. Just click any link to get to
that page.
Downloadable Support Files Fixes, drivers, free stuff, utility programs,
documents and even a game or two written by our engineering and tech support
staffs. If you can't find it here, BigCorp hasn't written it. (Or you'll have
to buy it from us!)
Frequently Asked Questions Listing of questions that our tech support reps
hear all the time. They're willing to answer them again, but that just means
they get frustrated and take more breaks.
Send Us a Note Send email directly to the most prolific answer guy on
our support staff.
Toll-Free Numbers Phone numbers for tech support, customer service, and, for
good measure, we've even thrown in our toll-free, 24 hour sales numbers. Good
of us, eh?
Now the trick is to turn this into a more interesting page. You can start with the heading by selecting the entire heading and changing it to a Heading 2 using the pull-down style menu.
In the descriptive text (1st paragraph), there's nothing particularly special you need to do. You can always add bold and italic text where it seems appropriate by highlighting the text and clicking the buttons in the Word/Internet Assistant button bar. You could also experiment by turning the entire paragraph into Blockquote text or other HTML mark-up.
The Horizontal Rule button—or the Insert, Horizontal Rule
menu command—can be used to insert an <HR> line in your document.
In the next section, notice that I've used <TAB> to prepare it to be a definition list. Select the entire section of text and change it to a definition list, DL in the pull-down style menu. (In IA 2.0, you also need to select each element separately to assign it as a DT or DD.)
Now, save the file as an HTML document, along with the appropriate file extension. You're set. To view the document in Word's built-in browser, click the Switch to Browser button (far left on the second row of the button bar), or select View, Web Browse. It should look something like what's shown in figure 28.7.
You can also use the Preview in Browser button (the rightmost button
on the first row of the button bar) to load the document directly into
the default Windows 95 browser. Or, choose File, Preview in Browser.
To work with your document as a plain text file, choose the View,
HTML Source command. Word will close the HTML document (and HTML
template) and re-open the file as a text file, complete with the tags and
other markup.
Fig. 28.7
Your example in Word's new built-in browser.
After you've viewed the document, you can switch back to edit mode by clicking the Switch to Browser button again, which has now changed to a pencil icon.
Internet Assistant also gives you the ability to add the trappings of good Web pages, including hypertext links, images, and <HEAD> information. For the most part, you can do just about anything possible in HTML 2.0, and it's all fairly straightforward.
To insert a hypertext link, highlight that text and click the Hyperlink
button, or choose Insert, Hyperlink. The Hyperlink dialog
box opens allowing you to enter or edit text for the link and choose a
local file or URL as the document (or multimedia file) this link references
(see fig. 28.8). Enter or edit the text and choose a file. Click OK when
finished and your hypertext link will appear in the document.
Fig. 28.8
Creating hypertext links.
Word calls local HTML NAME anchors "bookmark" links, and allows you to create them with the help of Internet Assistant. Remember that NAME links have two different components: a calling link and a NAME anchor to which the link points.
You need to start by creating the bookmark link (NAME anchor). To do
this, place the cursor where you want the bookmark anchor to be in the
document. Then, you can click the Bookmark button on the button bar or
choose Edit, Bookmark from the menu. In the Bookmark dialog
box that appears, enter a name for this bookmark.
To create the calling link, use the same Hyperlink button or choose
Insert, Hyperlink. After entering text for the link, choose
the bookmark name from the pull-down menu at the bottom of the dialog box.
Make sure it's selected, and then click OK.
Inserting an image in an Internet Assistant HTML document is similiar
to inserting a hypertext link. Start by placing your cursor in the document
where you'd like the image to appear. Next, click the Picture button or
choose Insert, Picture. In the resulting dialog box, choose
the name of an image. You can also enter ALT text for displaying instead
of the graphic in text-based browsers.
To determine whether or not this image will be a server-side image map
and how text will align to it, click the Options tab in the Picture dialog
box (see fig. 28.9). Now you can choose the Image is a sensitive
map option to add the ISMAP attribute and how you want the image aligned.
(Remember that LEFT and RIGHT are not HTML 2.0 values.) Click OK in both
dialog boxes and you've inserted your image.
Fig. 28.9
Adding a picture with advanced settings.
Notice that you can also enter video clips with the Picture dialog box (click the Video tab). This uses Microsoft Explorer's proprietary tags for adding and playing AVI files.
Since Internet Assistant doesn't give you direct access to the HTML
tags in your document, you'll need to use a special command for <HEAD>
elements. On the button bar, click the Title button, or choose File,
HTML Document Info. The HTML Document Head Information dialog box
appears.
In this dialog box, enter the Title for your Web document. Click OK if that's all you need to add. If you need to add a Base address, click the Advanced button in this dialog box. Enter the URL in the HTML Document Head Info—Advanced field. You can also click the Is Index checkbox if you'd like this page to be an index.
To enter custom HTML text in the head of your document, click the Meta button (this isn't just for the <META> tag, as used for client-pull, but any <HEAD> tags). In the Insert HTML Markup textbox, you can enter any HTML code you'd like to have appear in the head of your document. When you're finished, click OK.
You can use a similar command to add your own tags within the body of
your document. With the cursor placed at the point in your document where
you want to enter the special tag, choose Insert, HTML Markup.
In the Insert HTML Markup dialog box that appears, enter the special HTML
markup and click OK.
Now, let's take the page you created in the first example and add links, images, and a title. If you use the same document (complete with markup) that you used in the original example, that's great. If not, re-enter the text from Listing 28.1 and save it as iatest2.htm.
Let's start by adding an image to this page just before the heading.
Place the cursor, and select the Picture button or choose Insert,
Picture. The Picture dialog box should appear with the Picture
tab open. In this dialog box, choose a graphic file. When you click OK,
the picture will appear in your document. (You may want to press Return
after the graphic to place the heading text on the next line.)
Now let's create the hypertext links for the definition terms. Highlight
each term with the mouse (e.g., Downloadable Support Files) and click the
Hyperlink button, or choose Insert, Hyperlink. Your text
will appear in the Text to Display textbox. Now you can enter the file,
URL, or bookmark to which this link should point.
Finally, let's give your document a title. Click the Title button or
select File, HTML Document Info. In the dialog box, enter
a title for this page and click OK. You're done. It should look something
like figure 28.10 in Word's built-in browser.
Fig. 28.10
Your example page.
To create a form and add your first form field, choose Insert,
Form Field command. In the New Form dialog box that appears, you'll
get a little bit of instruction for entering form elements. If you don't
want to see this dialog every time you add forms to a new document, click
the Don't Display This Message Again checkbox. Then click OK.
In the list of radio buttons that appears, choose a field type to add. (I'm starting with a text field.) Next stop is the Text Form Field dialog box, which allows you to name the element and set some basic characteristics (see fig. 28.11).
Fig. 28.11
Adding a form field.
To add more fields, you can go straight to the Forms controls and click the type of field you want to add. Make sure you give each a unique name, just as if you were hand-editing the form.
In order to get the form data to your form script, you need to set up the Submit button. When you've finished adding other script elements, click Submit in the Forms control window. In the Submit Button Form Field dialog box that appears, you can name the button, change the button's label (value), and enter an URL for the ACTION attribute (see fig. 28.12). You can also use the pop-up menu to choose the METHOD for sending form data.
Fig. 28.12
Creating the Submit button.
You can't do much of a listing here, since you're not dealing in much raw HMTL or text. Let's create a new document that includes just two form fields and a Submit button.
If you want to, you can start by jazzing the form up with a logo graphic. Then, underneath it, type something like the following:
Customer Service Form
Your name:
Your email:
Change the first line to a Heading 2 using the pull-down menu, but leave
other text as is. Place the cursor to the right of the second line and
choose Insert, Form Field to create a form. Select Text from
the Form Field menu and enter a name for this field in the Text Form Field
dialog box.
Go through the same thing just to the right of the third line, except this time you can use the Forms controls to create the text field (use the top left button). Remember to name it something different, like "e-mail."
Back in the document, press Return after the second text field and click the Submit button in the Forms controls. In the Submit Button Form Field dialog box, name the button, give it a label, enter an URL for your ACTION, and choose a METHOD. Click OK and you're done. Figure 28.13 shows this form in Word's Web browsing mode.
Fig. 28.13
Your form through the MS Word browser mode.
Internet Assistant is designed to add Web browsing and editing functionality to the Microsoft Word word processor. Downloading this free add-in adds two different components. One allows you to view HTML documents from within Word. The other adds an HTML template and special menu/button bar commands for creating and editing Web pages.
Basic HTML is about as simple as creating a regular Word document—just type text and apply styles. Generally speaking, everything can be done a couple of different ways. You can choose to click the Bold button, for example, or you can choose Style, Bold.
Creating lists is also fairly simple in Internet Assistant, although creating definition lists can be a little tricky. Hypertext links, images, and head elements are all added via menu items and dialog boxes. For NAME hypertext links, IA uses Word's bookmark system.
The key to IA is its ability to save files in HTML format. It's this "translator" that does the real work once you've created your page. By saving your document as an HTML file (the default when you use the HTML template), you're able to edit it in a text editor and display it on the Web.
1. Is Internet Assistant an application program? Where do you get it?
2. Is it possible to select an HTML style first, then type your text?
3. In what type of file does IA save your HTML? Can you edit this with other programs?
4. True or false. Indenting list items actually creates a "nested" list.
5. What menu command allows you to change from an unordered to an ordered list type?
6. What is the major difference between definition lists is IA 1.0 vs. IA 2.0?
7. True or false. Since HTML documents are just ASCII text, it's acceptable to save your IA HTML document as "text only."
8. What is the HTML equivalent of Internet Assistant's bookmark link?
9. Which do you create first: the bookmark or the bookmark link?
10. What element controls the SUBMIT and METHOD information for your form?
11. Use Internet Assistant's definition lists and hyperlinks to create a page of book reviews. Clicking the book's name shows the user a graphic of the book. For instance, an entry might be:
HTML By Example The best book ever written for learning HTML the right way.
12. Based on this example, add another definition (DD) line that includes a link to order the book, the author's name, copyright info, and price. For instance:
HTML By Example The best book ever written for learning HTML the right way.
Todd Stauffer, Copyright 1996, $34.99. Order this book.
13. Create a text-based menu-bar using IA. For instance:
Index | Product Pages | Customer Service | Feedback | About Us
14. Add client-pull abilities to your Web page using Internet Assistant.
| Previous Chapter | Next Chapter |
| Search | Table of Contents | Book Home Page | Buy This Book |
| Que Home Page | Digital Bookshelf | Disclaimer |
For comments or technical support for our books and software, select Talk to Us.
© 1996, QUE Corporation, an imprint of Macmillan Publishing USA, a Simon and Schuster Company.