การกำหนดขนาดภาพ สำหรับงานเว็บ

การทำ artwork สวยแต่ไม่ใส่ใจเกี่ยวกับขนาดของภาพ มีผลทำให้เว็บล่มได้ง่ายๆ ครับ สำหรับมืือกราฟิก..

ขนาดภาพที่ใหญ่ แล้วนำมาใส่เว็บ ควรดูวิธีลดขนาดภาพเพื่อประหยัดเนื้อที่โฮสติ้งกันครับ และแน่นอนทำให้เว็บไซต์ของเราแสดงผลได้รวดเร็วมากยิ่งขึ้น

ขนาดภาพจำเป็นอย่างมากสำหรับส่วนเนื้อหางานเว็บไซต์

หากเราไม่เข้าใจ กำหนดผิดพลาดเว็บของเราอาจจะล่มได้ อันนี้สำคัญมากเลย เช่นเว็บนี้นะครับ ตัวอย่างผมให้น้อง Graphic เค้าเข้ามาวางภาพในเว็บไซต์ ซึ่งแน่นอน Artwork สวยงามมากครับ แต่สิ่งที่เกิดขึ้นคือ เว็บไซต์ช้ามาก..
สักพักนึงล่ม ผมเลยเข้าไปดูขนาดไฟล์  ตามภาพด้านล่างครับ 991 MB  ต่อ 1 ภาพ โอ้วว..พระเจ้า..

ผมต้องเข้ามานั่ไล่แก้ทีละภาพเลยละ…เค้าเรียกว่างานงอกครับ
ก็คือต้องปรับ Image Size ให้มีขนาด 600×600 pixel
แล้วก็ปรับ Resolution  72  ครับ เพราะงานในระบบคอมพิวเตอร์ใช้แค่ 72 dpi

แต่ในงานสิ่งพิมพ์จะใช้ต่างกันคือ 150-300 dpi ซึ่งแน่นอนว่าจะได้ภาพที่ใหญ่มาก เพราะฉนั้นงานเว็บปรับแค่ 72 dpi ก็พอครับ
ซึ่งธรรมดาหากเราเป็นโปรแกรมเมอร์อาจจะต้องทำงานร่วมกับฝั่ง Graphic ก็อย่าลืมอธิบายให้เค้าฟังด้วยนะครับ

ปรับลด Image Size ใน Photoshop

หลังจากที่ปรับลดขนาด size ตามภาพให้เล็กลง ก็ประหยัดพื้นที่ได้เยอะครับ แถมเว็บก็รวดเร็วกว่าเดิมเป็นอย่างมาก ซึ่งหากใครต้องมีหน้าที่ดูแลระบบเว็บไซต์แนะนำให้ทำภาพขนาดไฟล์เล็กๆ ครับ ไม่ถึง 100 kb  ได้ยิ่งดี  ใครที่ติดปัญหาลองปรับตามผมนะครับ

ปรับขนาดจาก 991 MB
ลดลงเหลือ  158 KB

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