Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


การปรับและตกแต่งรูปภาพกราฟิก
        
        การปรับแต่งคุณสมบัติของรูปภาพ

        เมื่อได้แทรกรูปภาพลงในเว็บเพจเรียบร้อยแล้ว สามารถปรับแต่งคุณสมบัติต่างๆ ของรูปภาพได้ โดยวิธีการคลิกที่รูปภาพนั้นๆ แล้วสามารถกำหนดค่าต่างๆ ได้ที่พาเนล Properties ของรูปภาพดังต่อไปนี้
       1. ตั้งชื่อรูปภาพ
       2. กำหนดความกว้าง/สูงของรุปภาพ มีหน่วยเป็นพิเซล
       3. บอกตำแหน่งของไฟล์ภาพ
       4. บอกเป้าหมายของจุดเชื่อมโยงในกรณีที่ทำรูปภาพเป็นจุดเชื่อมโยง
       5. ใส่คำอธิบายรูปภาพ
       6. กลุ่มเครืองมือที่ใช้แก้ไขและตกแต่งรูปภาพ
       7. เลือกใช้สไตล์ CSS ในกรณีที่มีการกำหนด CSS ไว้
       8. กลุ่มเครื่องมือที่่ใช้สร้าง Image Map
       9. กำหนดระยะห่างระหว่างรูปภาพกับข้อความที่พิมพ์ลงในหน้าเว็บเพจ
           - V Space เป็นการกำหนดระยะห่่างในแนวตั้ง
           - H Space เป็นการกำหนดระยะห่างในแนวนอน
       10. จุดเชื่อมปลายทางของรูปภาพ (ในกรณีที่ใช้รูปภาพเป็นจุดเชื่อมโยง)
       11.ไฟล์ภาพขนาดเล็กสำหรับแสดงก่อนไฟล์รูปภาพจริง
       12. ใส่ขนาดเส้นกรอบรูปภาพ
       13. จัดตำแหน่งของรูปภาพเมื่อเทียบกับข้อความ
           - Default ไม่มีการจัดตำแหน่ง การแสดงผลขึ้นอยู่กับเว็บบราวเซอร์ ส่วนใหญ่จะเหมือนกับ Bottom
           - Baseline และ Bottom เป็นการจัดขอบล่างของรูปภาพให้อยู่แนวเดียวกับเส้นฐานของข้อความ
           - Middle เป็นการจัดตำแหน่งแนวกึ่งกลางของรูปภาพให้อยู่ในแนวเดียวฐานของตัวอักษร
           - Text Top เป็นการจัดขอบบนของรูปภาพให้อยู่แนวเดียวกับส่วนบนสุดของข้อความ
           - Absolute Middle เป็นการจัดแนวกึ่งกลางรูปภาพให้อยู่แนวเดียวกับกึ่งกลางบรรทัดข้อความ
           - Absolute Bottom เป็นการจัดขอบล่างของรูปภาพให้อยู่ในแนวล่างสุดของบรรทัด
           - Left เป็นการจัดรูปภาพให้อยุ่ด้านซ้ายสุดของข้อความ
           - Right เป็นการจัดรูปภาพให้อยู่ด้านขวาสุด

        การตกแต่งรูปภาพด้วยกลุ่มเครื่องมือตกแต่งภาพ     
 เมื่อทำการแทรกรูปภาพเข้ามในเว็บเพจแล้วสามารถปรับแต่งรูปภาพกราฟิกได้เพิ่มเติม โดยใน Dreamweaver นั้นจะมีเครื่องมือจัดการภาพกราฟิกโดยไม่ต้องใช้โปรแกรมตัวอื่น โดยจะมีเครื่องมือ ดังนี้
     
       
       1. Crop ใช้สำหรับตัดขอบภาพ
       2. Resample ใช้สำหรับปรับขนาดจริงของภาพ
       3. Brightnees and Contrast ใช้สำหรับปรับความสว่าง/Contrast
       4. Shapen ใช้สำหรับปรับความคมชัด
         การตัดขอบภาพ(Crop)
         ใช้สำหรับตัดขอบรูปภาพ เพื่อใช้ในส่วนที่ต้องการเท่านั้น ทำได้โดยวิธีการดังนี้
         1. คลิกเลือกรูปภาพที่ต้องการตัดขอบ
         2. คลิกเลือกเครื่องมือ Crop
         3. จะได้กรอบเริ่มต้นเพื่อทำการตัดของภาพ ให้ทำการลากจุดแฮนเดิลแต่ละด้านจนได้ขอบเขตที่ต้องการ
         4. กดแป้น Enter เพื่อยืนยัน จะได้ผลลัพธ์ดังรูป
        
         การปรับค่าความสว่างและค่า Contrast ของภาพ

         ใช้สำหรับปรับความมืดหรือสว่างของรูปภาพหรือมีค่า Contrast ที่ไม่ดี สามารถทำได้โดยวิธีการดังนี้
         1. คลิกเลือกรูปภาพที่ต้องการปรับ
         2. คลิกเลือกเครื่องมือ Brightness and Contrast
         3. จะได้หน้าต่าง Brightness/Contrast การปรับค่าขึ้นมา ให้ทำการปรับค่า Brightness หรือค่า Contrast ตามต้องการโดยให้คลิกเลือกที่ช่อง Preview เพื่อดูผลลัพธ์ทันที จนได้ค่าความมืด/สว่างที่ต้องการ
         4. คลิกเลือก OK เพื่อยืนยัน จะได้ผลลัพธ์ดังรูป
         
         การปรับค่าความคมชัดของภาพ (Shapen)

         ใช้สำหรับปรับเพิ่มความคมชัดของรูปภาพ สามารถทำได้โดยวิธีการดังนี้
         1. คลิกเลือกรูปภาพที่ต้องการปรับ
         2. คลิกเลือกเครื่องมือ Shapen
         3. จะได้หน้าต่าง Shapen การปรับค่าขึ้นมา ให้ทำการปรับเพิ่มค่าความคมชัดตามต้องการโดยให้คลิกเลือกที่ช่อง Preview เพื่อดูผลลัพธ์ทันที จนได้ค่าความคมชัดที่ต้องการ
         4. คลิกเลือก OK เพื่อยืนยัน จะได้ผลลัพธ์ดังรูป
         
         การปรับค่าขนาดจริงของภาพ (Resample)

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