Gambar Email Marketing: Ukuran, Bobot, dan Dark Mode

Baris subjek Anda memenangkan bukaan. Gambar produk Anda memenangkan kliknya — dengan asumsi ia tampil sama sekali. Email adalah lingkungan desain paling bermusuhan di dunia marketing: puluhan klien, masing-masing dengan mesin rendering sendiri, pengaturan blokir gambar sendiri, dan makin lama makin punya pendapat kuat sendiri soal dark mode.

Foto produk yang terlihat sempurna di perangkat desain Anda rutin tiba dalam keadaan rusak: melar melewati tata letaknya, terlalu berat untuk koneksi yang tersendat, digantikan kotak abu-abu kosong, atau — klasik zaman sekarang — PNG transparan yang diam-diam larut ke dalam background dark mode.

Berikut cara membereskan gambar email marketing: standar lebarnya, disiplin ukuran file, alt text yang benar-benar bekerja, dan solusi nyata untuk jebakan dark mode.

Seberapa Lebar Gambar Produk Email Seharusnya?

Lebar konten standar untuk email marketing adalah 600 piksel, dengan sebagian template modern meregang sampai 640. Angka itu bertahan karena panel pratinjau dan klien desktop lawas yang tak pernah menerima memo soal desain responsif. Rancanglah sesuai angka itu.

• Bidikan produk selebar penuh — ekspor pada 1200px, tampilkan pada 600. Ekspor 2x menjaga tepinya tetap tajam di layar berkerapatan tinggi tanpa mengubah tata letaknya.
• Grid multikolom — bagi area konten 600px-nya, lalu ekspor setiap gambar pada dua kali lebar tampilnya.
• Setel atribut width secara eksplisit — sebagian klien desktop mengabaikan penentuan ukuran lewat CSS dan menampilkan gambar pada dimensi aslinya, dan begitulah satu ekspor 2400px yang terlupakan meledakkan seluruh tata letak.

Lebih lebar bukan berarti lebih baik di sini. Gambar 600px yang tampil di mana saja mengalahkan mahakarya 1400px yang tidak tampil di mana pun.

Jaga Ukuran File Gambar Tetap Ramping

Setiap kilobyte adalah pajak yang dibayar pelanggan Anda di koneksi seluler, dan gambar utama yang lambat dimuat akan terlewat digulir sebelum sempat muncul.

• Targetkan di bawah 200 KB per gambar, dan lebih pelitlah untuk apa pun yang berada di paruh atas layar. Hasil potong produk yang bersih di atas background polos terkompresi dengan sangat baik.
• JPEG untuk fotografi, PNG untuk warna polos dan potongan. WebP terkompresi lebih baik daripada keduanya — remover.bg mengekspornya — tapi dukungan klien email masih tidak konsisten, jadi simpanlah master JPEG dan PNG untuk kampanye Anda.
• Kenali pemotongan Gmail. Gmail memotong email yang HTML-nya melampaui kira-kira 102 KB. Gambar yang di-hosting tidak dihitung dalam batas itu, tapi email yang terpotong menyembunyikan semua yang ada di bawah garis potongnya — jaga kodenya tetap ramping juga.

Tulis Alt Text untuk Gambar yang Diblokir

Instalasi Outlook di perusahaan dan pelanggan yang peduli privasi masih memblokir gambar secara bawaan. Saat itu terjadi, alt text adalah seluruh lapisan visual Anda.

• Deskripsikan produk dan intinya — "Set pour-over keramik Terra warna sage green" mengalahkan "image1.png" kira-kira sejauh jarak antara sebuah penjualan dan tombol hapus.
• Beri gaya — banyak klien menampilkan alt text sebagai teks hidup yang bisa Anda beri gaya secara inline: tentukan font, ukuran, dan warnanya agar gambar yang diblokir merosot menjadi sesuatu yang tetap terasa disengaja.
• Jangan pernah mengurung informasi penting di dalam piksel — harga, tenggat, dan CTA tempatnya di teks sungguhan. Kalau gambarnya diblokir, penawarannya harus tetap bekerja.

Jebakan Dark Mode: PNG Transparan di Klien Email Gelap

Inilah jebakannya. Anda mengekspor hasil potong produk yang bersih sebagai PNG transparan — pilihan yang tepat untuk hampir semua kanal lain, seperti dijelaskan panduan PNG transparan kami — lalu menaruhnya di email yang dirancang di atas putih. Kemudian klien emailnya membalik background itu menjadi nyaris hitam untuk pengguna dark mode. Headphone hitam arang Anda berubah jadi garis samar. Teks logo hitam Anda lenyap. Dan tepi anti-aliasing-nya, yang dulu dipadukan dengan asumsi latar putih, berpendar dengan halo pucat.

Lebih parah lagi, para klien email tidak sepakat soal apa arti dark mode: sebagian membiarkan warna Anda apa adanya, sebagian hanya membalik background, sebagian mengecat ulang hampir semuanya. Anda tidak bisa mengendalikan klien mana yang dipakai pelanggan, jadi buatlah potongan yang sanggup bertahan di semuanya.

• Tanamkan background solid yang selaras — ratakan potongannya ke atas warna merek yang Anda pilih dengan sengaja alih-alih mengirim transparansi. Taruh di atas warna solid di editor remover.bg dan klien emailnya tak punya apa pun untuk dibalik. Panduan kami tentang warna background foto produk membantu Anda memilih nada yang bertahan di kedua mode.
• Tambahkan garis tepi dan padding — garis tipis halus atau bayangan lembut di sekeliling produk bertepi gelap menjaganya tetap terbaca sekalipun kanvasnya dicat ulang. Padding yang lapang mencegah pemangkasan yang terlalu rapat bertabrakan dengan apa pun yang dilakukan klien emailnya di sekitar gambar.
• Uji di klien sungguhan — kirim email uji sungguhan ke Apple Mail, Gmail, dan Outlook dengan dark mode menyala sebelum setiap kampanye. Apa yang dihormati satu klien, dicat ulang dengan riang oleh klien lain.

Jaga Potongan Produk Tetap Konsisten Sepanjang Kampanye

Kampanye jarang cuma satu email. Peluncuran, sorotan produk, pengingat kesempatan terakhir — produk yang sama muncul empat atau lima kali, dan kalau perlakuannya bergeser antar pengiriman (background putih di sini, abu-abu di sana, bayangan menyala, bayangan mati), rangkaiannya terasa seperti dijahit dari suku cadang seadanya.

Kunci satu perlakuan dan terapkan di mana-mana: satu warna background, satu aturan skala untuk seberapa besar produk mengisi bingkainya, satu gaya bayangan — editor remover.bg menambahkan bayangan realistis agar potongannya duduk di dalam bingkai alih-alih mengambang. Untuk katalog besar, HTTP API-nya menerapkan pemrosesan yang identik ke setiap bidikan secara otomatis, logika otomasi yang sama yang diam-diam sedang membentuk ulang AI dalam e-commerce.

Intinya

Gambar email hidup atau mati oleh empat keputusan yang diambil sebelum Anda menekan kirim:

1. Lebar — rancang pada 600px, ekspor pada 2x.
2. Bobot — di bawah 200 KB per gambar, JPEG atau PNG untuk dukungan maksimal.
3. Alt text — deskriptif, diberi gaya, tak pernah menyembunyikan penawarannya.
4. Dark mode — tanamkan background, beri garis tepi pada sisi yang gelap, uji di klien sungguhan.

Benarkan keempatnya dan produk Anda akan terlihat disengaja di setiap kotak masuk — mode terang, dark mode, gambar diblokir atau tidak. Itu lebih dari yang bisa diklaim kebanyakan kampanye.