รายวิชา การสร างเว็บไซต เบื้องต น...

ก

รายวชา การสรางเวบไซตเบองตน รหสวชา ง20226

ครผสอน ครแววดาว แสนศร วทยฐานะครชานาญการ

โรงเรยนเตรยมอดมศกษานอมเกลา กบนทรบร

คมอการใชบทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML สาหรบนกเรยน

ชนมธยมศกษาปท 3 เปนสอการสอนทตอบสนองผเรยนตามความพรอมในการศกษา ผเรยนมอสระ

ในการเลอกเรยนเวลาใดกได สามารถทบทวนบทเรยนไดทกเวลา เรยนรตามความถนดและความสามารถ

ของตนเอง ผเรยนมการโตตอบปฏสมพนธกบคอมพวเตอรและไดรบการเสรมแรงจากการไดรบขอมลยอนกลบ

และสามารถทราบผลสมฤทธทางการเรยนไดทนท เปนการเสรมแรงผเรยน นอกจากน ครมเวลามากขนใน

การแนะนาชวยเหลอผเรยนทเรยนออนกวา และดแลใหความรเพมเตมกบผเรยนทเรยนรไดเรว ประหยดเวลา

และงบประมาณในการจดการเรยนการสอน และสามารถใชจดกจกรรมการเรยนการสอนในกรณทขาดแคลน

ครผสอน

คมอการใชบทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML สาหรบนกเรยนระดบชน

มธยมศกษาปท 3 ผจดทาไดพฒนาขน โดยมจดมงหมายเพอใชประกอบการเรยนการสอนในรายวชาการสราง

เวบไซตเบองตน รหสวชา ง20226 กลมสาระการเรยนรการงานอาชพและเทคโนโลย(คอมพวเตอร) ซงผเรยน

สามารถเรยนรไดดวยตนเอง

ผจดทาหวงเปนอยางยงวา คมอการใชบทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML

สาหรบนกเรยนชนมธยมศกษาปท 3 เลมนจะเปนประโยชนตอสถานศกษา ครผสอนและนกเรยน ใชเปนสอใน

การจดกจกรรมการเรยนร เพอพฒนาผลสมฤทธทางการเรยนทดและมประสทธภาพมากยงขน

แววดาว แสนศร

คานา

ข




คมอการใชบทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML สาหรบนกเรยน

ชนมธยมศกษาปท 3 ไดจดทาขนเพอใชประกอบการจดการเรยนร รายวชา การสรางเวบไซตเบองตน รหส

วชา ง20226 กลมสาระการเรยนรการงานอาชพและเทคโนโลย(คอมพวเตอร) โดยมแนวทางในการจดกจกรรม

การเรยนการสอนทมงเนนใหผเรยนเกดความร มทกษะกระบวนการในการทางาน และสงเสรมดานคณธรรม

จรยธรรม ประกอบดวยเนอหา 8 บทเรยน ดงน

บทท 1 เรอง ความรเบองตนเกยวกบอนเทอรเนต

บทท 2 เรอง โครงสรางและรปแบบภาษา HTML

บทท 3 เรอง การจดการขอความ

บทท 4 เรอง การตกแตงขอความ

บทท 5 เรอง การจดการรปภาพและการแสดงลาดบรายการ

บทท 6 เรอง การสรางตาราง

บทท 7 เรอง การเชอมโยงหนาเวบเพจ

บทท 8 เรอง การสรางเฟรม

การจดแบงเนอหาของบทเรยน ไดพจารณาจดแบงตามการวเคราะหลาดบของเนอหาการจด

กจกรรมการเรยนการสอน มขนตอนดงน

1. เขาสบทเรยน

2. แบบทดสอบกอนเรยน

3. เนอหาบทเรยน

4. แบบฝกทกษะ

5. ใบงาน

6. แบบทดสอบหลงเรยน

โดยการนาเสนอเนอหาเปนขอความ ภาพนง วดทศน นกเรยนสามารถควบคมบทเรยนไดดวย

ตนเองตลอดการใชงาน ผานเวบไซต www.kruwaewdaow.com ทาใหผเรยนมสวนรวมในการเรยนและ

สามารถศกษาทาความเขาใจบทเรยนไดดยงขน

คาชแจง

ค




หนา

คานา .............................................................................................................................................. ก

คาชแจง .......................................................................................................................................... ข

สารบญ ........................................................................................................................................... ค

อปกรณและโปรแกรมทจาเปนสาหรบการใชบทเรยน E-learning ................................................ ง

ขนตอนการเขาใชบทเรยน E-learning ………………………………………………………………………………. 1

การเขาสบทเรยน ....................................................................................................... 2

แบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน ...................................................... 4

บทท 1 ความรเบองตนเกยวกบอนเทอรเนต .............................................................. 11

เนอหาการเรยนร ........................................................................................ 11

แบบฝกทกษะท 1 ....................................................................................... 12

แบบฝกทกษะท 2 ....................................................................................... 16

แบบฝกทกษะท 3 ....................................................................................... 19

แบบฝกทกษะท 4 ....................................................................................... 22

แบบทดสอบหลงเรยนบทท 1 ..................................................................... 24

การออกจากบทเรยน ..................................................................................28

บรรณานกรม .............................................................................................................. 29

ภาคผนวก ................................................................................................................... 31

เฉลยแบบทดสอบกอนเรยนบทท 1............................................................. 32

ประวตผจดทา ............................................................................................ 34

สารบญ

ง




บทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML สาหรบนกเรยน

ชนมธยมศกษาปท 3 จดทาเปนสอออนไลน โดยมชอเวบไซต “www.kruwaewdaow.com” ในการ

จดการเรยนการสอน ตองเรยนโดยใชคอมพวเตอร ทสามารถเชอมสญญาณเครอขายอนเทอรเนต

โดยเครองคอมพวเตอรตองมคณสมบตขนตาดงน

เครองคอมพวเตอรตงแตรน Celeron 1.0 GHz ขนไป พรอมสามารถเชอมตอ

สญญาณเครอขายอนเทอรเนตได

หนวยความจา 512 MB ขนไป

ฮารดดสก 40 GB หรอสงกวา

การดแสดงผล (VGA) 8 MB

จอภาพสขนาด 15 นวขนไป

เมาส

แปมพมพ

ลาโพงหรอชดหฟง

ตดตงระบบปฏบตการ Windows XP ขนไป

ตดตงโปรแกรมเวบบราวเซอร Mozilla Firefox

ตดตงโปรแกรมเพออานไฟลประเภท .PDF

อปกรณและโปรแกรมทจาเปนสาหรบการใชบทเรยน E-learning

ฮารดแวร

ซอฟตแวร

1


ครผสอน ครแววดาว แสนศร วทยฐานะครชานาญการโรงเรยนเตรยมอดมศกษานอมเกลา กบนทรบร

บทเรยน E-learning เรองการสรางเวบไซตดวยภาษา HTML สาหรบนกเรยนระดบชนมธยมศกษาปท 3 จดทาขนเพอใชในการจดกจกรรมการเรยนการสอนในรายวชา การสรางเวบไซตเบองตน รหสวชา ง20226 กลมสาระการเรยนรการงานอาชพและเทคโนโลย โรงเรยนเตรยมอดมศกษานอมเกลา กบนทรบร จงหวดปราจนบร สงกดองคการบรหารสวนจงหวดปราจนบร มทงหมด 8 บทเรยน วธการเรยนใหนกเรยนปฏบตดงน

1. สารวจดภาพรวม เมนตางๆของบทเรยน E-learning 2. กรอกชอผใช และรหสผาน เพอเขาใชบทเรยน E-learning 3. ทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน จานวน 40 ขอ 4. เรมเรยนตงแตบทท 1 โดยเรมจากการทาแบบทดสอบกอนเรยนบทท 1 5. คลกดจดประสงคการเรยนรบทท 1เพอใหทราบวาเมอนกเรยน เรยนจบจะสามารถทาอะไรไดบาง 6. คลกดเนอหาและศกษาบทเรยนในแตละเรองพรอมทงดวดทศนประกอบการเรยน 7. เมอศกษาเนอหาจบแลว ใหนกเรยนทาแบบฝกทกษะ และใบงานสงคร ในบทท 1 8. เมอศกษาครบถวนแลว ใหทาแบบทดสอบหลงเรยนในบทท 1 9. ศกษาบทท 2, บทท 3, บทท 4, บทท 5, บทท 6, บทท 7 และบทท 8 ตามลาดบ 10. ขนตอนการศกษาในแตละบท จะเหมอนกบบทท 1 11. เมอศกษาจดประสงคการเรยนร เนอหาการเรยนร และทาแบบฝกทกษะ พรอมทงใบงานสงครครบ

แลว ใหนกเรยนทาแบบทดสอบวดผลสมฤทธทางการเรยนหลงเรยน จานวน 40 ขอ

ขนตอนการเขาใชบทเรยน E-learning

ขนตอนการเรยน

2



1. เขาเวบไซต www.kruwaewdaow.com

ภาพประกอบท 1 การเขาสบทเรยน E-learning

2. คลก Enter site | เขาสเวบไซต เพอเขาสบทเรยน E-learning 3. กรอกชอผใชและรหสผาน ใหนกเรยนใชเลขประจาตวนกเรยน 5 หลก และรหสผานทครแจง

ตวอยางทใช ชอผใช 00001 รหสผาน Tea-00001

ภาพประกอบท 2 การเขาสระบบ

4. คลกปมเขาสระบบ 5. เมอเขาสระบบแลวจะปรากฏชอผใชบนหนาจอ 6. คลกเลอกบทเรยน E-learning

การเขาสบทเรยน

3



ภาพประกอบท 3 การเลอกบทเรยน

7. เลอกบทเรยนทตองการศกษา ซงจะประกอบดวย 8 บทเรยน ดงรป

ภาพประกอบท 4 บทเรยนทง 8 บทเรยน

8. เมอนกเรยนคลกเลอกบทเรยน E-learning จะปรากฏหนาจอดงรป

ภาพประกอบท 5 การเขาสบทเรยน

9. เลอกศกษาคาอธบายรายวชา และผลการเรยนรจานวน 10 ขอ

4



1. ขนตอนตอไปใหนกเรยนทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน

ภาพประกอบท 6 การเลอกแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน

2. เมอนกเรยนคลกเลอก แบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน จะปรากฏหนาจอดงรป และอานคาชแจงใหเขาใจ

ภาพประกอบท 7 แสดงการคลกเลอกแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน

3. คลกปม

4. จะปรากฏหนาจอการยนยนจากระบบ “แบบทดสอบนมการจากดเวลาและสามารถทาได 1 ครง ทานกาลงจะเรมการทาแบบทดสอบครงใหม จะดาเนนการตอหรอไม” ใหปฏบตดงน 4.1 ถายงไมตองการทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน ใหคลกปม 4.2 ถาตองการทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน ใหคลกปม

ภาพประกอบท 8 การยนยนการทาแบบทดสอบ

การทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน

1

4.24.1

2

3

5



5. แบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน มจานวน 40 ขอ ใหนาเมาสไปคลกทหนาวงกลมตวเลอก a,b,c หรอ d โดยขอสอบจะมการสลบขอ สลบตวเลอกทกครงเมอมการทาแบบทดสอบ

6. เมอทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน เสรจเรยบรอย คลกปม

ภาพประกอบท 9 แบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน

7. ระบบจะแจงสถานะของการทาแบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยน ใหปฏบตดงน 7.1 ถาสถานะคาตอบแตละขอมขอใดขอหนงแสดงคาวา “Not yet answered” แสดงวาทา

แบบทดสอบวดผลสมฤทธทางการเรยนกอนเรยนไมครบ ใหคลกทปม 7.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบทดสอบวดผลสมฤทธ

ทางการเรยนกอนเรยนครบทกขอ ใหคลกทปม

6

5

6



ภาพประกอบท 10 ระบบแจงสถานะทาแบบทดสอบ

8. ระบบจะแจงการยนยน “คณกาลงจะออกจากการทาแบบทดสอบ หากออกจากการทาแบบทดสอบแลวคณจะไมสามารถเปลยนแปลงคาตอบได” ใหปฏบตดงน

8.1 ถาตองการกลบไปแกไขคาตอบใหคลกทปม

8.2 ถาตองการสงคาตอบใหคลกทปม

ภาพประกอบท 11 ระบบแจงการยนยนการสงแบบทดสอบ

9. เมอคลก ระบบจะยงไมมการเฉลยแบบทดสอบเนองจากเปนการทดสอบกอนเรยน การเฉลยแบบทดสอบจะไปเฉลยในสวนของการทาแบบทดสอบหลง

เรยน ระบบจะแจงคะแนนทได จากนนใหคลกทปม เพอกลบไปสขนตอน การเรยนในบทเรยนตอไป

7.1

7.2

8.2

8.1

7



ภาพประกอบท 12 ระบบแสดงคะแนนแบบทดสอบ

ขนตอนในการศกษาเนอหาในบทท 1 มขนตอนในการปฏบตกจกรรมการเรยนรตามลาดบขนตอนดงน

1. ศกษาจดประสงคการเรยนร 2. ทาแบบทดสอบกอนเรยน 3. ศกษาเนอหาการเรยนร 4. ทาแบบฝกทกษะ 5. ทาแบบทดสอบหลงเรยน

ภาพประกอบท 1.1 แสดงรายละเอยดบทท 1

9

บทท 1 ความรเบองตนเกยวกบอนเทอรเนต

8



1. ใหนกเรยนคลกเลอกจดประสงคการเรยนร ระบบจะใหดาวนโหลดไฟลจดประสงคการเรยนร เพอใหนกเรยนทราบวาเมอเรยนจบแลว นกเรยนจะตองไดรบความร และสามารถปฏบตอะไรไดบาง

ภาพประกอบท 1.2 การศกษาจดประสงคการเรยนร

2. คลกเลอกทาแบบทดสอบกอนเรยน

ภาพประกอบท 1.3 การเลอกแบบทดสอบกอนเรยนบทท 1

3. เมอนกเรยนคลกเลอก แบบทดสอบกอนเรยนบทท 1 จะปรากฏหนาจอดงรป และอานคาชแจงใหเขาใจ

ภาพประกอบท 1.4 แบบทดสอบกอนเรยนบทท 1

9



4. คลกปม 5. จะปรากฏหนาจอการยนยนจากระบบ “แบบทดสอบนมการจากดเวลาและสามารถทาได 1 ครง

ทานกาลงจะเรมการทาแบบทดสอบครงใหม จะดาเนนการตอหรอไม” ใหปฏบตดงน

5.1 ถายงไมตองการทาแบบทดสอบกอนเรยนบทท 1 ใหคลกปม

5.2 ถาตองการทาแบบทดสอบกอนเรยนบทท 1 ใหคลกปม

ภาพประกอบท 1.5 การยนยนการทาแบบทดสอบ

6. แบบทดสอบกอนเรยนบทท 1 มจานวน 10 ขอ ใหนาเมาสไปคลกทหนาวงกลมตวเลอก a,b,c หรอ d โดยขอสอบจะมการสลบขอ สลบตวเลอกทกครงเมอมการทาแบบทดสอบ

7. เมอทาแบบทดสอบกอนเรยนบทท 1 เสรจเรยบรอย คลกปม

ภาพประกอบท 1.6 แบบทดสอบกอนเรยน

8. ระบบจะแจงสถานะของการทาแบบทดสอบกอนเรยนบทท 1 ใหปฏบตดงน 8.1 ถาสถานะคาตอบแตละขอมขอใดขอหนงแสดงคาวา “Not yet answered” แสดงวาทา

แบบทดสอบกอนเรยนบทท 1 ไมครบ ใหคลกทปม

5.2 5.1

10



8.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบทดสอบกอนเรยน

บทท 1 ครบทกขอ ใหคลกทปม

ภาพประกอบท 1.7 ระบบแจงสถานะการทาแบบทดสอบ




ภาพประกอบท 1.8 ระบบแจงการยนยนการสงแบบทดสอบบทท 1

10. เมอคลก ระบบจะยงไมมการเฉลยแบบทดสอบเนองจากเปนการทดสอบกอนเรยน การเฉลยแบบทดสอบจะไปเฉลยในสวนของการทาแบบทดสอบ

8

8.1

8.2

9.2

9.1

11



หลงเรยน ระบบจะแจงคะแนนทได จากนนใหคลกทปม เพอกลบไปสขนตอนการเรยนในบทเรยนตอไป

ภาพประกอบท 1.9 ระบบแสดงคะแนน และกลบสบทเรยน

1. ใหนกเรยนคลกเลอกเพอศกษาเนอหาการเรยนรแตละเรองยอยในบทเรยนนทงหมดตามลาดบ

ภาพประกอบท 1.10 การเลอกศกษาเนอหาบทท 1

2. คลกเลอกบทเรยนเรองความรเบองตนเกยวกบอนเทอรเนต เวบบราวเซอรจะเปดไฟลเอกสารทเลอกขนมา หากนกเรยนตองการพมพเอกสารไวทบทวนใหคลกเลอกทรปเครองพมพ

เนอหาการเรยนร

12



ภาพประกอบท 1.11 ศกษาเนอหาบทเรยน

3. หากนกเรยนยงไมตองการพมพเอกสารแตตองการบนทกไฟลไวในเครองคอมพวเตอร กสามารถ ทาไดโดยการคลกเลอกทรปแผนดสก

4. จะปรากฏหนาตางใหทาการบนทกไฟลเอกสาร ดงรป

ภาพประกอบท 1.12 การบนทกเอกสารบทเรยน

1. เมอนกเรยนศกษาใบความรครบถวนแลว ใหนกเรยนคลกเลอกแบบฝกทกษะ ในทนเลอก แบบฝกทกษะท 1

ภาพประกอบท 1.13 การเลอกทาแบบฝกทกษะ

23

แบบฝกทกษะท 1 คาศพทพนฐานเกยวกบเวบเพจ

13



2. คลกเลอกแบบฝกทกษะท 1 อานคาชแจงของการทาแบบฝกทกษะใหเขาใจและ คลกปม

เพอเรมทาแบบฝกทกษะท 1

ภาพประกอบท 1.14 การเลอกแบบฝกทกษะท 1

3. จะปรากฏหนาจอการยนยนจากระบบ ถานกเรยนตองการทาแบบทดสอบเลอกทปม

ถาไมตองการเลอกทปม

ภาพประกอบท 1.15 การยนยนการทาแบบฝกทกษะท 1

4. แบบฝกทกษะท 1 เปนแบบฝกทกษะ แบบจบค มจานวน 10 ขอ ใหพจารณาขอความทม

ความสมพนธกน โดยพจารณาขอความดานซายมอ และคลกเลอกคาตอบในชอง ดานขวามอทมความสมพนธกน

ภาพประกอบท 1.16 แบบฝกทกษะท 1

4

5

2

14



5. เมอนกเรยนทาแบบฝกทกษะท 1 เรยบรอยแลวใหคลกปม 6. ระบบจะแจงสถานะของการทาแบบฝกทกษะท 1 ใหปฏบตดงน

6.1 ถาสถานะคาตอบแตละขอมขอใดขอหนงแสดงคาวา “Not yet answered” แสดงวาทา

แบบฝกทกษะท 1 ไมครบ ใหคลกทปม 6.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบฝกทกษะท 1 ครบทก

ขอ ใหคลกทปม

ภาพประกอบท 1.17 การยนยนการทาแบบฝกทกษะท 1




ภาพประกอบท 1.18 การยนยนการสงแบบฝกทกษะท 1

6.1

6.2

7.1

7.2

15



8. หลงจากนนระบบจะแสดงเฉลยแบบฝกทกษะพรอมคะแนนทนกเรยนทาได ใหคลกเลอก Finish review ดงรป

ภาพประกอบท 1.19 แสดงคะแนน และเฉลยแบบฝกทกษะท 1

9. เมอคลกท Finish review จะปรากฏหนาจอ สรปคะแนนในการทาแบบทดสอบ

ใหคลกเลอก เพอกลบไปยงบทเรยน

ภาพประกอบท 1.20 สรปคะแนน และกลบไปยงบทเรยน

16



1. แบบฝกทกษะท 2 เปนแบบฝกทกษะแบบถกผด ใหนกเรยนอานคาชแจงใหเขาใจ แลวคลกทปม

ดงรป

ภาพประกอบท 1.21 เลอกแบบฝกทกษะท 2



ภาพประกอบท 1.22 การยนยนจากระบบ

แบบฝกทกษะท 2 ความรเบองตนเกยวกบอนเทอรเนต

17



3. ทาแบบฝกทกษะเรยบรอยแลวใหคลกทปม ดงรป


4. ระบบจะแจงสถานะของการทาแบบฝกทกษะท 2 ใหปฏบตดงน 4.1 ถาสถานะคาตอบแตละขอมขอใดขอหนงแสดงคาวา “Not yet answered” แสดงวาทา

แบบฝกทกษะท 2 ไมครบ ใหคลกทปม 4.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบฝกทกษะท 2 ครบ

ทกขอ ใหคลกทปม

ภาพประกอบท 1.24 สถานะขอสอบ

4.1

4.2

18








ภาพประกอบท 1.26 แสดงคะแนนพรอมเฉลย

7. และเมอคลกท Finish review จะปรากฏหนาจอ สรปคะแนนในการทาแบบทดสอบ



5.1

5.2

19



1. แบบฝกทกษะท 3 เปนแบบฝกทกษะแบบเขยนตอบ ใหนกเรยนอานคาชแจงใหเขาใจ

แลวคลกทปม ดงรป







แบบฝกทกษะท 3 โปรแกรมเวบบราวเซอร

20




แบบฝกทกษะท 3 ไมครบ ใหคลกทปม 4.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบฝกทกษะท 3

ครบทกขอ ใหคลกทปม






5.1

5.2

4.1

4.2

21








22



1. แบบฝกทกษะท 4 เปนแบบฝกทกษะแบบเขยนตอบ ใหนกเรยนอานคาชแจงใหเขาใจ แลวคลกท

ปม ดงรป


2. จะปรากฏหนาจอการยนยนจากระบบ ถานกเรยนตองการทาแบบฝกทกษะท 4 เลอกทปม





แบบฝกทกษะท 4 โดเมนเนม

23




แบบฝกทกษะท 4 ไมครบ ใหคลกทปม 4.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบฝกทกษะท 4 ครบ






ภาพประกอบท 1.39 การยนยนการสงแบบทดสอบ

6. หลงจากนนระบบจะแสดงเฉลยแบบฝกทกษะท 4 พรอมคะแนนทนกเรยนทาได ใหคลกเลอก Finish review ดงรป


5.1

5.2

4.1

4.2

24






1. คลกเลอกทาแบบทดสอบหลงเรยน

ภาพประกอบท 1.42 แบบทดสอบหลงเรยนบทท 1

2. เมอนกเรยนคลกเลอก แบบทดสอบหลงเรยน จะปรากฏหนาจอดงรป และอานคาชแจงใหเขาใจ

ภาพประกอบท 1.43 แบบทดสอบหลงเรยน

3. คลกปม

แบบทดสอบหลงเรยน บทเรยนท 1

25



4. จะปรากฏหนาจอการยนยนจากระบบ “แบบทดสอบนมการจากดเวลาและสามารถทาได 1 ครง ทานกาลงจะเรมการทาแบบทดสอบครงใหม จะดาเนนการตอหรอไม” ใหปฏบตดงน

4.1 ถายงไมตองการทาแบบทดสอบหลงเรยน ใหคลกปม

4.2 ถาตองการทาแบบทดสอบหลงเรยน ใหคลกปม

ภาพประกอบท 1.44 การยนยนการทาแบบทดสอบ

5. แบบทดสอบหลงเรยน มจานวน 10 ขอ ใหนาเมาสไปคลกทหนาวงกลมตวเลอก a,b,c หรอ d โดยขอสอบจะมการสลบขอสลบตวเลอกทกครงเมอมการทาแบบทดสอบ

6. เมอทาแบบทดสอบหลงเรยน เสรจเรยบรอย คลกปม

ภาพประกอบท 1.45 แบบทดสอบหลงเรยน

7. ระบบจะแจงสถานะของการทาแบบทดสอบหลงเรยน ใหปฏบตดงน 7.1 ถาสถานะคาตอบแตละขอมขอใดขอหนงแสดงคาวา “Not yet answered” แสดงวาทา

แบบทดสอบหลงเรยนไมครบ ใหคลกทปม 7.2 ถาสถานะคาตอบทกขอแสดงคาวา “Answer saved” แสดงวาทาแบบทดสอบหลงเรยนครบ


4.2 4.1

26



ภาพประกอบท 1.46 ระบบแจงสถานะทาแบบทดสอบ




ภาพประกอบท 1.47 ระบบแจงการยนยนการสงแบบบทสอบ


ภาพประกอบท 1.48 ระบบแจงคะแนนสอบ พรอมเฉลย

7

7.1

7.2

8.2

8.1

27



10. เมอคลก ระบบจะมการเฉลยแบบทดสอบเนองจากเปนการทดสอบหลง

เรยน จากนนใหคลกทปม เพอกลบไปสขนตอนการเรยนในบทเรยนตอไป

ภาพประกอบท 1.49 ระบบสรปคะแนน และกลบสบทเรยน

28



1. การออกจากบทเรยนใหคลกทเมน “หนาหลก”

ภาพประกอบท 1.50 แสดงการเลอกหนาหลก

2. คลก “ออกจากระบบ”

ภาพประกอบท 1.51 แสดงการเลอกเมนออกจากระบบ

การออกจากบทเรยน

29



กตต ภกดวฒนะกล. (2540). สราง Web แบบมออาชพดวย HTML. กรงเทพฯ: หจก.ไทยเจรญ การพมพ. ณชตพงศ อทอง. (2551). การสรางเวบเพจ(ภาษา HTML). นนทบร: เอมพนธ. บญสอ โพธศร และคณะ. (2548). การโปรแกรมเวบ 1. กรงเทพฯ: ศนยสงเสรมอาชวะ. บญวฒน ชนอนภาพ. (2540). สรปคาสง HTML ฉบบคนหาฉบไว. กรงเทพฯ: เฟรสท แปซฟก มเดย. ประชา พฤกษประเสรฐ. (2553). สรางเวบและเพมลกเลนดวย HTML&XHTML. กรงเทพฯ: ซมพลฟาย. . (2554). การสรางเวบเพจดวย HTML. กรงเทพฯ: ซคเซสมเดย. ภชงค จนทรเปลง. (2551). การเขยนเวบไซตดวยภาษา HTML. ปทมธาน: มเดย อนเทลลเจนซ เทคโนโลย. ภญญ กาเนดหลม. (2546). เขยนเวบเพจ ดวย HTML. กรงเทพฯ: 3495 บคเซนเตอร. สถาบนสงเสรมการสอนวทยาศาสตรและเทคโนโลย. มาโนต กลมประทม. (2542). เทคนคการใช HTML. กรงเทพฯ: เอนไซโคลกราฟ. วนชย แซเตย และคณะ. (2542). สรางเวบเพจดวย HTML 4. กรงเทพฯ: ซอฟตเพรส. ศรญน ไมตรเวช. (2540). ครบเครองเรองอนเตอรเนต. กรงเทพฯ: โปรวชน. อนทเกรดเพรส. (2541). The Adventure in HTML. กรงเทพฯ: อนทเกรดเพรส. Jon Duckett. (2011). HTML&CSS design and build websites. Indiana: Johb Wiley & Sons. Elisabelt Freeman & Eric Freeman. (2005). Head First HTML with CSS&XHTML. America: O’Reilly Media. ธานนทร คงศลา. (2555). การสรางโฮมเพจดวยภาษา HTML. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน, https://pirun.ku.ac.th/~agrtnk/web/units/unit1/unit1-4.htm azadious. (2553). ฮลโล มายเวบ เวบไซต ใครกทาได. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน, http://www.hellomyweb.com/index.php/main/tutorial/2/12]

บรรณานกรม

30



อนงค หลอดแกว. (2555). การเขยนเวบดวยภาษา HTML. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน, https://sites.google.com/site/class0223/learnhtml Sorasak Sattayanuwat. (2554). การสรางเวบเพจดวยภาษา HTML. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน , http://www.yupparaj.ac.th/CAI/create_web/htm1.htmนพดล มสกปาน. (2550). การเขยนเวบเพจดวยภาษา HTML. สบคนเมอ 2 พฤศจกายน 2556, ขอมลออนไลน, http://www.bankaeng.ac.th/k.npd/home.htm รชนพร ภแสงส. (2556). การสรางเวบดวยภาษา HTML อยางงายๆ. สบคนเมอ 2 พฤศจกายน 2556, ขอมลออนไลน, http://www.slideshare.net/rphusangsi/html-16746113 Patcharin parsi. (2553). การสรางเวบเพจ. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน, http://patch-patcharin.blogspot.com/2010/08/3-html.html mojanemj. (2556). การแทนชอทอยของอนเตอรเนต. สบคนเมอ 22 ตลาคม 2556, ขอมลออนไลน, https://mojanemj.wordpress.com/2013/12/25/

31



ภาคผนวก

32



1. ขอใดคอประโยชนของอนเทอรเนต ก. ใหความบนเทง เชน เกมส ดหนง ฟงเพลง ข. ใชสาหรบประชาสมพนธสนคา ค. เปนชองทางสาหรบทาธรกจ เชน E-Commerce ง. ถกทกขอ

2. ขอใดหมายถงเอกสารขอมลตางๆในแตละหนาซงอาจประกอบไดดวยขอความตางๆ รปภาพ ก. เวบเพจ (Web Page) ข. โฮมเพจ (Home Page) ค. เวบไซต (Web Site) ง. เวบบราวเซอร (Web Browser)

3. ขอใดหมายถงกลมของหนาเวบเพจทสรางไวเพอนาเสนอขอมลรวมกน ก. เวบเพจ (Web Page) ข. โฮมเพจ (Home Page) ค. เวบไซต (Web Site) ง. เวบบราวเซอร (Web Browser)

4. ขอใดบอกความหมายของ “Domain name” ไดถกตองทสด ก. เปนเครองมอหรอโปรแกรมทใชคนหาเวบตางๆ ข. คอการสงขอมลจากเครองของเราไปยงเครองอน ค. เปนชอทถกตงขนใชเรยกแทนหมายเลขไอพ ง. เปนเครองคอมพวเตอรททาหนาทใหบรการขอมล

5. ชอโดเมนระดบท 1 ทใช .gov นนหมายถงองคกรในขอใด ก. หนวยงานของรฐบาล ข. หนวยงานเอกชน ค. หนวยงานทางดานทหาร ง. หนวยงานทางการศกษา

แบบทดสอบกอน-หลงเรยน บทท 1

33



6. ชอโดเมนระดบท 1 ทใช .com นนหมายถงองคกรในขอใด ก. หนวยงานของรฐบาล ข. หนวยงานเอกชน ค. หนวยงานทางดานทหาร ง. หนวยงานทางการศกษา

7. ชอโดเมนระดบท 1 ทใช .mil นนหมายถงองคกรในขอใด ก. หนวยงานของรฐบาล ข. หนวยงานเอกชน ค. หนวยงานทางดานทหาร ง. หนวยงานทางการศกษา

8. ชอโดเมนระดบท 2 ในประเทศไทย ทใช ac. นนหมายถงองคกรในขอใด ก. หนวยงานของรฐบาล ข. หนวยงานเอกชน ค. หนวยงานทางดานทหาร ง. หนวยงานทางการศกษา

9. โปรแกรมทใชในการสรางเวบเพจแบงออกเปนกประเภท ก. 1 ประเภท ข. 2 ประเภท ค. 3 ประเภท ง. 4 ประเภท

10. ขอใดไมใชโปรแกรมประเภท Web Editor ก. Notepad ข. Microsoft FrontPage ค. Nomo Web Editor ง. Dreamweaver

34



ชอ – สกล นางแววดาว แสนศร ตาแหนง คร วทยฐานะ ครชานาญการ วน เดอน ปเกด วนท 2 เดอนพฤษภาคม พทธศกราช 2522 สถานทเกด อาเภอเมอง จงหวดสระแกว

สถานทอยปจจบน บานเลขท 99/326 ตาบลหนองก อาเภอกบนทรบร จงหวดปราจนบร

พ.ศ. 2547 – พ.ศ. 2549 คร โรงเรยนกนเกราพทยาคม สงกดสานกงานเขตพนทการศกษานครราชสมา เขต 1 พ.ศ. 2549 – ปจจบน คร โรงเรยนเตรยมอดมศกษานอมเกลา กบนทรบร สงกดองคการบรหารสวนจงหวดปราจนบร พ.ศ. 2545 วทยาศาสตรบณฑต (สาขาวชาวทยาการคอมพวเตอร) สถาบนราชภฎนครราชสมา พ.ศ. 2549 ประกาศนยบตรวชาชพคร มหาวทยาลยมหาจฬาลงกรณราชวทยาลย วทยาเขตนครราชสมา

ตาแหนงและประวตการทางาน

ประวตการศกษา

ประวตผจดทา

รายวิชา การสร างเว็บไซต เบื้องต น...

Documents

Transcript of รายวิชา การสร างเว็บไซต เบื้องต น...