Pentingnya Ukuran File Email

Burung

27 Agu 2018

Email

1 min read

Pentingnya Ukuran File Email

Intisari Utama

    • Premise: Efektivitas dari kampanye email sangat bergantung pada ukuran file — baik untuk kelayakan pengiriman dan pengalaman pengguna. Aset HTML atau gambar yang terlalu besar dapat menyebabkan pemotongan, waktu muat yang lambat, dan keterlibatan yang lebih rendah, terutama pada perangkat seluler.

    • Goal: Membantu pemasar menyeimbangkan ambisi desain dengan kendala teknis dengan mengoptimalkan HTML, aset eksternal, dan ukuran keseluruhan yang terisi penuh.

    • Highlights:

      1. Ukuran file HTML:

        • Jaga di bawah 100 KB untuk menghindari pemotongan di Gmail (target ideal ≈ 50 KB).

        • HTML yang terlalu besar dapat merusak tata letak dan mempengaruhi kelayakan pengiriman.

        • Kurangi ukuran melalui:

          • Pembersihan kode (hapus markup yang usang dan elemen yang tidak terpakai).

          • Menghindari penumpukan tabel yang berlebihan — 5–10 tabel biasanya cukup.

          • Memindahkan gaya inline yang aman ke CSS yang tersemat jika memungkinkan.

          • Menyederhanakan tata letak (desain kolom tunggal) dan meminimalkan kode.

      2. Aset eksternal (terutama gambar):

        • Maksimum yang direkomendasikan = 100 KB per gambar; GIF animasi bisa mencapai 500 KB.

        • Optimalkan dengan ImageOptim, Caesium, atau kompresi CDN.

        • Pilih format yang benar: JPG untuk foto, GIF untuk grafik, PNG untuk transparansi.

        • Gunakan lebih sedikit gambar yang lebih ringan — display :none masih mengunduh aset.

      3. Ukuran keseluruhan yang terisi penuh:

        • Total muatan ideal ≤ 1 MB untuk kinerja yang mulus.

        • Pada jaringan 3G, email besar dapat memakan waktu 2–14 detik untuk dimuat; bahkan lebih lama pada 2G.

        • Optimalkan untuk pengguna yang lambat atau data terbatas (terutama di daerah berkembang).

      4. Pengujian dan keseimbangan:

        • Uji A/B untuk menemukan trade-off antara kekayaan visual dan kinerja.

        • Pastikan email tetap bisa terbaca tanpa gambar untuk muatan yang lebih cepat terasa.

        • Optimasi ukuran yang buruk dapat memperburuk masalah kelayakan pengiriman dan keterlibatan.

      5. Outcome: Kode yang bersih, kompakt, dan media yang dioptimalkan mengarah pada pemuatan yang lebih cepat, penempatan inbox yang lebih tinggi, dan pengalaman pengguna yang lebih baik di seluruh perangkat.

Sorotan Q&A

  • Mengapa ukuran file email penting?

    Email besar berisiko terpotong di Gmail dan menyebabkan waktu muat yang lama — keduanya merugikan interaksi dan kemampuan pengiriman.

  • Berapa ukuran HTML maksimum yang direkomendasikan?

    Jaga HTML Anda di bawah 100 KB (idealnya < 50 KB). Gmail memotong pesan pada 102 KB.

  • Bagaimana saya dapat mengurangi ukuran HTML saya?

    Hapus kode yang berlebihan, minimalkan penyusunan tabel, konsolidasikan CSS, dan minifikasikan dengan aman.

  • Apa cara terbaik untuk menangani berat gambar?

    Kompres file menggunakan CDNs atau alat optimasi, gunakan format yang tepat, dan batasi setiap file hingga ≤ 100 KB.

  • Bagaimana saya dapat memastikan aksesibilitas untuk pengguna dengan koneksi lambat?

    Jaga ukuran email total < 1 MB, desain untuk penampilan tanpa gambar, dan prioritaskan pemuatan konten esensial terlebih dahulu.

  • Apa tujuan akhir dari optimasi ukuran email?

    Untuk menyeimbangkan kualitas desain, keterkiriman, dan kecepatan — menghasilkan tingkat buka dan klik yang lebih tinggi.

Ketika berbicara tentang ukuran file dalam email, kita sebenarnya membicarakan 3 topik: ukuran file HTML yang dikirim, ukuran aset eksternal, dan ukuran penuh setelah sepenuhnya dimuat. Kita ingin menjaga semua ukuran file ini sekecil mungkin, tetapi berapa ukuran maksimum dan apa yang harus kita targetkan?

Ukuran File HTML

Ukuran file HTML adalah ukuran file .html yang sebenarnya dikirim. Ukuran file ini tidak termasuk ukuran gambar yang disertakan, karena gambar-gambar tersebut akan ditautkan dari file html ini dan diunduh saat dibuka.

Ukuran maksimum yang kami rekomendasikan adalah 100KB, karena apa pun yang lebih dari itu dapat menyebabkan masalah pengiriman dan tampilan. Misalnya, Gmail akan memotong html Anda pada 102KB. Pemotongan akan menyembunyikan akhir email Anda dan dapat merusak tata letaknya. Penanganan email oleh Gmail memiliki pertimbangan lain juga, seperti dampak prefetching gambar pada pelacakan email.

Kebanyakan email harus dapat dengan mudah kurang dari 50KB. Namun, terkadang peningkatan progresif yang kompleks atau sejumlah besar konten kampanye menghasilkan ukuran file yang lebih besar. Jika ini terjadi, ada beberapa cara untuk membantu mengurangi ukuran file HTML Anda.

  • Bersihkan kode Anda. Email terus berubah dan kami melihat banyak template dengan kode usang di dalamnya. Pembersihan cepat dapat menghemat beberapa KB.

  • Jangan terlalu banyak kode. Beberapa template yang kami lihat memiliki kode tambahan yang sebenarnya tidak diperlukan. Untuk panduan membuat template yang efisien, lihat panduan kami tentang template email lanjutan. Pelaku terburuk adalah penambahan elemen tabel tambahan. Sebagian besar tata letak dapat dicapai dengan 5-10 tabel, tetapi kami sering melihat kode dengan 30-40 tabel. Lebih sedikit tabel juga memiliki manfaat tambahan dengan membuat kode Anda lebih mudah dibaca.

  • Pindahkan beberapa kode dari HTML ke CSS. Belum aman untuk memindahkan semua gaya Anda ke CSS, tetapi jika dilakukan dengan benar, memindahkan beberapa gaya inline ke gaya yang diembed dapat membantu mengurangi kode.

  • Sederhanakan desain Anda. Opsi lain adalah kembali ke tahap desain. Email kolom tunggal menggunakan lebih sedikit kode.

  • Perkecil kode Anda. Perkecilan kode akan menghapus spasi dan komentar yang tidak perlu. Ini dapat memiliki efek besar namun berhati-hatilah karena banyak ESP memberlakukan panjang baris maksimum yang dapat memaksa baris baru dan merusak kode.

Ukuran file HTML adalah ukuran file .html yang sebenarnya dikirim. Ukuran file ini tidak termasuk ukuran gambar yang disertakan, karena gambar-gambar tersebut akan ditautkan dari file html ini dan diunduh saat dibuka.

Ukuran maksimum yang kami rekomendasikan adalah 100KB, karena apa pun yang lebih dari itu dapat menyebabkan masalah pengiriman dan tampilan. Misalnya, Gmail akan memotong html Anda pada 102KB. Pemotongan akan menyembunyikan akhir email Anda dan dapat merusak tata letaknya. Penanganan email oleh Gmail memiliki pertimbangan lain juga, seperti dampak prefetching gambar pada pelacakan email.

Kebanyakan email harus dapat dengan mudah kurang dari 50KB. Namun, terkadang peningkatan progresif yang kompleks atau sejumlah besar konten kampanye menghasilkan ukuran file yang lebih besar. Jika ini terjadi, ada beberapa cara untuk membantu mengurangi ukuran file HTML Anda.

  • Bersihkan kode Anda. Email terus berubah dan kami melihat banyak template dengan kode usang di dalamnya. Pembersihan cepat dapat menghemat beberapa KB.

  • Jangan terlalu banyak kode. Beberapa template yang kami lihat memiliki kode tambahan yang sebenarnya tidak diperlukan. Untuk panduan membuat template yang efisien, lihat panduan kami tentang template email lanjutan. Pelaku terburuk adalah penambahan elemen tabel tambahan. Sebagian besar tata letak dapat dicapai dengan 5-10 tabel, tetapi kami sering melihat kode dengan 30-40 tabel. Lebih sedikit tabel juga memiliki manfaat tambahan dengan membuat kode Anda lebih mudah dibaca.

  • Pindahkan beberapa kode dari HTML ke CSS. Belum aman untuk memindahkan semua gaya Anda ke CSS, tetapi jika dilakukan dengan benar, memindahkan beberapa gaya inline ke gaya yang diembed dapat membantu mengurangi kode.

  • Sederhanakan desain Anda. Opsi lain adalah kembali ke tahap desain. Email kolom tunggal menggunakan lebih sedikit kode.

  • Perkecil kode Anda. Perkecilan kode akan menghapus spasi dan komentar yang tidak perlu. Ini dapat memiliki efek besar namun berhati-hatilah karena banyak ESP memberlakukan panjang baris maksimum yang dapat memaksa baris baru dan merusak kode.

Ukuran file HTML adalah ukuran file .html yang sebenarnya dikirim. Ukuran file ini tidak termasuk ukuran gambar yang disertakan, karena gambar-gambar tersebut akan ditautkan dari file html ini dan diunduh saat dibuka.

Ukuran maksimum yang kami rekomendasikan adalah 100KB, karena apa pun yang lebih dari itu dapat menyebabkan masalah pengiriman dan tampilan. Misalnya, Gmail akan memotong html Anda pada 102KB. Pemotongan akan menyembunyikan akhir email Anda dan dapat merusak tata letaknya. Penanganan email oleh Gmail memiliki pertimbangan lain juga, seperti dampak prefetching gambar pada pelacakan email.

Kebanyakan email harus dapat dengan mudah kurang dari 50KB. Namun, terkadang peningkatan progresif yang kompleks atau sejumlah besar konten kampanye menghasilkan ukuran file yang lebih besar. Jika ini terjadi, ada beberapa cara untuk membantu mengurangi ukuran file HTML Anda.

  • Bersihkan kode Anda. Email terus berubah dan kami melihat banyak template dengan kode usang di dalamnya. Pembersihan cepat dapat menghemat beberapa KB.

  • Jangan terlalu banyak kode. Beberapa template yang kami lihat memiliki kode tambahan yang sebenarnya tidak diperlukan. Untuk panduan membuat template yang efisien, lihat panduan kami tentang template email lanjutan. Pelaku terburuk adalah penambahan elemen tabel tambahan. Sebagian besar tata letak dapat dicapai dengan 5-10 tabel, tetapi kami sering melihat kode dengan 30-40 tabel. Lebih sedikit tabel juga memiliki manfaat tambahan dengan membuat kode Anda lebih mudah dibaca.

  • Pindahkan beberapa kode dari HTML ke CSS. Belum aman untuk memindahkan semua gaya Anda ke CSS, tetapi jika dilakukan dengan benar, memindahkan beberapa gaya inline ke gaya yang diembed dapat membantu mengurangi kode.

  • Sederhanakan desain Anda. Opsi lain adalah kembali ke tahap desain. Email kolom tunggal menggunakan lebih sedikit kode.

  • Perkecil kode Anda. Perkecilan kode akan menghapus spasi dan komentar yang tidak perlu. Ini dapat memiliki efek besar namun berhati-hatilah karena banyak ESP memberlakukan panjang baris maksimum yang dapat memaksa baris baru dan merusak kode.

Ukuran External Assets

Ukuran aset eksternal adalah ukuran dari semua gambar dan lembar gaya eksternal Anda. Karena ukuran eksternal jarang terjadi, kita akan fokus lebih pada gambar untuk saat ini.

Jika Anda menggunakan gambar latar belakang dan kueri media maka ada kemungkinan di lingkungan tertentu tidak semuanya akan diunduh untuk setiap pengguna. Namun, ingat meskipun Anda mendefinisikan display:none;  pada elemen <img> , itu tetap akan diunduh. Saat ini tidak ada cara untuk menghentikan ini.

Ukuran maksimum untuk kebanyakan gambar adalah 100KB, tetapi jika Anda memiliki satu gambar resolusi tinggi atau gif animasi yang besar itu bisa mencapai 500KB. Memahami masalah kinerja email sering kali memerlukan membaca header email untuk pemecahan masalah. Namun, ini lebih tentang ukuran total, yang akan kita bahas di bagian ukuran email penuh yang dimuat.

Ada banyak sumber daya yang tersedia untuk membantu dengan kompresi ukuran gambar:

  • ImageOptim – di Mac, atau sebagai layanan web

  • Caesium – di Windows

  • CDN –  Banyak CDN memiliki optimasi gambar bawaan. Beberapa bahkan akan menyesuaikan kompresi tergantung pada bandwidth yang tersedia.

Berikut beberapa tips lain yang kami rekomendasikan:

  • Pastikan Anda menggunakan format yang paling sesuai, .jpg untuk foto, .gif untuk grafik dan .png saat Anda memerlukan saluran alfa

  • Sederhanakan desain Anda. Kembali lagi ke tahap desain untuk menggunakan lebih sedikit gambar, gambar yang lebih kecil, atau gambar yang lebih sederhana yang dapat dikompresi ke ukuran yang lebih kecil.

Ukuran aset eksternal adalah ukuran dari semua gambar dan lembar gaya eksternal Anda. Karena ukuran eksternal jarang terjadi, kita akan fokus lebih pada gambar untuk saat ini.

Jika Anda menggunakan gambar latar belakang dan kueri media maka ada kemungkinan di lingkungan tertentu tidak semuanya akan diunduh untuk setiap pengguna. Namun, ingat meskipun Anda mendefinisikan display:none;  pada elemen <img> , itu tetap akan diunduh. Saat ini tidak ada cara untuk menghentikan ini.

Ukuran maksimum untuk kebanyakan gambar adalah 100KB, tetapi jika Anda memiliki satu gambar resolusi tinggi atau gif animasi yang besar itu bisa mencapai 500KB. Memahami masalah kinerja email sering kali memerlukan membaca header email untuk pemecahan masalah. Namun, ini lebih tentang ukuran total, yang akan kita bahas di bagian ukuran email penuh yang dimuat.

Ada banyak sumber daya yang tersedia untuk membantu dengan kompresi ukuran gambar:

  • ImageOptim – di Mac, atau sebagai layanan web

  • Caesium – di Windows

  • CDN –  Banyak CDN memiliki optimasi gambar bawaan. Beberapa bahkan akan menyesuaikan kompresi tergantung pada bandwidth yang tersedia.

Berikut beberapa tips lain yang kami rekomendasikan:

  • Pastikan Anda menggunakan format yang paling sesuai, .jpg untuk foto, .gif untuk grafik dan .png saat Anda memerlukan saluran alfa

  • Sederhanakan desain Anda. Kembali lagi ke tahap desain untuk menggunakan lebih sedikit gambar, gambar yang lebih kecil, atau gambar yang lebih sederhana yang dapat dikompresi ke ukuran yang lebih kecil.

Ukuran aset eksternal adalah ukuran dari semua gambar dan lembar gaya eksternal Anda. Karena ukuran eksternal jarang terjadi, kita akan fokus lebih pada gambar untuk saat ini.

Jika Anda menggunakan gambar latar belakang dan kueri media maka ada kemungkinan di lingkungan tertentu tidak semuanya akan diunduh untuk setiap pengguna. Namun, ingat meskipun Anda mendefinisikan display:none;  pada elemen <img> , itu tetap akan diunduh. Saat ini tidak ada cara untuk menghentikan ini.

Ukuran maksimum untuk kebanyakan gambar adalah 100KB, tetapi jika Anda memiliki satu gambar resolusi tinggi atau gif animasi yang besar itu bisa mencapai 500KB. Memahami masalah kinerja email sering kali memerlukan membaca header email untuk pemecahan masalah. Namun, ini lebih tentang ukuran total, yang akan kita bahas di bagian ukuran email penuh yang dimuat.

Ada banyak sumber daya yang tersedia untuk membantu dengan kompresi ukuran gambar:

  • ImageOptim – di Mac, atau sebagai layanan web

  • Caesium – di Windows

  • CDN –  Banyak CDN memiliki optimasi gambar bawaan. Beberapa bahkan akan menyesuaikan kompresi tergantung pada bandwidth yang tersedia.

Berikut beberapa tips lain yang kami rekomendasikan:

  • Pastikan Anda menggunakan format yang paling sesuai, .jpg untuk foto, .gif untuk grafik dan .png saat Anda memerlukan saluran alfa

  • Sederhanakan desain Anda. Kembali lagi ke tahap desain untuk menggunakan lebih sedikit gambar, gambar yang lebih kecil, atau gambar yang lebih sederhana yang dapat dikompresi ke ukuran yang lebih kecil.

Ukuran Email yang Sepenuhnya Dimuat

Ini adalah ukuran gabungan dari semuanya ketika email dibuka dan semuanya diunduh. Ini dapat bervariasi tergantung pada lingkungan di mana email dibuka.

Masalah utama di sini adalah waktu yang dibutuhkan untuk memuat email. Anda mungkin menguji email Anda di kantor dengan koneksi yang sangat cepat tetapi banyak penerima Anda mungkin menggunakan perangkat seluler dengan koneksi 3G yang lambat.

Dengan koneksi yang baik, ukuran email total 1mb akan dimuat dalam hitungan detik dan tampak seketika bagi pengguna. Namun, pada koneksi 3G, dapat memakan waktu antara 2 hingga 14 detik untuk memuat email penuh. Dan, jika audiens target Anda kemungkinan besar menggunakan koneksi 2G, unduhan tersebut dapat memakan waktu beberapa menit. Ketika email dimuat dengan lambat, baris subjek yang menarik menjadi lebih kritis untuk keterlibatan.

Ini juga merupakan masalah potensial dengan pengguna yang memiliki paket data terbatas yang harus mempertimbangkan setiap MB yang mereka unduh. Ini sangat penting di negara berkembang.

Beberapa hal yang dapat Anda lakukan untuk membantu:

Pertama, lihat semua rekomendasi yang kami sebutkan mengenai optimisasi ukuran html dan gambar
Jika Anda memiliki waktu, selalu baik bereksperimen dengan kode dan menguji apa yang benar-benar dibutuhkan dan apa yang bisa Anda hilangkan. Bereksperimen dengan gambar dan coba berbagai cara untuk mengompresnya. Pastikan email Anda terlihat baik dan masuk akal tanpa gambar, sehingga pengguna Anda dapat mulai melihat email Anda sambil menunggu gambar muncul.

Ini adalah ukuran gabungan dari semuanya ketika email dibuka dan semuanya diunduh. Ini dapat bervariasi tergantung pada lingkungan di mana email dibuka.

Masalah utama di sini adalah waktu yang dibutuhkan untuk memuat email. Anda mungkin menguji email Anda di kantor dengan koneksi yang sangat cepat tetapi banyak penerima Anda mungkin menggunakan perangkat seluler dengan koneksi 3G yang lambat.

Dengan koneksi yang baik, ukuran email total 1mb akan dimuat dalam hitungan detik dan tampak seketika bagi pengguna. Namun, pada koneksi 3G, dapat memakan waktu antara 2 hingga 14 detik untuk memuat email penuh. Dan, jika audiens target Anda kemungkinan besar menggunakan koneksi 2G, unduhan tersebut dapat memakan waktu beberapa menit. Ketika email dimuat dengan lambat, baris subjek yang menarik menjadi lebih kritis untuk keterlibatan.

Ini juga merupakan masalah potensial dengan pengguna yang memiliki paket data terbatas yang harus mempertimbangkan setiap MB yang mereka unduh. Ini sangat penting di negara berkembang.

Beberapa hal yang dapat Anda lakukan untuk membantu:

Pertama, lihat semua rekomendasi yang kami sebutkan mengenai optimisasi ukuran html dan gambar
Jika Anda memiliki waktu, selalu baik bereksperimen dengan kode dan menguji apa yang benar-benar dibutuhkan dan apa yang bisa Anda hilangkan. Bereksperimen dengan gambar dan coba berbagai cara untuk mengompresnya. Pastikan email Anda terlihat baik dan masuk akal tanpa gambar, sehingga pengguna Anda dapat mulai melihat email Anda sambil menunggu gambar muncul.

Ini adalah ukuran gabungan dari semuanya ketika email dibuka dan semuanya diunduh. Ini dapat bervariasi tergantung pada lingkungan di mana email dibuka.

Masalah utama di sini adalah waktu yang dibutuhkan untuk memuat email. Anda mungkin menguji email Anda di kantor dengan koneksi yang sangat cepat tetapi banyak penerima Anda mungkin menggunakan perangkat seluler dengan koneksi 3G yang lambat.

Dengan koneksi yang baik, ukuran email total 1mb akan dimuat dalam hitungan detik dan tampak seketika bagi pengguna. Namun, pada koneksi 3G, dapat memakan waktu antara 2 hingga 14 detik untuk memuat email penuh. Dan, jika audiens target Anda kemungkinan besar menggunakan koneksi 2G, unduhan tersebut dapat memakan waktu beberapa menit. Ketika email dimuat dengan lambat, baris subjek yang menarik menjadi lebih kritis untuk keterlibatan.

Ini juga merupakan masalah potensial dengan pengguna yang memiliki paket data terbatas yang harus mempertimbangkan setiap MB yang mereka unduh. Ini sangat penting di negara berkembang.

Beberapa hal yang dapat Anda lakukan untuk membantu:

Pertama, lihat semua rekomendasi yang kami sebutkan mengenai optimisasi ukuran html dan gambar
Jika Anda memiliki waktu, selalu baik bereksperimen dengan kode dan menguji apa yang benar-benar dibutuhkan dan apa yang bisa Anda hilangkan. Bereksperimen dengan gambar dan coba berbagai cara untuk mengompresnya. Pastikan email Anda terlihat baik dan masuk akal tanpa gambar, sehingga pengguna Anda dapat mulai melihat email Anda sambil menunggu gambar muncul.

Menggabungkan Semuanya

Dengan ukuran file, seperti banyak hal lainnya, semuanya bermuara pada kompromi. Anda mungkin melakukan pengujian A/B dan menemukan bahwa gambar resolusi tinggi yang besar berkinerja baik. Anda mungkin menemukan bahwa banyak konten terperinci berkinerja baik. Anda mungkin menemukan bahwa interaktivitas yang kompleks berkinerja baik. Namun, ketika Anda menempatkan ketiganya ke dalam satu kampanye– Anda mungkin melihat bahwa kinerja mulai memburuk. Masalah kinerja email juga dapat berasal dari masalah keterkiriman seperti typographical email address.

Dengan ukuran file, seperti banyak hal lainnya, semuanya bermuara pada kompromi. Anda mungkin melakukan pengujian A/B dan menemukan bahwa gambar resolusi tinggi yang besar berkinerja baik. Anda mungkin menemukan bahwa banyak konten terperinci berkinerja baik. Anda mungkin menemukan bahwa interaktivitas yang kompleks berkinerja baik. Namun, ketika Anda menempatkan ketiganya ke dalam satu kampanye– Anda mungkin melihat bahwa kinerja mulai memburuk. Masalah kinerja email juga dapat berasal dari masalah keterkiriman seperti typographical email address.

Dengan ukuran file, seperti banyak hal lainnya, semuanya bermuara pada kompromi. Anda mungkin melakukan pengujian A/B dan menemukan bahwa gambar resolusi tinggi yang besar berkinerja baik. Anda mungkin menemukan bahwa banyak konten terperinci berkinerja baik. Anda mungkin menemukan bahwa interaktivitas yang kompleks berkinerja baik. Namun, ketika Anda menempatkan ketiganya ke dalam satu kampanye– Anda mungkin melihat bahwa kinerja mulai memburuk. Masalah kinerja email juga dapat berasal dari masalah keterkiriman seperti typographical email address.

Berita lainnya

Baca lebih lanjut dari kategori ini

A person is standing at a desk while typing on a laptop.

Platform AI-native lengkap yang berkembang bersama bisnis Anda.

© 2025 Bird

A person is standing at a desk while typing on a laptop.

Platform AI-native lengkap yang berkembang bersama bisnis Anda.

© 2025 Bird