ขนาดรูปภาพสำหรับเว็บไซต์ อีเมล และโซเชียลมีเดีย
ตารางอ้างอิงขนาดพิกเซลและอัตราส่วนภาพสำหรับหน้าเว็บ ภาพตัวอย่างลิงก์ อีเมล และโซเชียลมีเดียหลักทุกแพลตฟอร์ม
การอัปโหลดรูปภาพผิดขนาดหมายถึงผลลัพธ์ที่เบลอ ตัวแบบถูกครอป หรือหน้าเว็บที่โหลดช้า เอกสารอ้างอิงนี้รวบรวมขนาดที่ใช้ได้ดีในปี 2026 พร้อมอธิบายเหตุผล เพื่อให้คุณตัดสินใจได้อย่างสมเหตุสมผลเมื่อแพลตฟอร์มเปลี่ยนกฎ
หลักการสองข้อ
ทำให้ตรงกับขนาดที่แสดงผล โดยเผื่อหน้าจอความละเอียดสูง ปัจจุบันมือถือและแล็ปท็อปส่วนใหญ่มีหน้าจอที่มีพิกเซลจริงสองหรือสามพิกเซลต่อหนึ่ง CSS pixel รูปภาพที่แสดงกว้าง 600 CSS pixel ควรกว้าง 1,200 พิกเซลจึงจะคมชัด การเกิน 2× จะเพิ่มขนาดไฟล์โดยไม่ได้ประโยชน์ที่มองเห็นได้
ตั้งอัตราส่วนภาพให้ถูกก่อนเรื่องจำนวนพิกเซล แพลตฟอร์มจะครอปภาพเป็นอัตราส่วนที่ต้องการโดยอัตโนมัติ และการครอปอัตโนมัติมักตัดศีรษะและโลโก้ทิ้ง ให้ครอปตามอัตราส่วนเองด้วย เครื่องมือครอปรูปภาพ แล้วปรับขนาดด้วย เครื่องมือปรับขนาดรูปภาพ
รูปภาพบนเว็บไซต์
| การใช้งาน | ความกว้าง | อัตราส่วน | ขนาดไฟล์เป้าหมาย |
|---|---|---|---|
| ภาพฮีโร่เต็มความกว้าง | 1,920 px (2,560 สำหรับหน้าจอขนาดใหญ่มาก) | 16:9 หรือ 21:9 | ต่ำกว่า 300 KB เมื่อเป็น WebP |
| รูปในเนื้อหา / บล็อก | 1,200 ถึง 1,600 px | 3:2 หรือ 16:9 | ต่ำกว่า 150 KB |
| ภาพย่อในการ์ดหรือกริด | 600 ถึง 800 px | เท่ากันทั้งกริด | ต่ำกว่า 60 KB |
| รูปสินค้า | 1,200 ถึง 2,000 px | 1:1 หรือ 4:5 | ต่ำกว่า 200 KB ใหญ่กว่านี้ได้ถ้าต้องซูม |
| โลโก้ (แรสเตอร์) | 2× ของขนาดที่แสดง | ตามที่ออกแบบ | PNG หรือ SVG |
| Open Graph / ภาพตัวอย่างลิงก์ | 1,200 × 630 px | 1.91:1 | ต่ำกว่า 300 KB, JPG หรือ PNG |
| Favicon | 16, 32, 48, 64 px ในไฟล์ .ico เดียว | 1:1 | เล็กมาก |
| Apple touch icon | 180 × 180 px | 1:1 | PNG |
อีเมล
โปรแกรมอีเมลแสดงผลที่ความกว้างคงที่ โดยทั่วไป 600 ถึง 640 พิกเซลสำหรับเนื้อหาข้อความ ให้ใช้รูปภาพกว้าง 1,200 px (2× สำหรับจอ retina) และให้อีเมลทั้งฉบับมีขนาดไม่เกินประมาณ 1 MB อีเมลที่หนักกว่านี้จะถูก Gmail ตัดเนื้อหา และเปิดช้าบนมือถือ ใช้ JPG หรือ PNG เพราะการรองรับ WebP ในโปรแกรมอีเมลยังไม่สม่ำเสมอ ส่วน GIF ใช้ได้กับภาพเคลื่อนไหวง่าย ๆ
โซเชียลมีเดีย
| แพลตฟอร์ม | ตำแหน่ง | ขนาด | อัตราส่วน |
|---|---|---|---|
| ฟีด, แนวตั้ง (เข้าถึงคนได้มากที่สุด) | 1,080 × 1,350 | 4:5 | |
| ฟีด, สี่เหลี่ยมจัตุรัส | 1,080 × 1,080 | 1:1 | |
| ปก Stories / Reels | 1,080 × 1,920 | 9:16 | |
| รูปโปรไฟล์ | 320 × 320 (แสดงเป็นวงกลม) | 1:1 | |
| รูปในฟีด | 1,200 × 630 หรือ 1,080 × 1,350 | 1.91:1 หรือ 4:5 | |
| ภาพปกเพจ | 1,640 × 856 | แสดงที่ 820 × 312 บนคอมพิวเตอร์ | |
| รูปในโพสต์ | 1,200 × 627 | 1.91:1 | |
| แบนเนอร์บริษัท | 1,128 × 191 | ~5.9:1 | |
| X (Twitter) | รูปในโพสต์ | 1,600 × 900 | 16:9 |
| X (Twitter) | ภาพส่วนหัว | 1,500 × 500 | 3:1 |
| YouTube | ภาพปกวิดีโอ | 1,280 × 720 | 16:9, ต่ำกว่า 2 MB |
| YouTube | แบนเนอร์ช่อง | 2,560 × 1,440 (พื้นที่ปลอดภัย 1,546 × 423) | 16:9 |
| TikTok | ปกวิดีโอ | 1,080 × 1,920 | 9:16 |
| Pin | 1,000 × 1,500 | 2:3 | |
| WhatsApp / Telegram | รูปโปรไฟล์ | 640 × 640 | 1:1 |
โซเชียลมีเดียทุกแพลตฟอร์มบีบอัดไฟล์ที่อัปโหลดซ้ำ โดยมักเป็น JPG ที่คุณภาพประมาณ 75 ถึง 80 ให้อัปโหลดด้วยคุณภาพสูง (JPG 90 หรือ PNG) ในขนาดตามตารางด้านบนพอดี แล้วปล่อยให้แพลตฟอร์มบีบอัดรอบสุดท้ายเพียงครั้งเดียว แทนที่จะบีบอัดเองซ้อนทับกับของแพลตฟอร์ม ถ้าต้องการดูหน้าตาโพสต์ก่อนเผยแพร่ ให้ใช้ ม็อกอัปโพสต์
งานพิมพ์ เพื่อความครบถ้วน
งานพิมพ์วัดเป็นพิกเซลต่อนิ้ว ไม่ใช่จำนวนพิกเซลทั้งหมด มาตรฐานคือ 300 ppi ภาพถ่ายขนาด 6 × 4 นิ้วต้องใช้ 1,800 × 1,200 px หน้ากระดาษ A4 ต้องใช้ 2,480 × 3,508 px และโปสเตอร์ A3 ต้องใช้ 3,508 × 4,961 px อะไรที่ต่ำกว่า 150 ppi จะดูไม่คมชัดอย่างเห็นได้ชัดเมื่อพิมพ์ ให้ใช้ JPG ที่คุณภาพ 95 หรือฟอร์แมตแบบ lossless
ขั้นตอนทำงานแบบรวดเร็ว
- ครอปให้ได้อัตราส่วนที่ปลายทางต้องการ
- ปรับขนาดให้ได้ความกว้างตามตาราง และอย่าให้ใหญ่เกิน 2× ของขนาดที่แสดงผล
- ส่งออกเป็น WebP สำหรับเว็บไซต์ JPG สำหรับอีเมลและโซเชียลมีเดีย และ PNG สำหรับกราฟิกที่มีพื้นหลังโปร่งใส
- ตรวจสอบขนาดไฟล์ ถ้าเกินเป้าหมาย ให้ลดคุณภาพลงสักเล็กน้อยแทนการลดขนาดพิกเซล
ทั้งสี่ขั้นตอนทำได้บนเว็บไซต์นี้โดยไม่ต้องอัปโหลดรูปภาพไปที่ไหนเลย