เอกสารเว็บจะน่าสนใจหรือไม่ นอกจากเนื้อหาที่นำเสนอ ภาพกราฟิกที่นำมาใช้ ก็เป็นส่วนประกอบส่วนหนึ่งเช่นกัน หลักการนำภาพมาใช้ในการสร้างเอกสารเว็บ มีข้อที่ควรทราบ ดังนี้

• ภาพที่นำมาใช้ไม่ควรมีขนาดโตเกินไป เพราะจะทำให้เสียเวลาในการเรียกดูนานเกินไป
• หากจำเป็นต้องใช้ภาพใหญ่ จะต้องนำเทคนิคการตัดภาพ หรือ Low Resolution Image มาช่วย
• ภาพนั้นๆ จะต้องเก็บไว้ในโฟลเดอร์เดียวกับเอกสาร HTML
• ก่อนนำภาพมาใส่ในเอกสาร จะต้องทำการเซฟเอกสารก่อนเสมอ (Save File) เพื่อให้โปรแกรมรู้จัก Directory Path ที่ถูกต้อง
  • Directory Path ของภาพที่ถูกต้อง
  • Directory Path ของภาพที่ไม่ถูกต้อง

การนำภาพมาใส่ในเอกสารเว็บ มีขั้นตอนดังนี้

• คลิกเมาส์ ณ ตำแหน่งที่ต้องการวางภาพ
• คลิกปุ่ม Insert Image จากแถบ Object
• ปรากฏกรอบทำงาน ดังนี้

• เลือกโฟลเดอร์ และภาพที่ต้องการ จากนั้นคลิกปุ่ม Select
• ภาพที่เลือกจะปรากฏในหน้าเอกสารเว็บ โดยมีกรอบสีดำรอบภาพ เรียกว่า Handle

การปรับแต่งภาพ

การปรับแต่งภาพ มีหลายลักษณะ เช่น การย่อ/ขยายภาพจาก Handle หรือควบคุมจากบัตร Properties ซึ่งมีค่าให้ควบคุมให้มากกว่า

การย่อ/ขยายภาพจาก Handle

หากต้องการย่อขยายภาพ สามารถใช้จุด Handle ซึ่งปรากฏอยู่ที่มุมล่างขวาของกรอบภาพเป็นเครื่องมือช่วยได้ทันที ลักษณะการทำงานจะใช้การคลิกเมาส์ค้างไว้แล้วลากเมาส์ให้ได้ขนาดภาพที่ต้องการ แล้วจึงปล่อยนิ้วจากปุ่มของเมาส์

การควบคุมภาพจากบัตร Properties

• คลิกเลือกภาพที่ต้องการ
• สังเกตบัตร Properties จะพบว่ารายการต่างๆ เกี่ยวข้องกับการควบคุมภาพ ดังนี้

• W ค่าควบคุมความกว้างของภาพ มีหน่วยเป็น pixel ค่านี้จะสัมพันธ์กับการย่อ/ขยายภาพด้วย Handle
• H ค่าควบคุมความสูงของภาพ มีหน่วยเป็น pixel ค่านี้จะสัมพันธ์กับการย่อ/ขยายภาพด้วย Handle
• Src รายการระบุชื่อไฟล์ภาพที่นำเสนอ
• Link ส่วนกำหนดจุดลิงก์ (การใช้งานลักษณะเดียวกับ การทำลิงก์กับข้อความที่ได้กล่าวไปแล้ว)
• Target ค่าควบคุมเป้าหมายของการแสดงผลจุดลิงก์
• Align ค่าควบคุมการจัดตำแหน่งของภาพ
• Alt รายการระบุคำอธิบายภาพ (สำหรับรายงานนี้ควรใส่)
• Map รายการทำ Image Map
• V Sapce รายการกำหนดช่องว่างเหนือ/ใต้ภาพ หน่วยเป็น pixel
• H Space รายการกำหนดช่องว่างซ้าย/ขวาของภาพ หน่วยเป็น pixel
• Low Src ระบุชื่อไฟล์ภาพที่นำเสนอแบบ Low Resolution
• Border กำหนดความหนาของกรอบรอบภาพ
• ปุ่มจัดตำแหน่งซ้าย, กลาง, ขวาบรรทัด
• ปุ่มคืนขนาดภาพ
• ปุ่มแก้ไขภาพ