PART 1 Use a Template to Create New Pages 1) Start Dreamweaver.

2) In the Start page, under Create New, click the HTML. 3) In the New Document dialog box, click the Templates tab. a. Under Templates for, select your Language Club site that you previously worked on. b. Under Site, select Language_Main. c. Click Create to open the template. 4) At the top of the page, in the Title box, select Language Main. a. Type: Language Club – Home Page. b. Press Enter. 5) Choose File>Save As. Name the file index.html. Click Save. 6) Choose File>New (or press Ctrl + N) to display the New from Template dialog box. a. Follow steps 3 through 5 above to create three additional Web pages. b. Use the page titles and file names shown below to create these new pages. Page Titles and File Names Page Title File Name Language Club – About Us Language Club – Events Language Club – Contact Us 7) Save your work. PART 2 Organize the Site’s File Structure 1) In the Files panel, right-click your Language Club Web site’s index.html file. a. In the options menu, select Set as Home Page. b. Right-click Site – Language Club and choose New Folder from the menu. c. Name the new folder: pages. 2) Select the about_us page, then hold the Ctrl key down and select the contact_us and events pages. a. Drag the files into the pages folder. b. In the Update Links dialog box, click Update. 3) Preview your site in a browser. If you have any broken links, ask your teacher how to fix them. PART 3 Insert Page Headers about_us.html events.html contact_us.html

1) In the Files panel, double-click index.html to open it. 2) Double-click the Header editable region. Press Delete to remove any text that may be in the section. 3) Choose Insert>Image (or press Ctrl + Alt + I). In the Look in box, browse to the MTComputer\Scook\WebPageDesignImages folder. 4) Double-click the file hdr_welcome.gif. a. If necessary, click Yes. b. Save the file in your Web site’s images folder. 5) Make sure the image is still selected. a. In the Properties inspector, in the Alt box, key: b. Language Club Web Site. Press Enter. 6) Choose File>Save to save the page. 7) Repeat steps 1 through 7 for the sub pages about_us.html, events.html, and contact_us.html. a. For each page, insert the head graphic and alternative text shown below. b. Make sure you save each page’s graphic file in your Web site’s images folder. c. Be careful to insert the correct graphic file into each page. Page Header Information File Name Graphic Alternative Text about_us.html hdr_aboutus.gif About Us events.html hdr_events.gif Events contact_us.html hdr_contactus.gif Contact Us 8) Save you files. PART 4 Add Content and Color to the Home Page 1) In the Language Club Web site, expand the Templates folder and double-click Language_Main.dwt to open the template. 2) Click in the word content in the content editable region. a. In the Properties inspector, click the Bg drop-down arrow and select white. The hexadecimal value #FFFFFF displays in the box. b. In the Properties inspector, click the Vert drop-down arrow and select Top. 3) With the insertion point still in the content region, choose Modify>Table>Split Cell a. In the Split Cell dialog box, under Split cell info, select Columns. b. Set the Number of columns to 2. c. Click OK.

4) Click inside the new table cell and choose Insert>Template Objects>Editable Region. a. In this dialog box, in the Name box, Type bodytext. b. Click OK. 5) Save your template file. a. When asked to update all the files dependent on this template, click Update. b. Click Close. Close the template file. 6) Open index.html and double-click on the content editable region. Press Delete to remove any text. 7) Choose Insert>Image. Browse to the MTComputers\Scook\WebPageDesignImages folder and double-click photo_members.jpg. Save the file in the images folder. 8) In the Properties inspector, click Align Center. a. In the Alt box, Type: Club Members. . 9) Place the insertion point to the left of the photo. Press Shift + Enter to insert space above the photo. 10) Position the insertion point in the space above the photo and key: Hello! Hola! Bonjour! 11) Double-click the bodytext editable region. a. Presses delete to remove any text. b. Type: Here is a group of our club members at this year’s kick-off meeting. It is never too late to join in and explore new languages and cultures from around the world! 12) Select Text>Check Spelling (or press SHIFT+F7). ‘ 13)SAVE YOUR FILE! PART 5 – Format Text 1. Select the Hello! Hola! Bonjour! Text above the photo. a. In the properties inspector, click the font drop-down menu. b. Select Arial, Helvetica. Sans-serif 2. In the size box, type 20. 3. Click on the bold style option. 4. In the text color box, type #3300FF to change the Hello! Hola! Bonjour! Text color to blue. 5. Select the text in the bodytext editable region and change the font to Verdana, Arial, Helvetica, sans-serif. 6. Change the font size to 18 pixels. 7. If necessary, click the Align Center to center the text. 8. SAVE YOUR FILE. 9. PREVIEW IN A BROWSER. 10. CLOSE YOUR FILE.