module creating website

34
KEMENTERIAN PELAJARAN MALAYSIA S S e e l l f f A A c c c c e e s s s s L L e e a a r r n n i i n n g g M M o o d d u u l l e e C C r r e e a a t t i i n n g g W We e b b s s i i t t e e I I PUSAT PERKEMBANGAN KURIKULUM KEMENTERIAN PELAJARAN MALAYSIA I C C C T T T L L L i i i t t t e e e r r r a a a c c c y y y f f f o o o r r r S S S e e e c c c o o o n n n d d d a a a r r r y y y S S S c c c h h h o o o o o o l l l P P P r r r o o o g g g r r r a a a m m m m m m e e e

Upload: ira-raji

Post on 22-Nov-2014

120 views

Category:

Internet


0 download

DESCRIPTION

creating website

TRANSCRIPT

Page 1: Module Creating Website

KKEEMMEENNTTEERRIIAANN PPEELLAAJJAARRAANN MMAALLAAYYSSIIAA

SSeellff AAcccceessss LLeeaarrnniinngg MMoodduullee

CCrreeaattiinngg WWeebbssiittee

II

PUSAT PERKEMBANGAN KURIKULUM KEMENTERIAN PELAJARAN MALAYSIA

ICCCTTT LLLiiittteeerrraaacccyyy fffooorrr SSSeeecccooonnndddaaarrryyy SSSccchhhoooooolll

PPPrrrooogggrrraaammmmmmeee

Page 2: Module Creating Website

ICTL for Secondary School - Website Module

MODULE 1

DEVELOP SCHOOL WEBSITE USING MICROSOFT WORD

Curriculum Development Centre Ministry of Education Malaysia

1

Page 3: Module Creating Website

ICTL for Secondary School - Website Module

1. Name of Module : Develop School Website

2. Learning Outcomes : The Students should be able to

a. Create 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 student should be able to produce web pages.

2

Page 4: Module Creating Website

ICTL for Secondary School - Website Module

Activity 1: Creating Main Page

1. Launch Microsoft Word . 2. Insert a picture of your school or clip art that related to school. 3. Type the title - ‘MY SCHOOL’ 4. Create a table and type the menu as shown below.

5. Design your page creatively. You may change font style and colour as you like

3

Page 5: Module Creating Website

ICTL for Secondary School - Website Module

Activity 2 : Saving a Web Page

1. Click File from Menu Bar, then choose Save as Web Page as shown below

Click Save as Web Page

2. Save As dialog box will appears.

3. Create a new folder to save your work. Click Create New Folder and name your new

folder as ‘my school’. Then click OK.

Click Create New Folder

4

Page 6: Module Creating Website

ICTL for Secondary School - Website Module

4. Type file name as index.htm in Save As dialog box.

5. In Save As Type drop down menu, select Web Page, then click Save.

5

Page 7: Module Creating Website

ICTL for Secondary School - Website Module

Activity 3: Creating Web Page

1. Click File from the Menu Bar, select New from drop down menu. 2. Choose web page from task panel 3. Type your school name as title. Example ‘SMK DATO’ AHMAD’. 4. Insert your school badge then type something interesting about your school. 5. You may see the example below. 6. Save your web page as school.htm.

7. Repeat Step 1 and step 2 to create new document. 8. Type a title – Example ‘THE WONDERFUL EDUCATORS OF SMK DATO’ AHMAD’. 9. Insert picture of your school teachers then type something interesting about your

teachers. 10. You may see the example below.

6

Page 8: Module Creating Website

ICTL for Secondary School - Website Module

11. Save your web page as teachers.htm. 12. Repeat Step 1 and step 2 to create new document. 13. Type a title – ‘MY WONDERFUL CLASSMATES’. 14. Insert picture of your friends, then type something interesting about your friends. 15. You may see the example below

16. Save your web page as friends.htm

7

Page 9: Module Creating Website

ICTL for Secondary School - Website Module

Activity 4 : Creating Hyperlink

1. Open index.htm file 2. Highlight the word My School.

3. Click Insert from the Menu Bar then choose Hyperlink

4. Insert Hyperlink dialog box appears. Follow the instruction below to create hyperlink.

i. Click Existing File or web Page

ii. Click Current Folder

iii. Select school.htm

iv. Click OK

8

Page 10: Module Creating Website

ICTL for Secondary School - Website Module

5. The hyperlink word will be underlined with blue font colour.

6. Repeat Step 1 – 4 to create another hyperlink. My Teachers link to teachers.htm My Friends link to friends.htm

7. When you are finish creating hyperlink index.htm page will appears as below.

8. Open school.htm file, then type ‘MAIN PAGE’ at the bottom of existing text. 9. Highlight the word ‘MAIN PAGE’ then create hyperlink to index.htm file.

9

Page 11: Module Creating Website

ICTL for Secondary School - Website Module

10. Repeat Step 7 and 8 to create hyperlink from teachers.htm and friends.htm to

index.htm file. 11. Save your entire web pages file.

Activity 5 : Previewing Web Page

1. From index.htm file, click File from the Menu Bar, then select Web Page Preview.

2. The web page will be previewed in default web browser.

3. Click the hyperlink text to preview another page.

4. Check all the hyperlink whether it shown the appropriate link.

5. Close all files and exit Microsoft Word application.

10

Page 12: Module Creating Website

ICTL for Secondary School - Website Module

MODULE 2

REGISTER WITH A FREE WEB SERVER

Curriculum Development Centre Ministry of Education Malaysia

11

Page 13: Module Creating Website

ICTL for Secondary School - Website Module

1. Name of Module : Register with a web server

2. Learning Outcomes : The Students should be able to

a. Choosing a web server to place the website

3. Knowledge and Skills a. Search for free web hosting

b. Choose Web hosting

c. Register account

4. Module Summary At the end of the module student should be able to register with free web

hosting

Activity 1: Register with a web server

1. Launch Internet Explorer, then type www.yahoo.com in the address bar.

www.yahoo.com

2. Type free web hosting in the Search bar, then click Web Search

12

Page 14: Module Creating Website

ICTL for Secondary School - Website Module

3. The search result will be displayed in the browser. Choose Yahoo GeoCities.

13

4. Click Sign Up Now to register a free web site

Page 15: Module Creating Website

ICTL for Secondary School - Website Module

5. Yahoo Geocities home page will be displayed. Click Sign Up to be a member of Yahoo Geocities

6. Fill in the form as shown below. The Yahoo ID will be your web page name.

14

Page 16: Module Creating Website

ICTL for Secondary School - Website Module

7. Follow the instruction given to complete the form. Click I Agree button to submit the complete form.

8. The error messages will be displayed if any entries are not correct. Fill in the entries again then click the button Submit This Form Securely.

15

Page 17: Module Creating Website

ICTL for Secondary School - Website Module

9. Once you have successfully registered your account, you will be directed to Yahoo Geocities page to verify the password. Type your password then click Sign In

10. The Yahoo Geocities welcome page will be displayed. Your free registered webpage is www.geocities.com/schoolsmkda.

16

Page 18: Module Creating Website

ICTL for Secondary School - Website Module

11. Before uploading web page you need to answer several questions given by GeoCities. Just click the option button to answer the question.

12. At the end of the form you will need to enter the code to verify the registration.

13. Retype the code, then click Submit button to get started using Yahoo Geocities. The Yahoo GeoCities welcome page will be displayed with information about registered ID and webpage url.

17

Page 19: Module Creating Website

ICTL for Secondary School - Website Module

14. Now you have finished register your webpage in YahooGeocities. Your homepage URL is http://www.geocities.com.schoolsmkda

15. If you click the shortcut to your homepage; it will direct you to your school main page.

16. Your main page will look as shown below. Continue next module to upload your school website files to registered web hosting.

17. Click Sign Out to log out from the control panel.

18

Page 20: Module Creating Website

ICTL for Secondary School - Website Module

MODULE 3

UPLOAD AND UPDATE WEBPAGES

Curriculum Development Centre Ministry of Education Malaysia

19

Page 21: Module Creating Website

ICTL for Secondary School - Website Module

1. Name of Module : Upload And Update Web Pages

2. Learning Outcomes: The Students should be able to

a. Uploading web pages to the free web hosting

3. Knowledge and Skills a. Sign in to Yahoo Geocities

b. Upload and organize file using File Manager Tools

c. Update web pages

4. Module Summary At the end of the module student should be able to upload files with free web hosting and

update web pages

Activity 1: Upload file using File Manager 1. Launch Internet Explorer, type www.geocities.com in address bar. Click Sign In when

Yahoo Geocities page appears.

20

Page 22: Module Creating Website

ICTL for Secondary School - Website Module

2. Type your registered Yahoo ID and password in the field, then click sign in. Your

homepage control panel will display.

21

Page 23: Module Creating Website

ICTL for Secondary School - Website Module

3. Click on the Manage tab to organize and upload file to Yahoo Geocities server. Click

on File Manager

22

4. Click Open File Manager

Page 24: Module Creating Website

ICTL for Secondary School - Website Module

5. File manager page will display. In this page you can upload all your website file you

created before. Click Upload File button to start upload file.

6. Easy Upload page will display. Click Browse to find the files you want to upload.

23

Page 25: Module Creating Website

ICTL for Secondary School - Website Module

7. Click Browse, Choose File dialog box appear, click index.htm file then click Open.

8. Repeat the step 7 to browse for friends.htm, teachers.htm and school.htm.

9. Click uploads files to upload all the selected files to Yahoo Geocities.

24

Page 26: Module Creating Website

ICTL for Secondary School - Website Module

10. The Upload Results will appear as shown below. Click on File Manager

11. The list of Uploaded Files will display in File Manager control panel page.

List of files that were successfully uploaded to File Manager

25

Page 27: Module Creating Website

ICTL for Secondary School - Website Module

12. Launch Internet Explorer and type your website URL in the address bar (ex:

http://www.geocities.com/smkdaschool). Your main page index.htm will display.

13. Notice that the image is not appear because we did not upload the image source file. Follow the next activity to create subdirectories in your File Manager for images.

26

Page 28: Module Creating Website

ICTL for Secondary School - Website Module

Activity 2: Create Subdirectories in File Manager

1. Click New button in Subdirectories menu.

2. Locate your web page folder in your hard disk. (ex: My School). It will look similar to the picture below. When you save a file as Web Page in Microsoft Word, the window will automatically create new folder to save the image. You need to create subdirectories with the same name in Yahoo geocities in order to upload the image.

27

Subdirectories Folder

Page 29: Module Creating Website

ICTL for Secondary School - Website Module

3. In Create Subdirectories control panel page. Type Subdirectory Name (ex:

friends_files) The name must be the same with subdirectories folder in your web page folder in hard disk. Then click Create Subdirectory button.

4. File Manager Control panel will display new subdirectory folder as shown below.

28

Page 30: Module Creating Website

ICTL for Secondary School - Website Module

5. Click New button to create another Subdirectory in File Manager. Repeat the step 3 to

create index_files, teachers_files and schools_files subdirectories.

6. File Manager control panel will display the created subdirectory folder as shown below.

7. Follow the next activity to upload image files into selected subdirectory.

29

Page 31: Module Creating Website

ICTL for Secondary School - Website Module

Activity 3: Upload Image Files to Subdirectory Folder

1. Click friends_files in File Manager.

2. Click Upload File button in the friends_files subdirectory.

3. Click browse button in Easy Upload control panel. When Choose File dialog box appears, browse for web page folder in hard disk, and click friends_files folder.

30

Page 32: Module Creating Website

ICTL for Secondary School - Website Module

4. Click browse button in Easy Upload control panel. In Choose File dialog box, browse for web page folder in hard disk, and click friends_files folder. Upload all image file in subdirectory folder in hard disk to the subdirectory folder in Yahoo Geocities.

5. Subdirectory of friends_files will look as shown below.

31

Page 33: Module Creating Website

ICTL for Secondary School - Website Module

6. Click Up one level hyperlink to go to file manager. Then repeat step 4 to upload all image files to their subdirectories folder respectively.

7. Launch Internet Explorer and type your website URL in the address bar (ex:

http://www.geocities.com/smkdaschool). Your main page index.htm will display.

8. Click the hyperlink in the main page to open the school page.

9. Repeat the step 8 to go to other hyperlink page.

32

Page 34: Module Creating Website

ICTL for Secondary School - Website Module

Activity 4: Browse and Update Webpage

1. Launch Microsoft Word.

2. Open file school.htm , add the text “ Vision : Towards excellence education“ in the

document as shown below.

3. Save the document

4. Follow the steps in Activity 1: Upload file using File Manager to upload updated

school.htm file.

33