ในฐานะนักออกแบบกราฟิกหรือนักออกแบบเว็บไซต์คุณอาจได้รับแจ้งให้ส่งภาพที่พร้อมใช้งานบนเว็บเช่นรูปภาพสำหรับเว็บไซต์หรือโฆษณาแบนเนอร์ เครื่องมือ Photoshop Save for Web เป็นวิธีที่ง่ายในการจัดเตรียมไฟล์ JPEG ของคุณสำหรับเว็บช่วยให้สามารถใช้งานได้ระหว่างขนาดไฟล์และคุณภาพของภาพ
สำหรับบทแนะนำนี้คุณจะบันทึกภาพ JPEG เครื่องมือ Save for Web สร้างขึ้นเพื่อบันทึกไฟล์ GIF, PNG และ BMP
ทำให้กราฟิกพร้อมใช้งานบนเว็บได้อย่างไร
กราฟิกที่พร้อมใช้งานบนเว็บส่วนใหญ่มีลักษณะร่วมกัน:
- ความละเอียด 72 dpi
- โหมดสีคือ RGB
- ไฟล์มีขนาดลดลงสำหรับหน้าเว็บโหลดเร็วขึ้น
เปิดรูปภาพ
เมื่อต้องการใช้เครื่องมือ Save for Web ให้เปิดภาพใน Photoshop
คลิก ไฟล์> เปิดเรียกดูภาพในคอมพิวเตอร์ของคุณแล้วคลิก เปิด. เพื่อวัตถุประสงค์ในการปฏิบัติงานรูปภาพจะทำงานได้ดีแม้ว่ารูปแบบภาพจะทำก็ตาม
ปรับขนาดรูปภาพให้มีขนาดเล็กที่คุณสามารถใช้บนเว็บไซต์ได้ เมื่อต้องการทำเช่นนี้ให้คลิก ภาพ> ขนาดรูปภาพใหปอนความกว้างใหมในชอง Width และเลือกพิกเซล. ในกรณีนี้ให้ป้อน 400 พิกเซลและคลิก ตกลง.
เปิด Save for Web Tool
สมมติว่ามีคนขอให้คุณส่งภาพที่กว้าง 400 พิกเซลพร้อมที่จะโพสต์ในเว็บไซต์
คลิก ไฟล์ > บันทึกสำหรับเว็บ เพื่อเปิด บันทึกสำหรับเว็บ กล่องโต้ตอบ (ใน Photoshop รุ่นที่ใหม่กว่าเส้นทางคือ ไฟล์ > ส่งออก > บันทึกสำหรับเว็บ.)
เรียกดูการตั้งค่าและเครื่องมือต่างๆในหน้าต่าง
03 จาก 07ตั้งค่าการเปรียบเทียบ
ที่ด้านบนของ บันทึกสำหรับเว็บ หน้าต่างเป็นชุดของป้ายกำกับ เป็นต้นฉบับ, เพิ่มประสิทธิภาพ, 2-Up, และ 4-Up. เมื่อคลิกที่แท็บเหล่านี้คุณสามารถสลับระหว่างมุมมองภาพต้นฉบับภาพที่ดีที่สุดของคุณกับการตั้งค่า Save for Web ที่ใช้กับภาพหรือเปรียบเทียบรูปถ่ายของคุณสองหรือสี่รูป
เลือก 2-Up เพื่อเปรียบเทียบภาพถ่ายต้นฉบับกับภาพที่ได้จากการปรับให้เหมาะสมโดยการแสดงสำเนาของภาพด้านข้างโดยด้านข้าง
04 จาก 07ตั้งค่าการแสดงตัวอย่างต้นฉบับ
คลิกที่รูปด้านซ้ายเพื่อเลือก เลือก เป็นต้นฉบับ จาก ตั้งล่วงหน้า เมนูทางด้านขวาของ บันทึกสำหรับเว็บ หน้าต่าง (ถ้ายังไม่ได้เลือก) ซึ่งจะแสดงภาพต้นฉบับของภาพต้นฉบับที่ยังไม่ได้ตัดต่อที่ด้านซ้าย
05 จาก 07ตั้งค่าการแสดงตัวอย่าง Optimized
คลิกที่รูปด้านขวาเพื่อเลือก เลือก JPEG สูง จาก ตั้งล่วงหน้า เมนู. ขณะนี้คุณสามารถเปรียบเทียบภาพที่ดีที่สุดทางด้านขวาซึ่งจะเป็นไฟล์สุดท้ายของคุณโดยมีภาพต้นฉบับอยู่ทางด้านซ้าย
06 จาก 07แก้ไขคุณภาพ JPEG
การตั้งค่าที่สำคัญที่สุดในคอลัมน์ด้านขวาคือ คุณภาพ ราคา. ในขณะที่คุณลดคุณภาพภาพของคุณดูซีดกว่า แต่ขนาดไฟล์ลดลงและไฟล์เล็กลงหมายถึงหน้าเว็บโหลดเร็วขึ้น
ลองเปลี่ยนคุณภาพเป็น 0 และสังเกตเห็นความแตกต่างของรูปภาพทางด้านซ้ายและด้านขวารวมทั้งขนาดไฟล์ที่เล็กกว่าซึ่งอยู่ใต้ภาพ
เป้าหมายคือการหาสื่อที่มีความสุขระหว่างขนาดและคุณภาพของไฟล์ คุณภาพระหว่าง 40 ถึง 60 มักเป็นช่วงที่ดีขึ้นอยู่กับความต้องการของคุณ ลองใช้ระดับคุณภาพที่ตั้งไว้ล่วงหน้า (JPEG Mediumตัวอย่างเช่น) เพื่อประหยัดเวลา
07 จาก 07บันทึกรูปภาพของคุณ
เมื่อคุณพอใจกับรูปด้านขวาแล้วให้คลิกที่ บันทึก ปุ่ม. บันทึก Optimized As เปิดหน้าต่าง พิมพ์ชื่อไฟล์เรียกดูโฟลเดอร์ที่ต้องการในคอมพิวเตอร์ของคุณแล้วคลิก บันทึก. ตอนนี้คุณมีภาพที่พร้อมใช้งานบนเว็บแล้ว