7/29/2019 Module - Creating Web Site using Page Breeze

1/18

KEMENTERIAN PELAJARAN MALAYSIAKEMENTERIAN PELAJARAN MALAYSIA

Self Access LearningSelf Access LearningModuleModule

Creating WebsiteCreating Website

PUSAT PERKEMBANGAN KURIKULUM

ICT Literacy forICT Literacy forSecondary SchoolSecondary School

ProgrammProgramm

7/29/2019 Module - Creating Web Site using Page Breeze

2/18

KEMENTERIAN PELAJARAN MALAYSIA

7/29/2019 Module - Creating Web Site using Page Breeze

3/18

ICTL For Secondary School - WebsiteModule

MODULE 4

DEVELOPE SCHOOL WEBSITE

USINGPAGE BREEZE HTML EDITOR

Curriculum Development CentreMinistry of Education Malaysia

1

7/29/2019 Module - Creating Web Site using Page Breeze

4/18

ICTL For Secondary School - WebsiteModule

1. Name of Module : Develop School Website Using Page Breeze HTML

Editor

2. Learning Outcomes : The students should be able to

a. Creating Website

3. Knowledge and Skills

a. Create Main Page

b. Create Web Pages

c. Insert text

d. Insert Images

e. Insert Hyperlink

f. Save Web Page

4. Module Summary

At the end of the module students should be able to produce web pages.

2

7/29/2019 Module - Creating Web Site using Page Breeze

5/18

ICTL For Secondary School - WebsiteModule

3

7/29/2019 Module - Creating Web Site using Page Breeze

6/18

ICTL For Secondary School - WebsiteModule

Activity 1: Creating Main Page

1. Launch Page Breeze HTML Editor from the START menu.

2. The Page Breeze HTML Editor window will appear as below.

4

7/29/2019 Module - Creating Web Site using Page Breeze

7/18

ICTL For Secondary School - WebsiteModule

3. To create a new project, double click directory C (Step 1) and then click Folder button(Step 2)

4. This dialogue box will appear, type MY SCHOOL_YOUR NAMEin folder name boxthen click ok.

5. MY SCHOOL_YOUR NAMEfolder will appear in directory C.

6. Click new page button on the toolbar and a dialogue box will appear as below.

Step 1

Step 2

5

7/29/2019 Module - Creating Web Site using Page Breeze

8/18

ICTL For Secondary School - WebsiteModule

6.1. Type MY SCHOOL_YOUR NAMEin the Page Title area.

6.2. Click on CheckBox

6.3. Click OK button

6

7/29/2019 Module - Creating Web Site using Page Breeze

9/18

ICTL For Secondary School - WebsiteModule

7. Highlight Heading 2 and retype your own greeting text example WELCOME TO MYWEBPAGE. You can add more information about your school as you wish.

8. Next, insert your school picture.

8.1. Click insert on menu bar and choose graphic

7

7/29/2019 Module - Creating Web Site using Page Breeze

10/18

ICTL For Secondary School - WebsiteModule

8.2. Browse and get your picture folder. Choose a picture is that suitable for yourwebpage and click OK.

(You may add a few more pictures that related to your school using the same process)

9. Create your own hyperlink menuat the bottom of webpage.

9.1. Click table menuat menu bar choose insert table. Modify the insert tabledialogue box as the diagram shown below then click OK.

9.2. Type Teacher , Student and About in each column as the diagram below.

8

7/29/2019 Module - Creating Web Site using Page Breeze

11/18

ICTL For Secondary School - WebsiteModule

9.3. Modify your table by arranging all texts to be in the middle of each column.

9.4. Save your project and exit.

9

7/29/2019 Module - Creating Web Site using Page Breeze

12/18

ICTL For Secondary School - WebsiteModule

A ctivity 2 : Creating New Webpage

1. Launch Page Breeze HTML Editor using the STARTmenu.

2. Make sure you open your previous folder.

3. Click File on menu bar and choose New. The dialogue box for creating a newpage will appear.4. In the dialogue box, type MY TEACHER as the title for new page (Step 1) and

then rename the html file to teacher.htm (step 2). Click OK

5. Repeat the same process to create another 2 pages and name it as student.htm

and about.htm.

6.

10

Step 1

Step 2

7/29/2019 Module - Creating Web Site using Page Breeze

13/18

ICTL For Secondary School - WebsiteModule

7. Complete all content with more information about your school as you wish inteacher.htm, student.htm and about.htm file.

8. In order to create a home button, type Home at the bottom left of teacher.htm,student.htm and about.htm file.

9. Save and exit the project

11

7/29/2019 Module - Creating Web Site using Page Breeze

14/18

ICTL For Secondary School - WebsiteModule

Activity 3 : Creating Hyperlink

1. Highlight the word Teacher in index.htm file.

2. Click Insert from the Menu Barthen choose Hyperlink. TheHyperlink dialog boxwill appear. In the hyperlink dialog box, choose teacher.htm file and click OK.

12

7/29/2019 Module - Creating Web Site using Page Breeze

15/18

ICTL For Secondary School - WebsiteModule

3. Repeat step 2 to complete another hyperlink forstudent and about.

* The above diagram shows the completed hyperlink process.

4. Double click teacher.htm and highlight Home.

13

7/29/2019 Module - Creating Web Site using Page Breeze

16/18

ICTL For Secondary School - WebsiteModule

5. Click Insert from the Menu Barthen choose Hyperlink. In the hyperlink dialogbox choose index.htm file and click OK.

6. Double click student.htm and highlight Home.

14

7/29/2019 Module - Creating Web Site using Page Breeze

17/18

ICTL For Secondary School - WebsiteModule

7. Click Insert from the Menu Barthen choose Hyperlink. In the hyperlink dialogbox choose index.htm file and click OK.

8. Double click about.htm and highlight Home.

15

7/29/2019 Module - Creating Web Site using Page Breeze

18/18

ICTL For Secondary School - WebsiteModule

9. Click Insert from the Menu Barthen choose Hyperlink. In the hyperlink dialogbox choose index.htm file and click OK.

10. Save and exit your project

16