งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

By Juthawut Chantharamalee การพัฒนาเว็บด้วย โปรแกรมสำเร็จรูป Suan Dusit Rajabhat University (Computer Science) 1.

งานนำเสนอที่คล้ายกัน


งานนำเสนอเรื่อง: "By Juthawut Chantharamalee การพัฒนาเว็บด้วย โปรแกรมสำเร็จรูป Suan Dusit Rajabhat University (Computer Science) 1."— ใบสำเนางานนำเสนอ:

1 By Juthawut Chantharamalee การพัฒนาเว็บด้วย โปรแกรมสำเร็จรูป Suan Dusit Rajabhat University (Computer Science) 1

2 บทที่ 6 การใส่รูปลงใน เส็บเพจ บทที่ 2 Suan Dusit Rajabhat University (Computer Science) 2

3 บทนำ ภายในเว็บเพจของเรานอกจากจะมีเนื้อหาที่มี ประโยชน์แก่ผู้เข้าชมแล้ว หากมีการเพิ่มรูป ภาพกราฟิกต่างๆ ก็จะช่วยให้เว็บเพจมีสีสัน สวยงามน่าสนใจมากยิ่งขึ้น ดังนั้นเราจะเห็นได้ว่า เว็บไซต์จำนวนมากจึงนิยมนำรูปภาพมาใช้ตกแต่ง และอธิบายเนื้อหาเพื่อให้ผู้เข้ามาเยี่ยมชม เว็บไซต์ได้เห็นภาพและเข้าใจเนื้อหามากขึ้น Suan Dusit Rajabhat University (Computer Science) 3

4 ข้อพิจารณาในการเลือกใช้รูปภาพ ในการนำภาพมาประกอบข้อความบนเว็บเพจนั้น ควรพิจารณาและเลือกรูปภาพที่นำมาใช้ให้ เหมาะสมโดยมีข้อพิจารณาดังนี้ 1. ไม่ควรเน้นรูปภาพภายในเว็บเพจมากจนเกินไป ควรจะมีข้อความและรูปภาพที่สมดุลกัน 2. การใช้รูปภาพที่เป็นไฟล์ขนาดใหญ่จะทำให้การ โหลดเว็บเพจใช้เวลานานกว่าจะแสดงภาพ ดังนั้น จึงควรใช้ภาพที่มีพอเหมาะกับสิ่งที่เราต้องการสื่อ กับผู้ชม หรืออาจใช้โปรแกรมทางกราฟิก เช่น Photoshop หรือ ACDSee ทำการลดขนาดภาพ (Resize) ก่อนนำมาลงบนเว็บเพจก็ได้ 3. ปัจจุบันการนำรูปภาพลงเว็บเพจควรคำนึงถึงที่มา และลิขสิทธิ์ของรูปภาพนั้นด้วย แต่บางเว็บไซต์ก็มี การแจกรูปภาพให้ฟรี ซึ่งสามารถนำมาใช้ประโยชน์ โดยไม่ต้องเสียค่าลิขสิทธิ์ 4. ควรเลือกใช้ภาพที่มีโทนเดียวกับส่วนประกอบอื่น ภายในเว็บเพจ เพื่อความกลมกลืนไม่แตกต่างกัน Suan Dusit Rajabhat University (Computer Science) 4

5 ชนิดของรูปภาพที่ใช้ในเว็บเพจ ชนิดของรูปภาพที่ใช้ในเว็บเพจมีอยู่ 3 ชนิดด้วยกัน ดังนี้ GIF (Graphic Interchange Format) นับเป็นไฟล์ภาพที่ สามารถแสดงผลกับเบราเซอร์ได้ทุกชนิด จึงได้รับ ความนิยม โดยส่วนมากมักจะใช้รูปภาพไฟล์.gif กำหนดฉากหลังหรือพื้นที่โปรงใส การใช้ทำ ภาพเคลื่อนไหว (Animation) ภาพโลโก้ ตัวการ์ตูน ภาพตัวอักษร ลายเส้นต่างๆ JPG (Joint Photographic Expert Group) เป็นไฟล์ภาพ ที่แสดงสีได้ถึง 16.7 ล้านสี เหมาะสำหรับภาพที่ใช้สี จำนวนมาก ภาพที่มีการไล่ระดับสีอย่างต่อเนื่อง หรือภาพถ่ายทั่วไป Suan Dusit Rajabhat University (Computer Science) 5

6 ชนิดของรูปภาพที่ใช้ในเว็บเพจ PNG (Portable Network Graphic) เป็นไฟล์ภาพที่ ไม่ได้รับความนิยมมากนักเมื่อเทียบกับ GIF, JPG เนื่องจากเป็นรูปแบบใหม่ จึงไม่สามารถแสดงผลได้ ทุกเบราเซอร์ Suan Dusit Rajabhat University (Computer Science) 6

7 การใส่รูปภาพลงบนเว็บ Suan Dusit Rajabhat University (Computer Science) 7

8 การจัดการเกี่ยวกับรูปภาพ เมื่อเรานำรูปภาพมาวางไว้ในเว็บเพจแล้ว หากเรา ต้องการจัดเกี่ยวกับรูปภาพในลักษณะต่างๆ เช่น การปรับขนาด การจัดวางรูป การใส่ข้อความ อธิบายรูปภาพ การใส่กรอบให้รูปภาพ การกำหนด ระยะห่างระหว่างรูปภาพ เป็นต้น เราสามารถ จัดการเกี่ยวกับรูปภาพได้โดยใช้ Suan Dusit Rajabhat University (Computer Science) 8

9 การจัดการเกี่ยวกับรูปภาพ Suan Dusit Rajabhat University (Computer Science) 9

10 การจัดการเกี่ยวกับรูปภาพ Suan Dusit Rajabhat University (Computer Science) 10 เราสามารถจัดวางรูปภาพประกอบข้อความบน หน้าเว็บเพจให้มีความสวยงาม เป็นที่น่าดูของผู้ เข้ามาเยี่ยมชมเว็บไซต์ โดยมีขั้นตอนดังนี้

11 ในการจัดวางรูปภาพประกอบข้อความมี รายละเอียดดังนี้ Default เป็นการจัดเรียงแบบปกติ Baseline เป็นการจัดให้ขอบล่างของรูปภาพอยู่แนวเดียวกับ บรรทัดของข้อความ Top เป็นการจัดให้ขอบบนของรูปภาพอยู่แนวเดียวกันกับบรรทัด ของข้อความ Middle เป็นการจัดให้ตรงกลางของรูปภาพอยู่แนวเดียวกันกับ บรรทัดของข้อความ Bottom เป็นการจัดให้ขอบล่างของรูปภาพอยู่แนวเดียวกันกับ บรรทัดของข้อความคล้ายการจัดแบบ Baseline Text Top เป็นการจัดให้ขอบบนของรูปภาพอยู่แนวเดียวกับ บรรทัดของข้อความคล้ายการจัดแบบ Top Absolute Bottom เป็นการจัดให้ขอบล่างของรูปภาพอยู่แนว เดียวกับส่วนกลางของบรรทัดข้อความ Left เป็นการจัดให้รูปภาพอยู่ทางซ้ายมือของบรรทัดข้อความ Right เป็นการจัดให้รูปภาพอยู่ทางขวามือของบรรทัดข้อความ Suan Dusit Rajabhat University (Computer Science) 11

12 การใส่รูปภาพเป็นฉากหลัง การใส่รูปภาพเป็นฉากหลัง (Background) ถือว่า เป็นการเพิ่มความสวยงามและน่าสนใจให้กับเว็บ เพจ ซึ่งภาพที่น่าจะนำมาเป็นฉากหลังต้องไม่มี ลวดลายหรือสีสันมากเกินไป เพื่อไมให้ผู้ชม เว็บไซต์สับสนหรือสีของพื้นหลังอาจตัดกับสีของ ข้อความทำให้ลำบากในการอ่านได้ ดังนั้นภาพที่ นำมาเป็นฉากหลังต้องเป็นสีที่กลมกลืนกับ ข้อความหรือรูปภาพที่วางไว้ในเว็บเพจ ซึ่งการใส่ รูปภาพเป็นฉากหลังมีขั้นตอนดังนี้ Suan Dusit Rajabhat University (Computer Science) 12

13 การใส่รูปภาพเป็นฉากหลัง Suan Dusit Rajabhat University (Computer Science) 13

14 The End Unit 6 Suan Dusit Rajabhat University (Computer Science) 14


ดาวน์โหลด ppt By Juthawut Chantharamalee การพัฒนาเว็บด้วย โปรแกรมสำเร็จรูป Suan Dusit Rajabhat University (Computer Science) 1.

งานนำเสนอที่คล้ายกัน


Ads by Google