Exploring Home Page

Exploring Claris Home Page Creating a New Web Page 1. When you start the Home Page software it automatically presents you with a new, blank page. 2. At the top of the page the main menu, a toolbar and a stylebar are displayed. Main Menu Toolbar Style Toolbar As you move the cursor across the tool bar, the purpose of each of the tool buttons is displayed to the right of the line. 3. To save your work, select File -> Save As from the Main Menu. Enter a name, such as mypage, when prompted. Then choose a location to save the page. It is recommended that you save all of the pages and graphics for one site in one folder. One you have save a file with a name, the next time you want to save your work you select File -> Save from the Main Menu. Save your web page frequently. Exiting Home Page 1. To exit Home Page, select File -> Exit from the Main Menu. Reopening a Web Page 1. Start the Home Page software. 2. Select File -> Open from the Main Menu. Browse through the files until you find your page. Click the name, for example mypage.htm, then click the Open button. Starting a New Page without Closing Home Page 1. Select File -> Close from the Main Menu. 2. Select File -> New Page. Saving Web Pages in a Web Site Folder Most of the time you want to create a web site that is made up of individual web pages that are linked together. The pages will have pictures and perhaps videos and sound. To make the eventual uploading of the site easier, create a folder that will hold all of the information (pages, images, sounds, videos) . 1. Select File -> New. 2. Select Empty Site. Click OK. 3. Find the location in which you will store your new folder. 4. Give the new folder a name such as your school’s name if you are creating a school web site. Click Save. A Site Editor dialog box displays showing that a new file called site_definition.wst has been added to the folder. This file tracks the information about the pages you store in this site folder. 5. When creating new pages be sure to save them in the site folder. Working with the Web Site Folder 1. Start Claris Home Page. 2. Select File -> Select Folder as Site. Find the web site folder, then click the Select site button shown at the bottom of the dialogue box. 3. The site editor opens. Click on the page you want to work with, for example, mypage, or choose File -> New to create a new web page. Remember to save new pages in the site folder. The new page will be added to the Site Editor list. 4. As you work with pages, adding images, click the Consolidate button in the Site Editor toolbar. This will make sure that copies of your images are placed automatically in the folder as well so that when you upload your site later, all required information has been consolidated in one folder. Working with Text There are two sets of formatting tools, those used with paragraphs and those used with characters (such as letters, numbers and punctuation). 1. Key in the text shown below. 2. Drag your cursor to highlight all of the lines. a. Click the Align Right button on the stylebar. b. Click the Align Center button. c. Click the Align Left button. 3. Place the cursor somewhere in the first line. Select the Paragraph Styles drop-down menu from the stylebar. Select Heading 1. You do not need to highlight the entire text because a paragraph style is applied to the entire paragraph. Continue formatting the other three lines choosing the appropriate Heading styles. 4. Change the paragraph style for all lines back to Normal by highlighting the text then selecting the Normal paragraph style. Lists There are three types of lists: bullet lists, numbered lists and definition lists. Bullet Lists 1. Highlight all of the lines of text. (These will be the items in your list.) 2. Click the Bullet List button on the stylebar. Bullets appear at the start of every line. Move your cursor to the end of line 2. Press Enter. A new line will be added with a bullet. Click the Increase Indent button. Add the sentence: This is an example of a nested bullet list. Press Enter, then click the Increase Indent button again and type and so on. Place the cursor on the fourth line and click the Decrease Indent button. Numbered Lists 1. Highlight all of the lines in the bullet list. Click the Numbered List button. Notice that the lines start with # symbols. Highlight all of the lines in the numbered list. Select Format -> Numbered List Style -> A, B... Notice that the lines now start with X symbols. To see the page the way it will look in your browser, click the Preview Page button on the toolbar. To continue working on the web page, click the Edit page button. Definition Lists Definition Lists 1. Press Enter a few times after the numbered list. Notice that the X symbols appear at the beginning of each line, continuing the numbered list format. Highlight those new lines. Click the Paragraph Styles drop-down menu and select Type. 2. Add the lines of text show below to the page, pressing Enter after each line. Notice that Home Page keeps the paragraph format that you choose. To change back to the normal format, press Enter then select the Normal paragraph style. Viewing the Source Code To see the HTML codes that are being created as you design your web page, click the Edit HTML Source button. Markup tags, enclosed in < > brackets are the commands that tell the Internet browser how to format the text. For example, <OL> stands for “start the ordered/numbered list”. <LI> stands for “list item”. There are many books and online tutorials that will teach you how to create web pages by using HTML codes. The Home Page software allows you to create web pages without knowing the meanings of the HTML codes that Home Page generates for you behind the scenes. Click the Edit Page button to continue working on the web page. Horizontal Rules Enhance the appearance of a page that has a lot of text by inserting a horizontal rule. 1. Place the cursor after the last line of text. Make sure the paragraph style is normal. 2. Click the Horizontal Rule button . 3. Double click the horizontal rule. Notice the height of the line and the alignment. Make sure the Shade option is not selected. Close the properties box. 4. Click the horizontal rule once. Drag the stretch handle at the bottom down. 5. Double click the horizontal rule and see how the height has changed. 6. You can also change the length of the line by changing the percentage. Character Formatting Changing Text Size 1. Highlight a character or word. 2. Click the Larger Text button. Click the Smaller Text button. Changing Text Colour 1. Highlight a character or word. 2. Click the Text Colour button. Select a colour from the pop-up colour palette. Adding Blank Lines 1. Move to the position of the first line. 2. Hold down the shift key and press the Enter key. The carriage return symbol will appear. Page Backgrounds You can use a colour or an image as a background for a page. The image you use can be a graphic that is already on your disk, one that you have download from the web (being sure not to infringe on copyrights), a digital photo you took with a camera or a picture that you scanned and saved as a file. The image must be in a .GIF or .JPG format. You can display text and images on top of page backgrounds. Background Colours 1. Click the Document Options button. 2. Select the Color button in the Background panel. Pick a colour from the palette. Click OK. Background Images 1. Click the Document Options button. 2 Click the Set button in the Background panel. Find a picture. Click OK. A small image will be repeated so that it covers the entire page. This effect is called tiling. Choose images carefully so that the page does not look too cluttered and so that text and other images are easy to read and see. Images on Web Pages Most browsers will support two types of images, GIFs and JPGs. You can make your own images or use ones that exist. To make your own images create one in a paint or graphics program, use a digital camera, scan a picture you have drawn or capture a frame from a video tape or video camera. Ready made images exist in clipart folders of many software packages such as Appleworks, Word. Graphics packages such as Corel Draw and paint have images. Images can be downloaded from Internet sites. To save an image that you see on a site, right click the image (on a PC) or press the mouse (on a Mac). A pop-up menu will display options. Select the Save Image as (PC) or Save Picture as Image (Mac) option. Inserting an Image 1. Click the Insert Image button. 2. Find the folder in which the graphic is located. Select the image. Click Open. The image will appear on the page. 3. An image has many properties that you can change. For example, you can add a border, align it on a page, change its height and width and display text if.

Load more