&header_home=Home &header_Features=Features &header_Started=Let's Get Started &header_Back=Back &header_Next=Next &title01=Introducing Functional Features &title02=Let's Get Started &top01=This animation offers a quick overview of the strengths of Homepage Builder Version 6. Five menus are provided; simply click the menu item you want to learn more about. (With narration) &top01_old=This animation offers simple, easily understandable instructions designed to give your a quick overview of the strengths of Homepage Builder Version 6. Five menus are provided; click the menu you want to view. (With narration) &top02=Let's create a Web page by using a template. User-friendly instructions, provided in step-by-step format, guide you through the basic operations of Homepage Builder Version 6. &intro=WebSphere Studio Homepage Builder Version 6.0 offers rich functions --- such as video editing and the new drawing function --- that make Web page creation much more fun. It is an easy-to-use, all-in-one software package that offers all the tasks required for Web page creation --- from page editing to site management. Even novice users can create professional-quality Web pages. &stn_menu_title01=Overview &stn_menu01=1.Even a novice can create Web pages easily &stn_menu02=2.Creating dynamic, professional-quality Web pages is easy &stn_menu03=3.Using the video-editing function to create lively pages &stn_menu04=4.Powerful site management features automate complicated tasks &stn_menu05=5.About the draw function and cooperation with other applications &sts_menu_title01=Tutorial &sts_menu_a=Primer &sts_menu01=1.How the Internet works &sts_menu02=2.Selecting an editing mode &sts_menu03=3.What you should know before creating Web pages &sts_menu04=4.Creating a page by using the template wizard &sts_menu05=5.Creating a new page &sts_menu06=6.Creating a logo image &sts_menu07=7.Entering text &sts_menu08=8.Inserting a photo image and enclosing it with a photo frame &sts_menu09=9.Setting a link from the subpage to the top page &sts_menu10=10.Uploading your pages &sts_menu_b=Reference &sts_menu11=1.Using a table to design your page &sts_menu12=2.Adding motion to your page &sts_menu13=3.WebArt Designer: Drawing a simple map &sts_menu14=4.AnimatedGif Designer: Creating an animation from text &sts_menu15=5.WebVideo Studio: Editing your video &mode_free=In the following operations, free layout mode is used. &mode_basic=In the following procedure, standard mode is used. &mode_both=Following are common operations in standard mode and free layout mode. &text_demo01_1=Homepage Builder Version 6 provides more than 3000 materials including templates for multiple purposes, from hobbies to business.

Using the popular template wizard, you can easily create a Web page to meet your own individual requirements.

Needless to say, you can also create a Web page from scratch.

&text_demo01_2=Homepage Builder Version 6 provides more than 3000 materials including templates for multiple purposes, from hobbies to business.

Using the popular template wizard, you can easily create a Web page to meet your own individual requirements.

Needless to say, you can also create a Web page from scratch. &text_demo01_3=Homepage Builder Version 6 provides more than 3000 materials including templates for multiple purposes, from hobbies to business.

Using the popular template wizard, you can easily create a Web page to meet your own individual requirements.

Needless to say, you can also create a Web page from scratch.

&text_demo01_4=Homepage Builder Version 6 offers a new menu called the task menu. It displays necessary menu items, such as Start, Page Settings, and Publish Page, for the entire process of creating and uploading your Web page in an understandable manner.

Therefore you can create a Web page by following the guidelines in these menu items.

&text_demo01_5=Homepage Builder Version 6 offers a new menu called the task menu. It displays necessary menu items, such as Start, Page Settings, and Publish Page, for the entire process of creating and uploading your Web page in an understandable manner.

Therefore you can create a Web page by following the guidelines in these menu items.

&text_demo01_6=You can create a logo on the editing page. A rich set of color combinations for text and background is available in the Color Gallery. Visual effects, such as scrolling text or an illustration up or down, are supported.

You can easily create an attractive page even on your very first try.

&text_demo01_7=You can create a logo on the editing page. A rich set of color combinations for text and background is available in the Color Gallery. Visual effects, such as scrolling text or an illustration up or down, are supported.

You can easily create an attractive page even on your very first try.

&text_demo01_8=You can create a logo on the editing page. A rich set of color combinations for text and background is available in the Color Gallery. Visual effects, such as scrolling text or an illustration up or down, are supported.

You can easily create an attractive page even on your very first try.

&text_demo02_1= If you can create a Web page as you imagine it, the page will probably be the only one in the world.

Homepage Builder Version 6 enables you to place text and images anywhere you want on the page as if you were painting on a blank canvas: moreover, it enables you to use sophisticated techniques such as placing text over an image.

&text_demo02_2= If you can create a Web page as you imagine it, the page will probably be the only one in the world.

Homepage Builder Version 6 enables you to place text and images anywhere you want on the page as if you were painting on a blank canvas: moreover, it enables you to use sophisticated techniques such as placing text over an image.

&text_demo02_3=Homepage Builder Version 6 offers several different kinds of effects you can apply to your images; for example, the rollover effect enables you to turn your image (a logo, a button, or a photo) into another as you move the mouse pointer over and off it. Other new effects are the slide show effect, the checkerboard effect, and the album effect.

You can easily apply these effects to your image by following step-by-step instructions provided by each wizard.

&text_demo02_4=Homepage Builder Version 6 offers several different kinds of effects you can apply to your images; for example, the rollover effect enables you to turn your image (a logo, a button, or a photo) into another as you move the mouse pointer over and off it. Other new effects are the slide show effect, the checkerboard effect, and the album effect.

You can easily apply these effects to your image by following step-by-step instructions provided by each wizard.

&text_demo02_5=Homepage Builder Version 6 offers several different kinds of effects you can apply to your images; for example, the rollover effect enables you to turn your image (a logo, a button, or a photo) into another as you move the mouse pointer over and off it. Other new effects are the slide show effect, the checkerboard effect, and the album effect.

You can easily apply these effects to your image by following step-by-step instructions provided by each wizard.

&text_demo03_1=Lively pictures are essential to making your Web page more attractive and impressive.

Homepage Builder Version 6 enables you to edit video files.

You can capture the video picture taken with your digital video camera, and play it on your Web page.

&text_demo03_2=Lively pictures are essential to making your Web page more attractive and impressive.

Homepage Builder Version 6 enables you to edit video files.

You can capture the video picture taken with your digital video camera, and play it on your Web page.

&text_demo03_3=Lively pictures are essential to making your Web page more attractive and impressive.

Homepage Builder Version 6 enables you to edit video files.

You can capture the video picture taken with your digital video camera, and play it on your Web page.

&text_demo03_4=The video editing function enables you to trim off the scenes that you don't want, select an effect to be applied between two different scenes, insert background music, and superimpose titles and other text.

You can also select several images from your video data and generate an animated GIF from them. &text_demo03_5=The video editing function enables you to trim off the scenes that you don't want, select an effect to be applied between two different scenes, insert background music, and superimpose titles and other text.

You can also select several images from your video data and generate an animated GIF from them. &text_demo03_6=The video editing function enables you to trim off the scenes that you don't want, select an effect to be applied between two different scenes, insert background music, and superimpose titles and other text.

You can also select several images from your video data and generate an animated GIF from them. &text_demo04_1=Homepage Builder Version 6 makes it easier for you to upload the pages you have created.

Not only can you upload your pages to any service provider, you can also upload them just by entering your ID and password.

Homepage Builder Version 6 also does the site management for you so that you can easily maintain your site, which usually becomes more and more complicated as you update your pages.

&text_demo04_2=Homepage Builder Version 6 makes it easier for you to upload the pages you have created.

Not only can you upload your pages to any service provider, you can also upload them just by entering your ID and password.

Homepage Builder Version 6 also does the site management for you so that you can easily maintain your site, which usually becomes more and more complicated as you update your pages.

&text_demo04_3=Homepage Builder Version 6 makes it easier for you to upload the pages you have created.

Not only can you upload your pages to any service provider, you can also upload them just by entering your ID and password.

Homepage Builder Version 6 also does the site management for you so that you can easily maintain your site, which usually becomes more and more complicated as you update your pages.

&text_demo04_4=Homepage Builder Version 6 finds any broken page links and data links automatically, and enables you to correct them easily.

You can easily upload all the files included in your site, or upload only the files that have been updated or added since the last upload.

You can detect and delete any unused files in the server.

&text_demo04_5=Homepage Builder Version 6 finds any broken page links and data links automatically, and enables you to correct them easily.

You can easily upload all the files included in your site, or upload only the files that have been updated or added since the last upload.

You can detect and delete any unused files in the server.

&text_demo04_6=Homepage Builder Version 6 finds any broken page links and data links automatically, and enables you to correct them easily.

You can easily upload all the files included in your site, or upload only the files that have been updated or added since the last upload.

You can detect and delete any unused files in the server.

&text_demo04_7=Homepage Builder Version 6 finds any broken page links and data links automatically, and enables you to correct them easily.

You can easily upload all the files included in your site, or upload only the files that have been updated or added since the last upload.

You can detect and delete any unused files in the server.

&text_demo05_1=Homepage Builder Version 6 offers the new draw function in addition to the paint function.

The new function of WebArt Designer, an image editing tool, enables you to draw lines, curves, polygons, and circles more easily. You can even draw flow charts and simple maps.

&text_demo05_2=Homepage Builder Version 6 offers the new draw function in addition to the paint function.

The new function of WebArt Designer, an image editing tool, enables you to draw lines, curves, polygons, and circles more easily. You can even draw flow charts and simple maps.

&text_demo05_3=Homepage Builder Version 6 can operate in conjunction with another application, such as i-Photo Builder.

By using i-Photo Builder, you can insert images into a Web page that supports i-mode.

&text_demo05_4=Homepage Builder Version 6 can operate in conjunction with another application, such as i-Photo Builder.

By using i-Photo Builder, you can insert images into a Web page that supports i-mode.

&text_demo05_5=Homepage Builder Version 6 can operate in conjunction with another application, such as i-Photo Builder.

By using i-Photo Builder, you can insert images into a Web page that supports i-mode.

&step1intro=The Internet is a worldwide collection of networks connecting enormous numbers of computers so that they can communicate with one another. You can use the Internet for various purposes, such as exchanging e-mail (text messages and computer files), viewing Web pages, and presenting your Web pages. This section explains how the Internet works with respect to Web pages. &stn_menu01_01=What is a Web browser? &stn_menu01_02=What is a URL? &stn_menu01_03=What is the role of the Internet service provider? &text_step01_1=What is a Web browser?

Those of you who are going to create your own Web pages have probably connected to the Internet and have seen Web pages.

A Web browser is an application that enables you to view Web pages on the Internet. Microsoft's Internet Explorer and Netscape's Netscape Navigator are the best known Web browsers.

&text_step01_2=What is URL?

To view a Web page, you must first enter its address---a text string that consists of alphanumeric letters, such as "http://www.ibm.com/." This Internet address, which is used by Web browsers to identify and locate Internet resources, is called the Uniform Resource Locator (URL).

If you are using Internet Explorer, type a URL in the Address field; if you are using Netscape Navigator, type a URL in the Location field.

&text_step01_3=What is the role of the Internet service provider?

To get access to the Internet, individual users generally use a service provided by an Internet service provider---a business that supplies Internet connectivity services to individuals and organizations.

&text_step01_4=What is the role of the Internet service provider?

Different providers offer different services and payment systems. To have your Web site on a provider's server, you must subscribe to a provider that offers Web hosting service. &text_step01_5=What is the role of the Internet service provider?

When you subscribe to a provider, you are assigned a user name and a password. Then you can get access to the Internet from your personal computer by making a phone call, or "dialing up," to one of the access points specified by the provider and giving the user name and the password assigned. The number you call is called the access point. As soon as you obtain a dial-up access, you can view Web pages on a Web browser, exchange e-mail, or upload Web pages to the server.

&step2intro=Characteristics of the two modes

When selecting an editing mode, you should consider which mode is more suitable for the page you want to create. Although any page that you can create in one mode can be created in the other, you may find one mode much easier to use, depending on the design of that page. &stn_menu02_01=Characteristics of free layout mode &stn_menu02_02=Characteristics of standard mode &text_step02_1=Characteristics of free layout mode

The operations of free layout mode are similar to those of drawing tools. You can place text and images anywhere you want on a page; you can even place text over an image, or one image over another.

&text_step02_2=Characteristics of standard mode

The operations of standard mode are similar to those of word processor software. The text or image you insert is initially aligned to the left on a page; you can align it to the center or to the right afterwards.

To lay out text in a double column or to align images horizontally, you need to apply some tips. The operations of standard mode are also similar to those of earlier versions of Homepage Builder and most HTML editors.

&step3intro=This section explains important basics that you should know before you create Web pages. Those who already know the basics as follows should go to the next section.

&stn_menu03_01=Assigning a top page file the file name specified by your service provider &stn_menu03_02=Using either uppercase or lowercase alphanumeric characters consistently for the names of the HTML files &stn_menu03_03=Do not change the name or location of a file thoughtlessly &text_step03_1=Assigning a top page file the file name specified by your service provider

Usually, an Internet service provider specifies the name that must be assigned to your top page. If you assign any other name, your site cannot be viewed on the Internet. Most service providers, though not all, specify index as the name, and either .htm or .html as the extension.

Before you start creating your Web pages, check with your provider to find out what file name and extension are required.

&text_step03_2=Assigning a top page file the file name specified by your service provider

By default, top pages and other HTML files created with Homepage Builder are assigned the extension .htm. (initial setting). If the provider tells you to use index.html, change the setting of Homepage Builder by the following procedure.

You cannot change the extension of a file that is already saved.

On the menu bar, click Tools --> Options.

&text_step03_3=Assigning a top page file the file name specified by your service provider

The Options dialog appears.

Click the File tab.

&text_step03_4=Assigning a top page file the file name specified by your service provider

Confirm that the Suffix for HTML files field is set to " htm." If necessary, change this to " html."

Click the OK button.

All pages you subsequently create will have the file extension that you have specified.

&text_step03_5=Using either uppercase or lowercase alphanumeric characters consistently for the names of the HTML files

Use either uppercase or lowercase alphanumeric characters consistently for the names of the HTML files and materials used in your Web pages, because some server operating systems distinguish the case of the letters. Do not use marks such as exclamation points or question marks.

&text_step03_6=Do not change the name or location of a file thoughtlessly

If the page you have created contains a link, then if you change the name or location of the file it links to by using a tool other than Homepage Builder (such as Windows Explorer), a visitor to your Web page cannot jump to that page. For this reason, do not change the name or location of a file thoughtlessly.

&step4intro=A template may consist of a single top page or of two or more pages. In this lesson, you will create a top page by using a single-page template. The file used for the page that you have created is saved on your PC at the end of this lesson. &stn_menu04_01=Creating a page by use of a template &stn_menu04_02=Saving a page you have created &text_step04_1=Creating a page by use of a template

On the task menu, click Start --> New Page from Template. &text_step04_2=Creating a page by use of a template

The dialog for selecting a category of templates appears. Select a category of templates.

From Category, select Single page. From Genre, select free layout mode. Then click the Next button. &text_step04_3=Creating a page by use of a template

The dialog for selecting a layout and a theme for the page appears.

From Layout, select With banner 1. From Theme, select Snowboarding. Then click the Next button. &text_step04_4=Creating a page by use of a template

The dialog for setting a page title appears.

You can change the title of the top page at this point. For this example, however, you will be using the default title. Click the Next button. &text_step04_5=Creating a page by use of a template

The dialog for selecting the background color appears.

In Color Category, you can select your favorite color combination from Text and Background colors.

For this example, click the Next button without changing initial values for theme.

&text_step04_6=Creating a page by use of a template

The dialog for setting icons and text strings for the top page appears.

Select an icon and type text to be used as the link source to jump to that subpage. After you have done this for each of the links, click the Next button. &text_step04_7=Creating a page by use of a template

The dialog for selecting horizontal rules appears.

Select two horizontal rules, one for the top of the page and the other for the bottom, and then click the Next button.

&text_step04_8=Creating a page by use of a template

The dialog for inserting text on the top page appears.

In the Text field, type text for the top page. Then click the Next button.

&text_step04_9=Creating a page by use of a template

The dialog for inserting a logo image and logo text for the top page appears.

In this dialog, you can select a logo you want.

After you select logos, click the Next button.

&text_step04_10=Creating a page by use of a template

The dialog for inserting your e-mail address appears.

If you want to enable the readers of your Web pages to send comments or requests for detailed information, type your e-mail address, and then click the Next button.

&text_step04_11=Creating a page by use of a template

Settings of the template have been completed. Click the Finish button.

The top page has been created. &text_step04_12=Saving a page you have created

Click the Save icon.

&text_step04_13=Saving a page you have created

The Save As dialog appears.

For this example, you will create a new folder named mysite 1 in the My Documents folder, and then save the file in "mysite 1."

Type index.htm as the name of the file, and then click the Save button.

&text_step04_14=Saving a page you have created

The list of the files to be saved appears. Click the OK button.

&text_step04_15=Saving a page you have created

Now you have created a top page. &step5intro=In this lesson, you will be creating a new Web page from scratch. This page will be used as a subpage of the top page that you created in Lesson 4, "Creating a page by use of a template." To begin with, you will be specifying a page title, colors for the page background and text, and background music (the music that is played when a page is displayed on a Web browser). &stn_menu05_01=Creating a new page in free layout mode &stn_menu05_02=Specifying basic settings of a page &text_step05_1=Creating a new page in free layout mode

On the task menu, click Start --> New Page in Free Layout Mode.

A blank page opens. &text_step05_2=Specifying basic settings of a page

On the task menu, click Page Settings --> Specify Basic Settings for Page.

The Page Settings (Page Title) dialog appears.

&text_step05_3=Specifying basic settings of a page

In the Page title field, type your page title.

For this example, type "Photo Album" Then click the Next button.

The Page Settings (Background and Text Color) dialog appears.

&text_step05_4=Specifying basic settings of a page

Make sure that you have selected Select a predefined setting from the Color Gallery, and then click the Next button.

The Page Settings (Color Gallery) dialog appears.

&text_step05_5=Specifying basic settings of a page

Select Yellow wallpaper from Color category, and then select a color combination from Text and Background colors.

Click the Next button.

The Page Settings (Background Music) dialog appears.

&text_step05_6=Specifying basic settings of a page

You will specify the sound file to be used as the background music for the page.

Select a sound file from BGM gallery.

Click the Finish button. &text_step05_7=Specifying basic settings of a page

You have completed the basic settings of the page, including the title, color of the background and the text, and the background music for the page.

&step6intro=Let's create a logo image---an image converted from text---and use it as the heading of this page. After you have created a logo, you should specify an explanation of it (the alternative text). The alternative text is a text string that is displayed instead of an image when a Web page is viewed in an environment where the image cannot be displayed. &stn_menu06_01=Creating a logo image &stn_menu06_02=Entering a description of the logo (the alternative text) &text_step06_1=Creating a logo image

On the task menu, click Insert Page Elements (or Insert) --> Insert Logo.

The Create Logo dialog appears.

&text_step06_2=Creating a logo image

Type the text to be used for the logo, and specify the font size for it.

Type "MY PHOTO ALBUM" in the Text field. Select logotype 028, and then click the Text Attributes button.

The Logo Wizard (Specify Text - 1/4) appears.

&text_step06_3=Creating a logo image

For this example, you will specify the following:

Font name: Comic Sans MS,

Font Size: 32,

Bold: ON, Antialias: ON

Click the Next button.

The Logo Wizard (Select Color - 2/4) dialog appears.

&text_step06_4=Creating a logo image

You can change the color of the text at this point; for this example, however, click the Next button without changing the default.

The Logo Wizard (Select Outline - 3/4) dialog appears.

&text_step06_5=Creating a logo image

You can select an outline at this point; for this example, however, select the default one, and then click the Next button.

The Logo Wizard (Select Text Effect - 4/4) dialog appears.

&text_step06_6=Creating a logo image

You can change the effect of the text at this point; for this example, however, click the Finish button without changing the selected one.

&text_step06_7=Creating a logo image

You have specified type and size of the text for the logo.

You can confirm the logo image you created by using the Preview tab.

Click the Finish button.

&text_step06_8=Creating a logo image

Place the logo image in the center of the page by dragging it.

&text_step06_9=Entering an explanation of the logo (the alternative text)

Make sure that the logo image is selected.

On the menu bar, click Edit --> Attributes.

The Image Enclosed by Layout Frame dialog appears.

&text_step06_10=Entering an explanation of the logo (the alternative text)

In the Alternative text field, type an explanation of the logo. Then click the OK button.

The explanation (the alternative text) is added.

&text_step06_11=Entering an explanation of the logo (the alternative text)

Click the Preview tab. If you place the mouse pointer on the logo, the alternative text is shown.

If you have confirmed that, click the Edit Page tab to return to the page editing area.

&step7intro=In this lesson, you will be entering text below the logo that you created in Lesson 6, "Creating a logo image." In addition, you will enlarge the text, make it bold, and change its color. And finally, you will insert a horizontal rule below the text. &stn_menu07_01=Entering text &stn_menu07_02=Changing the size and boldness of text &stn_menu07_03=Changing the color of text &stn_menu07_04=Drawing a horizontal rule (delimit line) below the text &text_step07_1=Entering text

On the task menu, click Insert Page Elements (or Insert) --> Insert Text --> Normal.

&text_step07_2=Entering text

The mouse pointer turns into a cross.

Click the mouse at the position where you want to enter text.

A frame (text box) for entering text is created, and the cursor appears inside this frame. &text_step07_3=Entering text

For this example, type "Welcome to my Web page!" in the frame. If necessary, drag the text to the place where you want it. &text_step07_4=Changing the size and boldness of text

Drag the text you entered. The part of the text string you dragged is highlighted to signify that it is selected.

Let's enlarge the text a little.

On the toolbar, click the Increase Font Size button.

The text is enlarged a little.

&text_step07_5=Changing the size and boldness of text

On the toolbar, click the Bold button.

The text becomes bold.

To deselect the text, click anywhere in the editing area other than on the text.

The text is deselected.

&text_step07_6=Changing the color of text

If you deselected the text, double-click it to select it again.

Text is selected. &text_step07_7=Changing the color of text

On the menu bar, click View --> Color Palette. &text_step07_8=Changing the color of text

The Color Palette dialog is displayed.

Select the color you want to use, and then click the Apply button.

The selected color is applied to the text.

Click anywhere in the page editing area.

The text is deselected, and you can see that its color has changed.

&text_step07_9=Drawing a horizontal rule (delimit line) below the text

On the menu bar, click Insert --> Horizontal Rule.

&text_step07_10=Drawing a horizontal rule (delimit line) below the text

The mouse pointer turns into a cross.

Specify the position and the length of the horizontal rule by dragging the mouse.

A horizontal rule is drawn.

&text_step07_11=Drawing a horizontal rule (delimit line) below the text

Let's check how your page looks on the Internet by using the Preview tab.

Click the Preview tab.

You can check how your page looks on the Internet by using the Preview tab.

If you have checked that, click the Edit Page tab to return to the page editing area. &step8intro=In this lesson, you will insert a photo image, taken with a digital camera, into your page and enclose it with a decorating frame (photo frame). You don't have to prepare a photo image; you will be using one of the sample image files that Homepage Builder provides. &stn_menu08_01=Inserting a photo image and enclosing it with a photo frame &stn_menu08_02=Resizing the image and aligning it &text_step08_1=Inserting a photo image and enclosing it with a photo frame

On the task menu, click Insert Page Elements (or Insert) --> Insert Photograph.

The Insert Photograph (Specify Image File) dialog appears. &text_step08_2=Inserting a photo image and enclosing it with a photo frame

You can use this dialog to select the image you want. Click the From Gallery button.

The Open from Gallery dialog appears. &text_step08_3=Inserting a photo image and enclosing it with a photo frame

In the list of folders on the left side of the dialog, go to Images and select Photos. From the list of photos on the right side of the dialog, select a photo image you want to use. Then click the Open button.

This returns you to the Insert Photograph (Specify Image File) dialog. &text_step08_4=Inserting a photo image and enclosing it with a photo frame

You can preview the selected photo image in the Preview field on the right of the dialog.

Click the Next button.

The Insert Photograph (Resize Image) dialog appears. &text_step08_5=Inserting a photo image and enclosing it with a photo frame

Suppose that the image you inserted in is too big. Let's resize it.

For this example, select Medium (320 pixels wide), and then click the Next button.

The Insert Photograph (Retouch Image) dialog appears. &text_step08_6=Inserting a photo image and enclosing it with a photo frame

You can use this dialog to adjust the brightness and tone of the photo image.

Select the check boxes for One-touch correction and Outline emphasis, and then click the Next button.

The Insert Photograph (Decorate Image) dialog appears. &text_step08_7=Inserting a photo image and enclosing it with a photo frame

For this example, select f009, and then click the Finish button.

The photo image is inserted in the page. &text_step08_8=Resizing the image and aligning it

Resize the photo image and drag it to a position below the horizontal rule as shown in the figure.

Give the photo image a name (the alternative text) by the procedure given in Lesson 6, "Creating a logo image." &step9intro=Now that you have created a page, let's set a link from it to your top page. You can set a link on text or an image; that is, you can use either one, or both together, as the link source. For this example, you will use text as the link source. &stn_menu09_01=Setting a link from the subpage to the top page &stn_menu09_02=Moving the text on which a link has been set &stn_menu09_03=Saving your page &text_step09_1=Setting a link from the subpage to the top page

On the task menu, click Insert Page Elements (or Insert) --> Insert Link.

The Create Link dialog appears. &text_step09_2=Setting a link from the subpage to the top page

Make sure that Create a normal link is selected, and then click the Next button. &text_step09_3=Setting a link from the subpage to the top page

Click the Select button next to the Link address (URL) field. On the pop-up menu, click From Files.

The Open dialog appears. &text_step09_4=Setting a link from the subpage to the top page

Specify the destination file for the link. For this example, open the mysite 1 subfolder in the My Documentsfolder in Drive C, select the top page file (index.htm), and then click the Open button.

The address of the top page is set in the Link address (URL) field. &text_step09_5=Setting a link from the subpage to the top page

For this example, type "Return to the top page" in the Link title field.

Click the Finish button.

The text string, "Top page," is inserted on the page. &text_step09_6=Moving the text on which a link has been set

A text string is underlined to indicate that a link is set on it.

Drag the text string to the place where you want it on the page. &text_step09_7=Moving the text on which a link has been set

A link from the subpage to the top page has been set. &text_step09_8=Saving your page

Click the Save icon.

&text_step09_9=Saving your page

The Save As dialog appears.

For this example, you will save the page in the folder, mysite1, which is created in Lesson 4, "Creating a page by use of a template."

Type "sub.htm" in the File Name field, and then click the Save button

&text_step09_10=Saving your page

The list of HTML files saved in the folder appears; make sure the destination folder where the page is to be saved. Click the OK button.

&text_step09_11=Saving your page

You have created a subpage. &step10intro=In this lesson, you will upload your Web pages to your provider's server. Before uploading your Web pages to your provider's server, you will create a site on your PC. The site means a folder dedicated to your Web pages. You can upload all of the files in a site at once by having Homepage Builder recognize your Web pages as constituting a site. In addition, for every upload after the first, Homepage Builder identifies the files that have been updated or added since the last upload and enables you to upload only the updated or added files. &stn_menu10_01=Creating your site on your personal computer &stn_menu10_02=Uploading your site as a unit &text_step10_1=Creating your site on your personal computer

On the task menu, click Start --> Create Site.

The Create New Site (Specify a name for the site) dialog appears.

Save all your Web pages before you create a site. If any page is being edited and has not been saved, the site may not be created properly. &text_step10_2=Creating your site on your personal computer

The Site name field contains "New Site 1."

Enter the site name in the Site name field. For this example, type "my site."

Click the Next button.

The Create New Site (Select how to specify a top page) dialog appears. &text_step10_3=Creating your site on your personal computer

Select Use an existing page as the top page.

Click the Browse button. &text_step10_4=Creating your site on your personal computer

In the Look in field, select the subfolder that includes the files for the Web pages. The list of HTML files saved in the folder appears.

From the list of files that appears, select the name of the top page (usually "index.htm" or "index.html").

Click the Open button.

The file name of the top page appears in the Create New Site (Select how to specify a top page) dialog. &text_step10_5=Creating your site on your personal computer

Confirm that a proper name for the file is selected, and then click the Next button.

The Create New Site (Sever profile) dialog appears. &text_step10_6=Creating your site on your personal computer

Confirm that Configure a server profile later is selected, and then click the Finish button.

A site is created. &text_step10_7=Creating your site on your personal computer

A site is created, and the file structure of the site is displayed on the Site tab in the Site/Gallery View.

&text_step10_8=Uploading your site as a unit

On the task menu, click Publish Page --> Upload Site (Updated Files Only). &text_step10_9=Uploading your site as a unit

If you haven't created a server profile, a message prompts you to do so.

Click the OK button. The Upload Page or Site (Prepare to Upload Files) dialog appears.

&text_step10_10=Uploading your site as a unit

Confirm that the Site Name field contains the name specified in step 2. Then click the Next button.

The Create New Server Profile (Specify Information for the server profile) dialog appears. &text_step10_11=Uploading your site as a unit

Select your provider, and then select or enter the FTP server name, the FTP account name, and the FTP password as you have been instructed by your provider.

Then click the Next button.

The Create New Server Profile (Specify a destination folder) dialog appears. &text_step10_12=Uploading your site as a unit

Specify the name of the destination folder as instructed by your provider.

Click the Finish button. &text_step10_13=Uploading your site as a unit

Confirm that the server profile you want to use is selected.

Click the Next button.

The Upload Page or Site (Prepare to Upload Files -- Check files to be uploaded) dialog appears. &text_step10_14=Uploading your site as a unit

The server profile settings appear on the right of the dialog.

Click the Finish button. &text_step10_15=Uploading your site as a unit

If your PC is not connected to the Internet, a dialog prompting you to connect is displayed. After connection, the upload begins, and then the dialog for indicating the status of the upload appears.

When the upload is complete, a message, "Transfer complete," appears.

Click the OK button.

You have uploaded your Web pages to your provider's server. &step11intro=Homepage Builder provides several sample tables for designing your pages. These tables, called layout tables,are created especially for designing Web pages. By using a layout table, you can easily design a page even in standard mode---for example, layingout an image on the left side and text on the right side. &sts_menu11_01=Inserting a layout table &sts_menu11_02=Examples of using layout tables &text_step11_1=Inserting a layout table

In the Site/Gallery View, click the Gallery tab and then click Materials for layout.

A list of layout tables is shown on the lower part of the Site/Gallery View. &text_step11_2=Inserting a layout table

Select the layout table you want--- a line (headline) for this example---and click the Insert button.

The layout table is inserted into the page. &text_step11_3=Inserting a layout table

Click anywhere inside the layout table, and type text or insert an image.

For this example, the text, "Topic of this week," is inserted. &text_step11_4=Examples of using layout tables

Homepage Builder provides many sample layout tables. Let's see some examples of using them.

For this example, a layout table named two lines color (1) is inserted. &text_step11_5=Examples of using layout tables

In the layout table, a logo is inserted in the upper row, and text in the lower row. &text_step11_6=Examples of using layout tables

For this example, a layout table named two lines color (2) is inserted. &text_step11_7=Examples of using layout tables

In the layout table, a photo is inserted in the left column, and a title and text in the right columns. &text_step11_8=Examples of using layout tables

For this example, a layout table named two lines color (3) is inserted. &text_step11_9=Examples of using layout tables

In the layout table, a photo is inserted in the right column, and a title and text in the left columns. &text_step11_10=Examples of using layout tables

For this example, a layout table named two lines color (4) is inserted. &text_step11_11=Examples of using layout tables

In the layout table, a title is inserted in the upper row, and text in the lower-left and lower-right columns.

You can use layout tables to design your Web pages in various ways. Enjoy creating attractive pages! &step12intro=Dynamic HTML enables you to animate a Web page by using only the HTML file; you do not need to prepare a separate animated GIF file or write a program in another file.

&sts_menu12_01=Standard mode &sts_menu12_02=Free layout mode &text_step12_1=Standard mode

To use dynamic HTML, you first create a box area called a layout frame on your page, and then insert text or images into it.

First, create a layout frame at any position you like on your page.

On the menu bar, click Insert -> Layout Frame. &text_step12_2=Standard mode

The Layout Frame dialog appears.

Click the Effect tab.

From Effect, select the effect you want to apply to the layout frame. Then, from Pattern, select the direction of movement. For this example, select Float from Effect and Pattern 1 (small) from Pattern. Specify the speed option and the loop option as necessary.

Click the OK button. &text_step12_3=Standard mode

The Layout Frame dialog closes, and a layout frame is inserted on the page. You can move or resize the layout frame by dragging the mouse. &text_step12_4=Standard mode

The following example describes how to insert an image in a layout frame.

On the upper part of the Gallery tab, go to Image and then click Icons.

On the lower part of the Gallery tab, select a GIF file.

Click the Insert button at the bottom of the Gallery tab. &text_step12_5=Standard mode

The selected image is inserted into the layout frame. To preview the movement, click the Preview tab. &text_step12_6=Standard mode

The image should move as you specified. &text_step12_7=Free layout mode

In free layout mode, each element (such as text or images) inserted into a page is automatically enclosed by a layout frame. You can therefore use dynamic HTML easily on any element.

Select an element that you want to animate. &text_step12_8=Free layout mode

On the menu bar, click Edit -> Attributes. &text_step12_9=Free layout mode

The Image Enclosed by Layout Frame dialog appears. Click the Effect tab.

From the Effect field, select the effect you want to apply to the image. From the Pattern field, select the direction of movement. Specify the speed option and the loop option as necessary.

Click the OK button. &text_step12_10=Free layout mode

The specified effect is applied to the selected image.

To check the movement, click the Preview tab. &step13intro=By using the drawing tools of WebArt Designer, you can draw simple maps and other figures to use on your Web page. The resulting figures are called vector-type data. Unlike other image types, vector-type data includes co-ordinates of the line, for easier editing. For this example, draw a simple map as follows: &sts_menu13_01=Drawing lines and creating an outline of the figure &sts_menu13_02=Adding the station and other objects &sts_menu13_03=Editing objects &sts_menu13_04=Grouping figures &sts_menu13_05=Inserting the map into Homepage Builder &text_step13_0=Drawing lines and creating an outline of the figure

In the Homepage Builder main window, go to the menu bar, and click Tools -> WebArt Designer.

WebArt Designer starts.

&text_step13_1=Drawing lines and creating an outline of the figure

First, draw the roads.

Click the Straight Line icon on the Operation toolbar. Select a different width from the drop-down list as necessary. For this example, select 6 pixels.

The mouse pointer turns into the Straight Line tool pointer. &text_step13_2=Drawing lines and creating an outline of the figure

To draw a horizontal line, click the mouse button at the starting point and hold it down; press the Shift key and hold it down; and drag the mouse horizontally.

A horizontal line is drawn.

Draw another horizontal line. &text_step13_3=Drawing lines and creating an outline of the figure

To draw a diagonal line, move the mouse pointer to the starting point, click and hold the mouse button, and drag the mouse diagonally to the left.

A diagonal line is drawn.

Draw the rest of the diagonal lines.

&text_step13_4=Drawing lines and creating an outline of the figure

To draw a tight curve on the road, click the Zigzag Line icon on the Operation toolbar.

Move the mouse pointer on the Canvas, clicking the mouse button once at the starting point and once at the turning point, and double-click at the end point.

A tight curved line is drawn.

&text_step13_5=Adding the station and other objects

Next, mark the railway line with a curved line (the dotted line in this example). To draw a curve, you can use one of the three tools: Curve (Specify Anchor Points), Curve (Smooth), or Curve (Freehand). For this example, use the Curve (Specify Anchor Points). Click Curve (Specify Anchor Points); then select the dotted line from the drop-down list of line types. On the canvas, click the mouse button at the starting point of the curved line. Click the summit of each curve, one by one; then double-click at the end point.

&text_step13_6=Adding the station and other objects

To put a black circle on the map for each building, click the Ellipse/Circle (Outline and Fill) icon on the Operation toolbar.

Click the down-arrow next to the icon to open the pull-down menu; then click Ellipse/Circle (Fill Only).

To change the color of the figure, click Background color, and then select black on the Color (or Color Settings) dialog.

&text_step13_7=Adding the station and other objects

Move the mouse pointer onto the Canvas.

The mouse pointer turns into that of the Ellipse/Circle (Outline and Fill) tool.

To draw a circle, drag the mouse diagonally while pressing and holding the Shift key.

Draw the rest of the circles. &text_step13_8=Adding the station and other objects

To draw a line connecting with the circle, click the Straight Line icon on the Operation toolbar, select a solid line from Line Type, and then select the line width. For this example, select 1 pixel.

Click and hold the mouse button at the starting point, and drag the mouse diagonally.

A line is drawn.

&text_step13_9=Adding the station and other objects

To add an arrow-line showing the direction of railway, do the following:

Click the Straight Line icon on the Operation toolbar, and then select the line width and the arrow type from the drop-down menu.

Click and hold the mouse button at the starting point and drag the mouse diagonally. &text_step13_10=Adding the station and other objects

To type text on the Canvas, click the Text icon on the Operation toolbar, and then click at the position where you want to insert text.

The mouse pointer turns into the Text tool pointer.

Type the name of the place or building. To end text input, press the Esc key or click outside the text box. &text_step13_11=Adding the station and other objects

To add illustrations to the drawing, click the WebArt Gallery tab, and then click the Shapes button. Select the illustration you like, and click the Insert button.

The illustration appears at the upper left corner of the Canvas; drag it to the position you like, and resize it.

&text_step13_12=Editing objects

To edit the shape object you have drawn, do the following:

Select the object you want to edit, and then click Edit --> Edit Object on the menu bar.

The Edit Shape dialog appears.

You can edit the object by changing the settings in the dialog. For this example, change the transparency of the building image.

The image has become transparent; the dotted line behind it is now visible. &text_step13_13=Grouping figures

To move or resize the figures on the map, do the following:

Click the Select Object icon on the Operation toolbar. Drag the mouse pointer over the map while holding down the left mouse button. All objects on the map are selected, and eight square knobs appear around them.

On the menu bar, click Object -> Group -> Group. All the objects on the map are grouped, and eight square knobs appear around the group.

Drag the map to the position where you want it.

&text_step13_14=Inserting the map into Homepage Builder

On the menu bar, click File -> Send Object To -> Homepage Builder.

The map is inserted into the page being edited with Homepage Builder.

&step14intro=By using AnimatedGif Designer, you can create an animated banner--an animation created from text. To create an animated banner, you first create multiple images by adding an animation effect to text, and then combine them into a single animated GIF file. Use animated banners to make your Web pages more eye-catching! &sts_menu14_01=Creating an animation from text &sts_menu14_02=Inserting the animation into Homepage Builder &text_step14_1=Creating an animation from text

On the menu bar of Homepage Builder, click Tools -> AnimatedGif Designer.

&text_step14_2=Creating an animation from text

AnimatedGif Designer starts, and the Startup dialog appears.

Select Animation Wizard. &text_step14_3=Creating an animation from text

The Animation Wizard (Select Animation Type) dialog appears.

Select the Create an animated banner button, and then click the Next button. &text_step14_4=Creating an animation from text

The Animation Wizard (Animated Banner - Select background) dialog appears.

Click the Browse button. &text_step14_5=Creating an animation from text

The Open dialog appears.

Select the image to be used as the background of text, and click the Open button. &text_step14_6=Creating an animation from text

Click the Next button. &text_step14_7=Creating an animation from text

In the Text box, type "Sunflower", and then adjust the size and position of the text.

Click the Text Attributes button. &text_step14_8=Creating an animation from text

The Edit Logo dialog appears.

You can use the Text tab to change the font name or the size. For this example, go to the Color tab. &text_step14_9=Creating an animation from text

You can use the Color tab to select the color of text. For this example, select Solid color from Type, and red from List. Then go to the Outline tab. &text_step14_10=Creating an animation from text

You can use the Outline tab to select the outline, or border, of text. For this example, select None. Then go to the Effect tab. &text_step14_11=Creating an animation from text

From Type, select Shadow. Then click the OK button. &text_step14_12=Creating an animation from text

Select which effect you want to apply to the animation.

For this example, select Wipe. Then click the OK button. &text_step14_13=Creating an animation from text

In the Preview Animation dialog, you can preview the animation.

Click the Finish button. &text_step14_14=Inserting the animation into Homepage Builder

To insert the animation into the page being edited with Homepage Builder, do the following:

On the menu bar, click File. &text_step14_15=Inserting the animation into Homepage Builder

On the File menu, click Send To -> Homepage Builder. &text_step14_16=Inserting the animation into Homepage Builder

The animation is inserted into the page. &step15intro=WebVideo Studio is one of the accessory tools included in Homepage Builder. With it, you can capture a video you have taken with your digital video camera, edit it, add various effects, and generate a video file or an animated GIF file as output. You can easily insert either kind of file into a page in Homepage Builder. &sts_menu15_01=Using the Video Creation Wizard &sts_menu15_02=Inserting the video into Homepage Builder &text_step15_1=Using the Video Creation Wizard

To start WebVideo Studio, do the following:

In the CD-ROM drive, insert the CD-ROM that contains sample files for Web Video Studio.

On the menu bar of Homepage Builder, click Tools -> WebVideo Studio. &text_step15_2=Using the Video Creation Wizard

When WebVideo Studio starts, the Welcome to WebVideo Studio dialog appears.

Click Create a project, using the Video Creation Wizard. &text_step15_3=Using the Video Creation Wizard

The Video Creation Wizard starts.

When you are ready to proceed, click the Next button. &text_step15_4=Using the Video Creation Wizard

To select the files you want to use in your video, click the Add button.

&text_step15_5=Using the Video Creation Wizard

The Open File dialog appears. For this example, select scene05.avi; then click the Open button. &text_step15_6=Using the Video Creation Wizard

In the list box, the thumbnail of scene05.avi appears. To add another file, click the Add button again. &text_step15_7=Using the Video Creation Wizard

Select another sample file you want to add. For this example, select scene02.avi; then click the Open button. &text_step15_8=Using the Video Creation Wizard

In the list box, the thumbnail of scene02.avi is added.

Click the Next button. &text_step15_9=Using the Video Creation Wizard

Next, specify the transition to be used between the two video clips: scene05.avi and scene02.avi.

For this example, select Barn doors. For Duration of transition, specify 1 second.

Click the Next button.

&text_step15_10=Using the Video Creation Wizard

Now, let's specify the text to be displayed at the opening and the closing of your video.

For this example, type "Flowers and Bubbles" for the opening text, and "The End" for the closing text.

After you have typed text, click the Text Attributes button for the opening text. &text_step15_11=Using the Video Creation Wizard

The Edit Logo dialog appears.

For this example, go to the Outline tab, and select Seal.

Click the OK button. &text_step15_12=Using the Video Creation Wizard

You can see that the opening text has changed.

Click the Text Attributes button for the closing text. &text_step15_13=Using the Video Creation Wizard

For this example, go to the Color tab. Select Gradation from Type, and then select blue04.

Click the OK button. &text_step15_14=Using the Video Creation Wizard

After you have checked the closing text, click the Next button. &text_step15_15=Using the Video Creation Wizard

You can specify the background music for your video.

Click the Browse button, and select the sound file you want to use. &text_step15_16=Using the Video Creation Wizard

For this example, select bgm07.wav; then click the Open button. &text_step15_17=Using the Video Creation Wizard

Click the Next button. &text_step15_18=Using the Video Creation Wizard

All the settings are now complete.

Click the Finish button. A video project is created. &text_step15_19=Using the Video Creation Wizard

The main window of Web Video Studio displays the contents of the video project you have just created. To play it back, click the Preview All button. &text_step15_20=Using the Video Creation Wizard

After the Processing Status dialog appears, the Monitor previews the entire project. &text_step15_21=Using the Video Creation Wizard

You can also preview each clip by clicking the Play button. &text_step15_22=Inserting the video into Homepage Builder

To insert the video you have edited into a page in Homepage Builder as a video file, do the following:

On the menu bar, click Output -> Send to Homepage Builder -> As Video. &text_step15_23=Inserting the video into Homepage Builder

The Output Video Wizard starts.

Make sure that Entire project has been selected, and then click the Next button. &text_step15_24=Inserting the video into Homepage Builder

The Select Output File Format dialog appears.

For this example, select Windows Media format; then click the Next button. &text_step15_25=Inserting the video into Homepage Builder

The File Settings dialog appears.

You can use this dialog to specify options for the output file. For this example, accept the default settings and click the Next button. &text_step15_26=Inserting the video into Homepage Builder

The Specify Insert Format dialog appears.

You can use this dialog to specify how the video file is to be inserted into the page. For this example, select As a plug-in object.

Click the Finish button. &text_step15_27=Inserting the video into Homepage Builder

Web Video Studio starts to prepare a video file and send it to Homepage Builder.

After the processing is finished, the Select Mode dialog usually appears.

For this example, select Standard mode; then click the OK button. &text_step15_28=Inserting the video into Homepage Builder

A video file has been inserted into the page being edited with Homepage Builder.

To check the movement of the video file, click the Preview tab.