powerpoint-07

การจดั เตรียมโฟลเดอรภ์ าพ 1. สรา้ งโฟลเดอรช์ ่ือ images (คลิกขวา> New > Folder แล้วตงั้ ช่ือ) สาหรบั เกบ็ ภาพประกอบไว้ในโฟลเดอรข์ องเวบ็ ไซต์ 2

เพื่อความสะดวกในการใช้งาน เมื่อต้องการนาภาพมาใช้งานใน เวบ็ ไซต์ ควรบนั ทึกภาพเกบ็ ไว้ในโฟลเดอร์ images ก่อนนาไปใช้งานในเวบ็ เพจ 3

2. โฟลเดอร์ images จะมาปรากฏในพาเนล Files พร้อมใช้งานได้ทนั ที 4

วิธีแทรกภาพลงในเวบ็ เพจ การแทรกภาพลงในเวบ็ เพจนัน้ สามารถทาได้หลายวิธี ดงั นี้ แทรกภาพจากโฟลเดอรเ์ กบ็ ภาพ การแทรกภาพจากโฟลเดอรเ์ กบ็ ภาพ สามารถทาได้โดยนาภาพจากโฟลเดอร์ images ที่เตรียมไว้โดยมีขนั้ ตอน ดงั นี้ 1. คลิกเลือกบริเวณท่ีต้องการแทรกภาพ 5

2. คลิกพาเนล Insert แล้วเลือก 3. ไปที่คาสงั่ image แล้วเลือก Common Image 6

4. เลือกภาพที่ต้องการ แล้วคลิก 5. ใส่คาอธิบายภาพ แล้วคลิกป่ มุ OK OK 7

6. ภาพท่ีเลือกจะปรากฏลงในเวบ็ เพจทนั ที 8

การแทรกภาพจากพาเนล Files 1. คลิกพาเนล Files แล้วเลือก 2. ใช้เมาสล์ ากภาพไปวางในจดุ ท่ี ไฟลภ์ าพท่ีต้องการ ต้องการ 9

3. ภาพท่ีเลือกจะถกู วางในจดุ ท่ีเลือกทนั ที 10

การปรบั ขนาดภาพ ในกรณีที่ภาพท่ีนามาวางมีขนาดเลก็ หรอื ใหญ่เกินไป สามารถปรบั ขนาดภาพได้โดยการคลิกค้างท่ีจดุ สี่เหลี่ยมบริเวณมมุ ของรปู ภาพ และลากปรบั ขนาดได้ตามต้องการทนั ที 11

หากต้องการย่อ-ขยายภาพโดยให้คงอตั ราส่วนกว้าง-ยาวเดิม ให้กด Shift ค้างขณะที่กาลงั ปรบั ขนาดภาพ ทาให้ภาพไม่เสียอตั ราส่วน (ภาพบีบผิด สดั ส่วน) ได้ 12

การครอปภาพ 2. เลือกปรบั ขนาดของการครอป 1. เลือกที่รปู ภาพ จากนัน้ เลือก ภาพตามที่ต้องการ จากนัน้ กด Enter ป่ มุ (Crop) บน พาเนล Properties 13

3. ภาพจะถกู ครอปส่วนท่ีไม่ต้องการออกไป เหลือแต่ส่วนที่เลือกไว้ทนั ที 14

การใส่ภาพฉากหลงั ให้เวบ็ เพจ 1. ไปท่ีเมนู Modify > Page 2. คลิกท่ี Browse Properties 15

3. เลือกภาพที่ต้องการแล้วคลิกท่ี 4. คลิก Apply เพื่อทดสอบผล OK เมื่อเสรจ็ แล้วคลิกป่ มุ OK 16

5. จะได้ภาพพืน้ หลงั ท่ีเลือกไวท้ นั ที 17

การปรบั ขนาดภาพ 1. เลือกตาแหน่งที่ต้องการแทรก แล้วไปท่ีเมนู Insert > Media > Plugin 18

2. เลือกไฟลท์ ่ีต้องการแทรก 3. จากนัน้ ให้บนั ทึกไฟลเ์ วบ็ เพจ แล้วคลิก OK และเมื่อเปิ ดไฟลน์ ี้ด้วยเวบ็ เบราวเ์ ซอรจ์ ะสามารถเล่น เสียงได้ดงั ภาพ 19

1. เลือกบริเวณที่ต้องการแทรก 2. เลือกไฟลท์ ่ีต้องการแทรก จากนัน้ ไปที่ Insert > Media >SWF 20

3. ตงั้ ช่ือไฟล์ แล้วคลิก OK 4. เม่ือบนั ทึก และเปิ ดในเวบ็ เบราวเ์ ซอรจ์ ะแสดง ภาพเคล่ือนไหวท่ีแทรกไว้ ทนั ที 21

การแทรกไฟล์ FLV 1. เลือกบริเวณที่ต้องการแทรกไฟล์ FLV และไปท่ี Insert > Media > FLV 22

2. จะปรากฏหน้าต่างขึน้ มา 2.1 คลิก Browse เพื่อเลือกไฟล์ 2.2 กาหนดขนาดของวิดีโอ Width และ Height 2.3 คลิก OK 23

3. เม่ือบนั ทึก และนาไปเปิ ดในเวบ็ เบราวเ์ ซอรจ์ ะสามารถคลิกเพื่อเล่นไฟล์ FLV ได้ทนั ที 24

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

การสรา้ งลิงกเ์ ช่ือมโยงระหว่างเวบ็ เพจ 1. คลิกบริเวณที่ต้องการ 2. คลิกพาเนล Insert เลือก ใส่ข้อความลิงก์ Common แล้วเลือกคาสงั่ Hyperlink 26

3. พิมพข์ ้อความท่ีต้องการใช้เป็น 4. เลือกไฟล์ Html ของเวบ็ ข้อความลิงก์ จากนัน้ คลิกป่ มุ เพจ ท่ีต้องการให้ลิงกเ์ ปิ ด (Browse) ไปถึง จากนัน้ คลิก OK 27

5. จะได้ข้อความลิงกท์ ่ีพรอ้ มใช้งาน 28

การสรา้ งลิงกเ์ ชื่อมโยงกบั เวบ็ ไซตอ์ ่ืน 1. คลิกเลือกคลมุ ข้อความ 2. ไปท่ีแถบ Properties เลือก หรือเลือกรปู ภาพท่ีต้องการ เป็นแบบ HTML แล้วกรอก สรา้ งลิงก์ URL ที่ต้องการเปิ ดลงในช่อง Link 29

3. จะได้ข้อความหรือรปู ลิงก์ ท่ีพร้อมเชื่อมโยงไปยงั เวบ็ ไซตท์ ี่กาหนดไว้ ทนั ที 30

การทดสอบลิงก์ 2. ไปยงั โฟลเดอรท์ ่ีเกบ็ ไฟลเ์ วบ็ 1. บนั ทึกหน้าเวบ็ เพจให้ เพจ จากนัน้ คลิกขวาท่ีไฟล์ > Open With > Internet เรียบร้อย Save As Explorer 31

3. ทดสอบคลิกท่ีลิงกว์ ่าใช้ 4. ในกรณีท่ีใช้ได้ จะต้องเปิ ดเวบ็ งานได้หรอื ไม่ ออกมาได้ถกู ต้องตามที่ตงั้ ค่า ไว้ 32

กาหนดรปู แบบการเปิ ดลิงก์ จากตวั อย่างท่ีผา่ นมา การสร้างลิงกแ์ บบต่างๆ จะเหน็ ได้ว่า จะมีการ กาหนดรปู แบบการเปิ ดหน้าลิงก์ หรอื Target ซึ่งสามารถเลือกได้บนพาเนล Properties โดยมีทงั้ หมด 5 แบบดงั นี้ 1. _blank เป็นการกาหนดให้เปิ ดเวบ็ เพจเป็นหน้าต่างหรือแทบ็ ใหม่ ทกุ ครงั้ ที่คลิกลิงก์ 33

2. new เป็นการกา หนดให้เปิ ดเวบ็ เพจเป็นหน้าต่างหรือแทบ็ ใหม่ แต่เม่ือ คลิกท่ีลิงกท์ ่ีกาหนด Target เป็น new เหมือนกนั เวบ็ เพจเหล่านัน้ จะ โหลดในหน้าเดิมท่ีเปิ ดไว้แล้ว 3. _parent เป็นการกาหนด Target สาหรบั เวบ็ เพจท่ีออกแบบโครงสร้าง ด้วย Frame โดยเป็นการระบใุ ห้เปิ ดเวบ็ เพจในเฟรมหลกั ท่ีครอบเฟรม ทงั้ หมดไว้ 4. _self เป็นการกาหนด Target สาหรบั เวบ็ เพจท่ีออกแบบโครงสรา้ งด้วย Frame โดยเป็นการระบใุ ห้เปิ ดเวบ็ เพจในเฟรมท่ีลิงกน์ ัน้ แสดงอยู่ 5. _top เป็นการกาหนด Target สาหรบั เวบ็ เพจที่ออกแบบโครงสร้างด้วย Frame โดยยกเลิกโครงสรา้ งเฟรมทงั้ หมดออกไป 34

การกาหนดสีสนั ให้ขอ้ ความลิงก์ 1. คลิกป่ มุ Page Properties บนพาเนล Properties 35

2. คลิกเลือกที่ Links (CSS) และกาหนดค่าต่าง ๆ ดงั นี้ 2.1 Link Color กาหนดสีข้อความลิงก์ 2.2 Rollover links กาหนดสีข้อความลิงกเ์ มื่อนาเมาสไ์ ปวาง 2.3 Visited links เลือกสีของข้อความลิงกท์ ี่เคยคลิกไปแล้ว 36

2.4 Active Links เลือกสีของข้อความลิงกล์ ่าสดุ ท่ีคลิก 2.5 Underline Style เลือกรปู แบบการขีดเส้นใต้ของข้อความลิงก์ มี 4 รปู แบบ ได้แก่ Always underline คือ ให้แสดงเส้นใต้บนข้อความลิงกต์ ลอดเวลา Never underline คือ ไม่ให้แสดงเส้นใต้บนข้อความลิงกเ์ ลย Show underline only on rollover คือ แสดงเส้นใต้บนข้อความ ลิงกเ์ ม่ือวางเมาสล์ งบนข้อความลิงกเ์ ท่านัน้ Hide underline on rollover คือ แสดงเส้นใต้บนข้อความลิงก์ แต่ ซ่อนเส้นใต้เม่ือ วางเมาสบ์ นข้อความลิงก์ เม่ือเสรจ็ แล้วคลิกที่ OK 37

3. ข้อความลิงกท์ งั้ หมดจะมีสีสนั สวยงามตามท่ีกาหนด 38