เว็บเบราว์เซอร์และระบบจัดการเนื้อหาที่ทันสมัยจะปรับรูปภาพให้แสดงในการตั้งค่าใดก็ได้ อย่างไรก็ตาม ทางที่ดีควรเตรียมรูปภาพที่ปรับให้เหมาะสมสำหรับปัจจัยรูปแบบและตำแหน่งที่เป็นไปได้แต่ละรายการที่รูปภาพอาจปรากฏขึ้น เน้นสามสิ่ง: ความละเอียดของภาพ ขนาด และพื้นที่สี
พื้นที่สีในภาพ
นักออกแบบกราฟิกอาศัยช่องว่างสีหลักสองช่อง พื้นที่สีเป็นวิธีการที่สีหลักรวมกันเพื่อสร้างสีรุ้งที่ซับซ้อน
ใช้โหมด RGB เมื่อเตรียมภาพสำหรับอุปกรณ์มือถือ การแสดงผลบนจอคอมพิวเตอร์และสมาร์ทโฟนขึ้นอยู่กับพิกเซลสีแดง สีน้ำเงิน และสีเขียว ภาพ RGB นี้ได้รับการปรับให้เหมาะสมเพื่อสร้างสีบนหน้าจอที่ต้องการอย่างแม่นยำ
สำหรับการพิมพ์ นักออกแบบใช้กระบวนการสี่สี โดยที่ทุกสีกลั่นเป็นสีฟ้า สีม่วงแดง สีเหลือง และสีดำ บางครั้งภาพสี่สีจะเรียกว่าภาพ CMYK ด้วยเหตุผลนี้
ความละเอียดของภาพ
รูปภาพโดยเฉพาะบนแพลตฟอร์มมือถือควรมีขนาดที่เล็กที่สุดเท่าที่จะทำได้เพื่อสร้างสมดุลระหว่างคุณภาพกับความเร็วในการดาวน์โหลดบนเครือข่ายมือถือและขนาดไฟล์เทียบกับตัวพิมพ์ใหญ่ของข้อมูลมือถือ
โปรแกรมส่วนใหญ่ รวมถึงแอปพลิเคชัน Adobe Creative Cloud รองรับเครื่องมือ Export for Web ที่แสดงภาพด้วยความละเอียดและการบีบอัดที่หลากหลาย เลือกรูปภาพคุณภาพดีที่สุดที่ขนาดรวมต่ำสุด
ขนาดภาพเป็นพิกเซล
แต่ละภาพควรมีขนาดตามวัตถุประสงค์ ต่อไปนี้คือตัวอย่างขนาดรูปภาพสำหรับการใช้งานเว็บยอดนิยม:
- โฆษณาแบนเนอร์บนอินเทอร์เน็ตมักมีขนาด 468 x 60 พิกเซล
- ภาพหน้าปก Facebook ควรมีขนาด 851 x 315 พิกเซล
- รูปโปรไฟล์ Twitter ควรมีขนาด 400 x 400 พิกเซล
- รูปภาพสำหรับลิงก์ที่แชร์ควรมีขนาด 1200 พิกเซลคูณ 630 พิกเซล
เมื่อคุณทำงานกับรูปภาพเพื่อวัตถุประสงค์เฉพาะ ให้ตรวจสอบตำแหน่งที่รูปภาพนั้นจะปรากฏ (เช่น ไซต์โซเชียลมีเดียหรือบล็อก) เพื่อตรวจสอบขนาดรูปภาพที่เหมาะสมที่สุด จากนั้นจึงปรับขนาดตามนั้นเพื่อหลีกเลี่ยงการยืดหรือตัดแต่งรูปภาพ.
เพื่อหลีกเลี่ยงการแตกพิกเซล ให้เล็งไปที่ขนาดการแสดงผลจริง แม้ว่ารูปภาพจะมีขนาดอย่างเหมาะสม หากไม่ได้ขนาดอย่างถูกต้อง ผลลัพธ์ที่ได้อาจดูเหมือนเป็นพิกเซล หากต้องขยายขนาดรูปภาพให้ตรงกับพื้นที่ว่าง
เกี่ยวกับภาพเวกเตอร์
ภาพเวกเตอร์-ภาพเวกเตอร์ที่คำนวณและวาดโดยอุปกรณ์นั้น มักจะมีประสิทธิภาพและคุณภาพสูงกว่าภาพแรสเตอร์ (ภาพที่วาดครั้งละหนึ่งพิกเซล) เพราะสามารถขยายและย่อได้โดยไม่กระทบต่อคุณภาพของภาพ. สำหรับโลโก้ที่เรียบง่าย ลายเส้นและกราฟ เวอร์ชันเวกเตอร์นั้นเหมาะสมที่สุดไม่ใช้รูปแบบเวกเตอร์สำหรับรูปภาพ