คมอประกอบการสรางเวบไซต

โดยโปรแกรม Microsoft PowerPoint

สตว

ปา

สงวน

จดท าโดย

นาย กตกร แสวงหา 53010516033

นาย เนตรฐ ธรรมประชา 53010516042

นาย นพพร ภศรพงษ 53010516039

นาย คร เสมอภาค 53010516006

นางสาวจราพร พรหมล 53010520007

ชนปท 1 คณะศกษาศาสตร

สาขา เทคโนโลยและสอสารการศกษา

มหาวทยาลยมหาสารคาม

ค าน า

คมอนจดท าขนเพอประกอบการเรยนการสอนเกยวกบการสรางเวบไซต

ดวยโปรแกรม Microsoft PowerPoint ซงเปนการเรยนรการใชโปรแกรมในดานอนๆ ท

นอกเหนอจากการพมพงานปกต นอกจากนนคณะผจดท ายงไดท าการสรางเวบไ ซตทใหความร

เกยวกบสตวปาสงวน ดงนนคณะผจดท าจงไดจดท าคมอเกยวกบการสรางเวบไซตนเพอใหผ

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

สารบญ

เรอง หนา

วางโครงสราง 1

การสรางเวบไซตดวยโปรแกรม Microsoft PowerPoint 2

การใสพนหลง ( Background) และลกษณะพเศษในเวบเพจ 3

การตกแตงเนอหา ( Content) ในเวบเพจ 5

การสรางไฮเปอรลงค ( Hyperlink) 7

การลงคไปยงเวบเพจอน 8

การบนทกเวบเพจ 9

วางโครงสราง

1. ก าหนดเรองของเวบไซต

ก าหนดสวนประกอบหลกของเวบ ประกอบไปดวย 2.1 สวนของ Title 2.2 สวนเมน ประกอบไปดวย 2.2.1 ควายปา 2.2.2 แรด 2.2.3 นกเจาฟาหญงสรธร 2.2.4 กวางผา 2.2.5 กระซ 2.2.6 กรปร 2.2.7 เกงหมอ 2.2.8 นกแตวแลวทองด า 2.2.9 นกกระเรยน 2.2.10 เนอสมน 2.2.11 แมวลายหนออน

2.2.12 พะยน 2.2.13 สมเสรจ 2.2.14 ละมง 2.2.15 เลยงผา 2.2.16 ความหมาย 2.2.17 เอกสารอางอง 2.2.18 รายชอสมาชก

2.3 สวนของเนอหา 3.ก าหนดรปแบบของการเชอมโยง

1

การสรางเวบไซตดวยโปรแกรม Microsoft PowerPoint การสรางเวบไซตกคอ การสรางเอกสารส าหรบแสดงผลบนอนเทอรเนตหรอเวบบราวเซอรโดยใช

มาตรฐาน HTML ซงผสรางจะตองมความรและเขาใจโครงสรางภาษา HTML พอสมควรจงจะสรางได

ปจจบนไดมการพฒนาโปรแกรมส าเรจรปชวยในการสรางเวบเพจ เชน Dreamweaver และ

FrontPage เปนตน เพอชวยใหผพฒนาเวบออกแบบไดอยางสวยงามและรวดเรว โดยไมตองพมพค าสงภาษา

HTML หากแตใชกราฟกเขามาชวยออกแบบ

อยางไรกตาม การสรางเวบเพจทงายอกวธหนง คอ การสรางดวยโปรแกรมไมโครซอฟตเวรด

ซงมวธการสราง ดงน

1. เปดไฟลใหม คลกค าสง แฟม > สราง

2. ใสขอความลงไปโดย คลกค าสง แทรก > กลองขอความ > วางบนพนทวางของสไลด

2

การใสพนหลง ( Background) และลกษณะพเศษในเวบเพจ

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

ดงน

1. ตกแตงไฟลงานใหสวยงาม เชน ตกแตงพนหลง โดยคลกทค าสง ออกแบบ => ลกษณะพนหลง

2. หากตองการเลอกสพนใหเลอกไดทนท

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

ก าหนดสผสมใชเอง เลอกสทตองการ เสรจแลวคลกตกลง

3

การเพมเตมลกษณะพเศษ และไลระดบส ใหคลกเลอกค าสง

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

2. เลอกพนผว คลกเลอกค าสง จดรปแบบพนหลง => การเตมรปภาพหรอพนผว

4

การตกแตงเนอหา ( Content) ในเวบเพจ

ขอความ ภาพ เปนสวนประกอบส าคญของเวบเพจ ซงมวธการท าดงน

1. การตกแตงตวอกษร (Font) ใน PowerPoint สามารถสรางตวอกษรไดหลากหลาย ตลอดจนสสน

ใหสวยงามไดงาย โดยทเมอน าไปแสดงบนบราวเซอรกจะมลกษณะเหมอนตนแบบทสรางอกษรประดษฐ

ตางๆ กสามารถน ามาประกอบเอกสารไดเชนกน

2. การแทรกภาพประกอบขอความ เราสามารถน าภาพมาใสไวในเวบเพจดวยค าสง

แทรก > รปภาพ ( Insert > Picture ) เมอไดภาพแลวสามารถปรบขนาด วางต าแหนง หมน และ

ปรบลกษณะภาพใหเหมาะสมกบขอความได ดงรป

5

6

การสรางไฮเปอรลงค ( Hyperlink)

ไฮเปอรลงค หมายถง การเชอมโยงเอกสารจากจดหนงไปยงอกจดหนง เรยกสนวา ลงค ( links )

ซงมหลายลกษณะ ทงการลงคภายในเวบเพจหนาเดยวกน ลงคระหวางหนาในเวบไซตเดยวกน และลงค

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

น าเสนอใหครบไดในหนาเดยว จงตองเชอมโยงเอกสารจากหนาหนงไปยงหนาอนๆ

ลงคอาจเปนตวอกษร ค า ขอความ ภาพ หรออนๆ โดยจะใชสแตกตางจากขอความปกตหรอมขด

เสนใตไว สามารถคลกเพอลงคไปยงต าแหนงทเชอมโยงไวทนท

การลงคประกอบดวย

1. ขอมลตนทาง ส าหรบผใชคลกเพอเชอมโยงไปยงขอมลอนๆ

2. ขอมลปลายทาง เปนหนาเวบเพจ หรอแหลงขอมลทสรางไวส าหรบแสดงผล

7

การลงคไปยงเวบเพจอน

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

ผอานคลกกจะไปยงเรองทตองการนนทนท

การสรางลงคไปยงเวบเพจอน มวธการท าดงน

1. สรางเวบเพจตนทางและปลายทาง

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

3. drag เมาสคลมชวงขอความหรอรปภาพทตองการ

4. คลก แทรก > การเชอมโยงหลายมต

5. จะปรากฏไดอะลอกบอกซ การเชอมโยงหลายมต ใหเลอกต าแหนงทตองการสราง link

8

การบนทกเวบเพจ

เมอสรางและตกแตงเวบเพจเสรจแลว จะตองบนทกไฟลใหเปนเอกสาร HTML ดงน

1. คลกทค าสง แฟม => บนทกเปน => การน าเสนอของ PowerPoint

2. จะไดหนาตางส าหรบบนทกเอกสาร ใหเลอกชนดของไฟลเปนแบบ Web Page โดย Word

จะแยกภาพหรอกราฟกไปไวเปนไฟลตางหาก ถาเลอกเปนแบบ Single File Web Page จะ

เปนการบนทกเวบทงหมดไวในไฟลเดยวกน

9

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

พมพชอเรองใหม แลวคลก ตกลง

4. ทดลองเปดไฟลดวยเบราวเซอร IE จะไดเวบเพจ ดงน

10