1. คู่มือประกอบการสร้างเว็บไซต์
โดยโปรแกรม Microsoft PowerPoint
จัดทำาโดย
1.นายทวีศักดิ์ เข็มเพชร
53010520012
2.นายภาณุวิชญ์ แสนโกษา
53010520025
3.นายพิษณุพงษ์ สุรพงษ์พิวัฒนะ
53010516046
4.นายนันทวุธ อิมจิต
่
53010516041
5.นางสาวดารารัตน์ สมมาตย์
53010516009
ชันปีที่ 1 คณะศึกษาศาสตร์
้

2. สาขา เทคโนโลยีและสื่อสารการศึกษา
ก
มหาวิทยาลัยมหาสารคาม
คำานำ า
คู่มือนี้จัดทำำขึ้นเพ่ ือประกอบกำรเรียนกำรสอนเก่ียวกับกำรสร้ำง
เว็บไซต์ด้วยโปรแกรม Microsoft PowerPoint ซ่ ึงเป็ นกำรเรียนร้กำรใช้ ่
โปรแกรมในด้ำนอ่ ืนๆ ท่ีนอกเหนื อจำกกำรพิมพ์งำนปกติ นอกจำกนั ้นคณะ
ผ้่จัดทำำยังได้ทำำกำรสร้ำงเว็บไซต์ได้มีควำมร้่เก่ียวกับฮำร์ดแวร์ ดังนั ้นคณะผ้่
จัดทำำจึงได้จดทำำคู่มือเก่ียวกับกำรสร้ำงเว็บไซต์นี้เพ่ ือให้ผ้่ศึกษำเข้ำใจวิธีกำร
ั
สร้ำงเว็บไซต์ได้งูำยขึ้น หำกผิดพลำดประกำรใดขออภัยมำ ณ ท่ีนี้ดวยคู่มือนี้้
จัดทำำขึ้นเพ่ ือประกอบกำรเรียนกำรสอนเก่ียวกับกำรสร้ำงเว็บไซต์

3. ข
สารบัญ
เร่ ือง
หน้ ำ
วำงโครงสร้ำง……………………………………………………………………………………1
กำรสร้ำงเว็บไซต์ด้วยโปรแกรม Microsoft
PowerPoint………………………….……….…….2
กำรใสูพ้ืนหลัง ( Background) และลักษณะพิเศษใน
เว็บเพจ…………………………………..3
กำรตกแตูงเน้ือหำ ( Content) ใน
เว็บเพจ……………………………………………………….5
กำรสร้ำงไฮเปอร์ลิงค์ ( Hyperlink)
…………………………………………………………….7
กำรลิงค์ไปยังเว็บเพจ
อ่ ืน…………………………………………………………………………8
กำรบันทึกเว็บเพจ…………………………………………………………………………….
….9

4. 1
วางโครงสร้าง
1. กำำหนดเร่ ืองของเว็บไซต์
2. กำำหนดสูวนประกอบหลักของเว็บ ประกอบไปด้วย
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 สูวนรับข้อม่ล input
2.2.10 สูวนแสดงผล output
2.2.11 รำยช่ ือสมำชิก
2.3 สูวนของเน้ือหำ
3. กำำหนดร่ปแบบของกำรเช่ ือมโยง

5. 2
การสร้างเว็บไซต์ด้วยโปรแกรม Microsoft PowerPoint
กำรสร้ำงเว็บไซต์ก็คือ กำรสร้ำงเอกสำรสำำหรับแสดงผลบน
อินเทอร์เน็ตหรือเว็บบรำว์เซอร์โดยใช้มำตรฐำน HTML ซ่ ึงผ้่สร้ำงจะต้องมี
ควำมร้่และเข้ำใจโครงสร้ำงภำษำ HTML พอสมควรจึงจะสร้ำงได้
ปั จจุบันได้มีกำรพัฒนำโปรแกรมสำำเร็จร่ปชูวยในกำรสร้ำงเว็บเพจ เชูน
Dreamweaver และ
FrontPage เป็ นต้น เพ่ ือชูวยให้ผ้่พัฒนำเว็บออกแบบได้อยูำงสวยงำมและ
รวดเร็ว โดยไมูต้องพิมพ์คำำสังภำษำ HTML หำกแตูใช้กรำฟิ กเข้ำมำชูวย
่
ออกแบบ
อยูำงไรก็ตำม กำรสร้ำงเว็บเพจท่ีงูำยอีกวิธีหน่ ึง คือ กำรสร้ำงด้วย
โปรแกรมไมโครซอฟต์เวิร์ด
ซ่ ึงมีวิธีกำรสร้ำง ดังนี้
1. เปิ ดไฟล์ใหมู คลิกคำำสัง แฟ้ ม > สร้ำง
่

6. 2. ใสูข้อควำมลงไปโดย คลิกคำำสัง แทรก > กลูองข้อควำม > วำงบนพ้ืนท่ี
่
วูำง ของ
สไลด์

7. 3
การใส่พ้ืนหลัง ( Background) และลักษณะพิเศษในเว็บเพจ
กำรปรับแตูงเอกสำรให้เหมำะสมและสอดคล้องกับเว็บเพจอ่ ืนๆ ใน
เว็บไซต์เดียวกันมีวิธีกำรทำำ ดังนี้
1. ตกแตูงไฟล์งำนให้สวยงำม เชูน ตกแตูงพ้ืนหลัง โดยคลิกท่ีคำำสัง
่
ออกแบบ => ลักษณะพ้ืนหลัง
2. หำกต้องกำรเลือกภำพพ้ืนหลังให้เลือกจัดร่ปแบบพ้ืนหลัง > กำร
เติมร่ปภำพหรือพ้ืนผิว > แฟ้ ม
แล้วเลือกร่ปภำพท่ีจะนำ ำมำเป็ นภำพพ้ืนหลัง

8. 4
กำรเพ่ิมเติมลักษณะพิเศษ และไลูระดับสี ให้คลิกเลือกคำำสัง
่
จัดร่ปแบบพ้ืนหลัง > สีเติมไลูระดับ > สีหรือสีท่ีตังไว้ เลือกคำำสังยูอย
้ ่
เชูน ชนิ ด และมุม
4. เลือกพ้ืนผิว คลิกเลือกคำำสัง จัดร่ปแบบพ้ืนหลัง => กำรเติมร่ปภำพ
่
หรือพ้ืนผิว

9. 5
การตกแต่งเน้ือหา ( Content) ในเว็บเพจ
ข้อควำม ภำพ เป็ นสูวนประกอบสำำคัญของเว็บเพจ ซ่ ึงมีวิธีกำรทำำ
ดังนี้
1. กำรตกแตูงตัวอักษร (Font) ใน PowerPoint สำมำรถสร้ำงตัว
อักษรได้หลำกหลำย ตลอดจนสีสันให้สวยงำมได้งูำย โดยท่ีเม่ ือนำ ำไปแสดง
บนบรำว์เซอร์กจะมีลักษณะเหมือนต้นแบบท่ีสร้ำงอักษรประดิษฐ์ตูำงๆ ก็
็
สำมำรถนำ ำมำประกอบเอกสำรได้เชูนกัน
2. กำรแทรกภำพประกอบข้อควำม เรำสำมำรถนำ ำภำพมำใสูไว้ใน
เว็บเพจด้วยคำำสัง
่
แทรก > ร่ปภำพ ( Insert > Picture ) เม่ ือได้ภำพแล้วสำมำรถ
ปรับขนำด วำงตำำแหนู ง หมุน และปรับลักษณะภำพให้เหมำะสมกับ
ข้อควำมได้ ดังร่ป

10. 6

11. 7
การสร้างไฮเปอร์ลิงค์ ( Hyperlink)
ไฮเปอร์ลิงค์ หมำยถึง กำรเช่ ือมโยงเอกสำรจำกจุดหน่ ึงไปยังอีกจุด
หน่ ึง เรียกสันวูำ ลิงค์ ( links )
้
ซ่ ึงมีหลำยลักษณะ ทังกำรลิงค์ภำยในเว็บเพจหน้ ำเดียวกัน ลิงค์ระหวูำง
้
หน้ ำในเว็บไซต์เดียวกัน และลิงค์ไปยังเว็บไซต์อ่ืน เหตุผลท่ีต้องสร้ำงลิงค์
ก็คือ ข้อม่ลท่ีจะนำ ำเสนอในเว็บเพจมีจำำนวนมำกไมูสำมำรถนำ ำเสนอให้ครบ
ได้ในหน้ ำเดียว จึงต้องเช่ ือมโยงเอกสำรจำกหน้ ำหน่ ึงไปยังหน้ ำอ่ ืนๆ
ลิงค์อำจเป็ นตัวอักษร คำำ ข้อควำม ภำพ หรืออ่ ืนๆ โดยจะใช้สีแตก
ตูำงจำกข้อควำมปกติหรือมีขีดเส้นใต้ไว้ สำมำรถคลิกเพ่ ือลิงค์ไปยังตำำแหนู ง
ท่ีเช่ ือมโยงไว้ทันที
การลิงค์ประกอบด้วย
1. ข้อม่ลต้นทำง สำำหรับผ้่ใช้คลิกเพ่ ือเช่ ือมโยงไปยังข้อม่ลอ่ ืนๆ
2. ข้อม่ลปลำยทำง เป็ นหน้ ำเว็บเพจ หรือแหลูงข้อม่ลท่ีสร้ำงไว้
สำำหรับแสดงผล

12. 8
การลิงค์ไปยังเว็บเพจอ่ ืน
ในกรณี ท่ีเรำสร้ำงเว็บเพจไว้หลำยหน้ ำและกำำหนดให้มกำรเช่ ือมโยง
ี
กันไปตำมหัวข้อเร่ ือง เม่ ือผ้่อูำนคลิกก็จะไปยังเร่ ืองท่ีต้องกำรนั ้นทันที
การสร้างลิงค์ไปยังเว็บเพจอ่ ืน มีวิธีการทำาดังนี้
1. สร้ำงเว็บเพจต้นทำงและปลำยทำง
2. เปิ ดไฟล์ข้อม่ลต้นทำง แล้วคลิกระบำยข้อควำมท่ีต้องกำรจะ
สร้ำงลิงค์
3. drag เมำส์คลุมชูวงข้อควำมหรือร่ปภำพท่ีต้องกำร
4. คลิก แทรก > กำรเช่ ือมโยงหลำยมิติ
5. จะปรำกฏไดอะล็อกบ็อกซ์ กำรเช่ ือมโยงหลำยมิติ ให้เลือก
ตำำแหนู งท่ีต้องกำรสร้ำง link

13. 9
การบันทึกเว็บเพจ
เม่ ือสร้ำงและตกแตูงเว็บเพจเสร็จแล้ว จะต้องบันทึกไฟล์ให้เป็ น
เอกสำร HTML ดังนี้
1. คลิกท่ีคำำสัง แฟ้ ม => บันทึกเป็ น => กำรนำ ำเสนอของ
่
PowerPoint
2. จะได้หน้ ำตูำงสำำหรับบันทึกเอกสำร ให้เลือกชนิ ดของไฟล์เป็ น
แบบ Web Page โดย Word จะแยกภำพหรือกรำฟิ กไปไว้เป็ น

14. ไฟล์ตูำงหำก ถ้ำเลือกเป็ นแบบ Single File Web Page จะ
เป็ นกำรบันทึกเว็บทังหมดไว้ในไฟล์เดียวกัน
้
10
3. กำรเปล่ียนข้อควำมไตเติลของเว็บเพจให้คลิกท่ีคำำสัง เปล่ียนช่ ือ
่
เร่ ือง จะได้หน้ ำตูำงสำำหรับพิมพ์ช่ือเร่ ืองใหมู แล้วคลิก ตกลง
4. ทดลองเปิ ดไฟล์ด้วยเบรำว์เซอร์ IE จะได้เว็บเพจ ดังนี้