[Back to Tapestry Overview] [Forward to Developing an Advanced Web Page] [Contents]


2 - Developing a Simple Web Page

This chapter shows you how to develop a simple Web page by using a title, paragraphs, and links to other Web pages:


Introduction

To develop a simple Web page document, you use Tapestry like a text editor. You can add components, such as text, horizontal rules, line breaks, or paragraph breaks. You can delete individual characters by using the delete key or you can select and cut text or paragraphs using the Edit -> Cut command. You can also cut and paste text from other documents to your Tapestry document and add links to other documents on your own hard disk or the World Wide Web.

Adding Components

To develop a simple Web page you can easily add components, such as a:

Title

All Web pages should have a title that accurately describes the contents of the page. An accurate title makes it easy for people to find your page when searching the Web.

To add a title to your Web page:

  1. Place the mouse cursor in the text input box below the Tapestry toolbar.
  2. Type the title of your Web page in the text input box. If necessary, use the delete key to delete characters.

Text

To add text to a Web page:

  1. Place the mouse cursor in the text input area below the Tapestry toolbar.
  2. Type the text that you want to input.

Paragraph

To add a paragraph to a Web page:

  1. Move the mouse cursor to where you want to add a paragraph.
  2. Do one of the following:

A paragraph leaves more space between paragraphs than a line break.

Line Break

To add a line break to a Web page:

  1. Move the mouse cursor to where you want to add a line break.
  2. Do one of the following:

A line break leaves less space between paragraphs than a paragraph.

Horizontal Rule

To add a horizontal rule to a Web page:

  1. Move the mouse cursor to where you want to add a horizontal rule.
  2. Do one of the following:

Heading

Using Tapestry, you do not have to worry about different heading levels because Tapestry is a WYSIWYG (what you see is what you get) application that handles headings as text. To add a heading you simply type the heading text and change the size (for example, 18-point font) of the text and style of the text to bold.

To add a heading:

  1. Move the mouse cursor to where you want to add a heading.
  2. Type the heading text.
  3. Change the the size (for example, 18-point font) and bold the text.

Editing Text

You edit text by:

You can select, copy, cut, and paste text or any object, such as a document icon; however, in these procedures text is used as an example object.

Selecting

To select (highlight) text:

  1. Move the mouse cursor to the start of the text that you want to select.
  2. Click and hold down the mouse button.
  3. Drag the mouse cursor to the end of the text that you want to select.
  4. Release the mouse button. The text is highlighted as shown in Figure 1, "Selecting Text in a Tapestry Document".

Figure 1 shows how to select the "This text to be highlighted" text in the "Tapestry examples" document.

[Selecting text]

Figure 1, Selecting Text in a Tapestry Document

Copying and Pasting

You can copy and paste text and other objects, such as document icons, images or links:

In Tapestry documents, links are indicated by a blue underline. When you are copying a link, make sure that you copy the complete link.

To copy and paste text:

  1. Select the text that you want to copy.
  2. Choose Edit -> Copy. The selected text is copied to the clipboard.
  3. Move the mouse cursor to where you want to paste the text.
  4. Choose Edit -> Paste. The text is pasted.

If some of the text is already highlighted, the copied text replaces the highlighted text.

Dragging and Dropping

For some applications that are well integrated into the Macintosh interface, (for example, the Apple Macintosh SimpleText application) you can drag and drop text from the application to a Tapestry document. This drag and drop utility is the same as cutting from one application and pasting into another application.

To drag and drop text from an application to a Tapestry document:

  1. Select the text in the document (for example, a SimpleText document) or document icon that you want to drop and drag.
  2. Click and hold down the mouse button.
  3. Drag the mouse cursor to where you want to drop the text in your Tapestry document.
  4. Release the mouse button. The text or document icon is copied from the application into your Tapestry document.

Cutting and Pasting

You can cut and paste text and other objects, such as document icons, images or links:

In Tapestry documents, links are indicated by a blue underline. When you are cutting a link, make sure that you cut the complete link.

To cut and paste text (or document icon):

  1. Select the text (or document icon) that you want to cut.
  2. Choose Edit -> Cut. The selected text is deleted and placed in the clipboard.
  3. Move the mouse cursor to where you want to paste the text.
  4. Choose Edit -> Paste. The text is pasted. If some of the destination text is already highlighted, the text you cut replaces the highlighted text.

Deleting

To delete text:

  1. Select the text that you want to delete.
  2. Choose Edit -> Cut. The selected text is deleted and placed in the clipboard.

Aligning

You can left, center, or right-align to the margins of the Tapestry page:

To align text, you can use either the menu commands or the command buttons on the Tapestry toolbar.

If part of a paragraph is selected when you choose an align command, the complete paragraph is aligned. This makes sense because the length of lines changes when you change the size of the document window and therefore you can not align part of a paragraph.

To left-align a paragraph:

  1. Select the paragraph or place the mouse cursor in the paragraph that you want to align.
  2. Do one of the following:
To center-align a paragraph:
  1. Select the paragraph or place the mouse cursor in the paragraph that you want to align.
  2. Do one of the following:
To right-align a paragraph:
  1. Select the paragraph or place the mouse cursor in the paragraph that you want to align.
  2. Do one of the following:

Changing Font Size

Using Tapestry, you can specify a font size from 9 to 36 points.

To change the size of the text font:

  1. Select the text.
  2. From the Size menu, select the font size (9 to 36). The font size of the selected text changes.

Changing Text Styles

Using Tapestry, you can change the style of the text to plain, bold, or italic. You can use either the menu commands or the toolbar command button [abc]. The easiest method is to use the toolbar command button.

To change the style of the text to plain font:

  1. Select the text that you want to change.
  2. Do one of the following:

To change the style of the text to bold font:

  1. Select the text that you want to change.
  2. Do one of the following:

To change the style of the text to italic font:

  1. Select the text that you want to change.
  2. Do one of the following:

Adding Links to a Local (Internal) Document

You can add two types of links to a Tapestry document:

You can use three different methods to add a link to a Tapestry document:

A document is a file that can contain text, graphics, sound, video, or links to other documents. You usually link a local (internal) document to some "anchor" text in your Web page and the text is underlined indicating that it is linked to another document.

When you move the mouse cursor over the link in a Tapestry document, the location (Uniform Resource Locator) of the linked document is displayed in red at the bottom of the Tapestry window.

Using Drag and Drop

To add a link to a Tapestry document from a local (internal) document using Drag and Drop:

  1. Select (highlight) the "anchor" text (for example, "This text to be highlighted" in Figure 2) in the Tapestry document.
  2. Find the local document on your desktop or in a folder that you want to link to.
  3. Drag the local (internal) document to the Tapestry document. As you drag the local document you see the outline of the document moving across the desktop, as shown in Figure 2, Dragging and Dropping a Document.
  4. Drop the local document on the highlighted text in the Tapestry document. A feedback sound indicates that the link from the local document to your Tapestry document has been made. Figure 3 shows the underlined text ("This text to be highlighted") for the link.

[Dragging and Dropping Text]

Figure 2, Dragging and Dropping a Document

[Dragging and Dropping Text]

Figure 3, Link from a Local (Internal) Document to a Tapestry Document


Using the Special -> Link Command

To add a link to a Tapestry document from a local (internal) document using the Special -> Link command:

  1. Select (highlight) the "anchor" text (for example, "This text to be highlighted" in Figure 2) in the Tapestry document.
  2. Find the local document on your desktop or in a folder that you want to link to.
  3. Choose Special -> Link. A dialog box is displayed.
  4. From the dialog box, choose Internal. A document selection dialog box appears.
  5. In the document selection dialog box, select a document to link to.
  6. In the document selection dialog box, choose Link. A feedback sound indicates that the link from the local document to your Tapestry document has been made. Figure 3 shows the underlined text ("This text to be highlighted") for the link.

Using the Toolbar Button

To add a link to a Tapestry document from a local (internal) document using the toolbar button:

  1. Select (highlight) the "anchor" text (for example, "this text to be highlighted" in Figure 2) in the Tapestry document.
  2. Find the local document on your desktop or in a folder that you want to link from.
  3. Choose the Link toolbar icon. A dialog box is displayed.
  4. From the dialog box, choose Internal. A document selection dialog box appears.
  5. In the document selection dialog box, select a document to link to.
  6. In the document selection dialog box, choose Link. A feedback sound indicates that the link from the local document to your Tapestry document has been made. Figure 3 shows the underlined text ("this text to be highlighted") for the link.

Adding Links to an Internet (External) Document

You can add two types of links to a Tapestry document:

You can use three different methods to add a link to a Tapestry document:

A document is a file that can contain text, graphics, sound, video, or links to other documents. You usually link a local (internal) document to some "anchor" text in your Web page and the text is underlined indicating that it is linked to another document.

When you move the mouse cursor over the link in a Tapestry document, the location (Uniform Resource Locator) of the linked document is displayed in red at the bottom of the Tapestry window.

Using Drag and Drop

To add a link to a Tapestry document from an external document on the Internet by dragging and dropping a URL:

  1. Select (highlight) the "anchor" text (for example, "This text to be highlighted" in Figure 2) in the Tapestry document.
  2. Launch Netscape Navigator (if it is not already open).
  3. Find a URL that you want to link to.
  4. Drag the local URL to the Tapestry document. As you drag the URL you see the outline of the document moving across the desktop, as shown in Figure 4, Dragging and Dropping a URL from Netscape.
  5. Drop the URL on the highlighted text in the Tapestry document. When you drag the URL is over the selected text, a highlight rectangle appears. A feedback sound indicates that the link from the local document to your Tapestry document has been made.

[Dragging and Dropping a URL]

Figure 4, Dragging and Dropping a URL from Netscape Navigator


Dragging links from Netscape Navigator to your Web page may take a little practice. If you click on the link but forget to hold the mouse button down you will jump to the Web page at the end of the link. If you click and hold the mouse button down on the link for too long, a pop-up menu is displayed. In this case, simply move the mouse off the link to delete the menu, then release the mouse button and try again. After you learn the timing, this operation is very simple. In summary, click on the link to select it and then move the mouse off the link while holding down the mouse button.

When you drag a link, you see a small outline rectangle following the mouse as it moves away from the link. You continue to see this outline rectangle as you move the link (represented by the outline rectangle) into the Tapestry window. When the outline rectangle is over the highlighted text, a highlighted rectangular box appears around the highlighted text, as shown in Figure 4, Dragging and Dropping a URL from Netscape Navigator.

Using Drag and Drop on a Small Screen

To drag a link (URL) from Netscape Navigator into Tapestry you need to have both the link in Netscape and the highlighted text in Tapestry visible. On a small screen, you may have to move the windows around a bit. With practice, this type of window management becomes easier. If you have a very small screen, or find this kind of window management difficult, then you can use the following alternative method:

  1. Using Netscape Navigator, display the Web page that you want to link to.
  2. Select part of the contents of the URL location box at the top of the Netscape window (select everything after the opening "http://").
  3. Copy the URL using the Edit -> Copy command.
  4. In the Tapestry window, choose the Special -> Link... command. A link selection dialog box is displayed.
  5. From the link selection dialog box, choose HTTP. A URL dialog box, as shown in Figure 5, is displayed.

    [URL Dialog Box]

    Figure 5, URL Dialog Box

  6. In the URL dialog box, paste the URL using the Edit -> Paste command. A feedback sound indicates that the link from the external document to your Tapestry document has been made.

Using the Special -> Link Command

To add a link to a Tapestry document from an external Internet document using the Special -> Link command:

  1. From the Tapestry window, select (highlight) the "anchor" text in the Tapestry document.
  2. Using Netscape Navigator, display the Web page that you want to link to.
  3. Select part of the contents of the URL location box at the top of the Netscape window (select everything after the opening "http://").
  4. Copy the URL using the Edit -> Copy command.
  5. From the Tapestry window, choose Special -> Link. A link selection dialog box is displayed.
  6. From the dialog box, choose HTTP. A URL location dialog box is displayed
  7. In the URL location dialog box, paste the URL using the Edit -> Paste command. A feedback sound indicates that the link from the external Internet document to your Tapestry document has been made.

Using the Toolbar Button

To add a link to a Tapestry document from an external Internet document using the toolbar button:

  1. From the Tapestry window, select (highlight) the "anchor" text in the Tapestry document.
  2. Using Netscape Navigator, display the Web page that you want to link to.
  3. Select part of the contents of the URL location box at the top of the Netscape window (select everything after the opening "http://").
  4. Copy the URL using the Edit -> Copy command.
  5. Choose the Link toolbar icon. A dialog box is displayed. A link selection dialog box is displayed.
  6. From the link selection dialog box, choose HTTP. A URL location dialog box is displayed
  7. In the URL location dialog box, paste the URL using the Edit -> Paste command. A feedback sound indicates that the link from the external Internet document to your Tapestry document has been made.

Navigating on the Web

Navigating on the Web means moving (sometimes called "jumping") from one Web document to another Web document by clicking on a hypertext link. For example, to jump back to the previous chapter (document) you click on the following link [Back to Tapestry Overview].

It is all too easy to browse the Web aimlessly when you really should be developing your own Web page. So it is generally best not to browse the Web while you are trying to author a page. It is good practice to visit the Web sites that you want to link to ahead of time, and organize them as bookmarks. You can then link to the bookmarks, without the distraction of browsing Web pages.

For more information on how to create links to Netscape bookmarks, see the section Working with Netscape Navigator Bookmarks in chapter 3, "Developing an Advanced Web Page". For more information on Netscape bookmarks, see the Netscape Handbook.

Using Tapestry toolbar command buttons, you can jump:

You can jump backwards and forwards between two documents by clicking the Back and Forth (Forward) toolbar buttons.

Jumping Forward to a Document

To jump forward to a document:

  1. Do one of the following:

    If the link is internal (that is, to your local hard disk), Tapestry displays the document at the end of the link.

    If the link is external (that is, to the Internet), Tapestry starts the Netscape Navigator application and then Netscape displays the document at the end of the link.

Jumping Back from a Document

To jump back from a document:

  1. Do one of the following:

    If the link is internal (to your local hard disk), Tapestry displays the document at the end of the link.

    If the link is external (to the Internet), Tapestry starts the Netscape navigator application and then Netscape displays the document at the end of the link.

Testing a Link to a Web (HTML) Page

You can test a link to a Web page to determine if it is working properly.

To test a link to a Web Page:

  1. In the Tapestry window, hold down the option key and click on the link that you want to follow.

  2. To return to the original document, do one of the following:

After you click on an external link, Tapestry launches Netscape Navigator using the location (URL of the Web document) specified by the external link. If Netscape is already open, the Web document corresponding to the link is displayed.

After you click on a link that points to a multimedia file (for example, a sound, video clip, or image), Tapestry launches the corresponding helper application and opens up the appropriate media file. You can create links to a wide variety of objects, including URLs, HTML files on your hard disk, text files, images, or videos.

Make sure that you set up the helper applications for Tapestry if you want to test links to media files.

When you option-click on an internal (local) link, the document at the endpoint of the link is loaded into the current Tapestry window. If you have made any changes since the last save, you will first be prompted to save the current version of the page (document) you are on. In contrast, when you use the option-click command on an external link, the change occurs in Netscape Navigator, where the new page is displayed. Thus, Tapestry does not prompt you to save the current page when you option-click on (follow) an external link to the Web.

Testing a Link to a non-HTML Page

You can test a link to a non-HTML page, such as an image to determine if it is working properly.

To test a link to a non-HTML Page:

  1. In the Tapestry window, hold down the option key and click on the link that you want to follow.

  2. To return to the original document, do one of the following:

Deleting a Link

To delete a link on a Tapestry page:

  1. In the Tapestry window, select the link that you want to delete.
  2. To delete the link, do one of the following:


[Back to Tapestry Overview] [Forward to Developing an Advanced Web Page]

[Contents] [Glossary]

[Index A B C D E F G H I J K L M N O P Q R S T U V W X Y Z]