Reach

Grow

Manage

Automate

Reach

Grow

Manage

Automate

Pentingnya Ukuran File Email

Burung

27 Agu 2018

Email

1 min read

Pentingnya Ukuran File Email

Burung

27 Agu 2018

Email

1 min read

Pentingnya Ukuran File Email

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 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.

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.

Mari hubungkan Anda dengan pakar Bird.
Lihat kekuatan penuh dari Bird dalam 30 menit.

Dengan mengirimkan, Anda setuju Bird dapat menghubungi Anda tentang produk dan layanan kami.

Anda dapat berhenti berlangganan kapan saja. Lihat Pernyataan Privasi Bird untuk detail tentang pemrosesan data.

Perusahaan

Newsletter

Tetap terinformasi dengan Bird melalui pembaruan mingguan ke kotak masuk Anda.

Mari hubungkan Anda dengan pakar Bird.
Lihat kekuatan penuh dari Bird dalam 30 menit.

Dengan mengirimkan, Anda setuju Bird dapat menghubungi Anda tentang produk dan layanan kami.

Anda dapat berhenti berlangganan kapan saja. Lihat Pernyataan Privasi Bird untuk detail tentang pemrosesan data.

Perusahaan

Newsletter

Tetap terinformasi dengan Bird melalui pembaruan mingguan ke kotak masuk Anda.

Mari hubungkan Anda dengan pakar Bird.
Lihat kekuatan penuh dari Bird dalam 30 menit.

Dengan mengirimkan, Anda setuju Bird dapat menghubungi Anda tentang produk dan layanan kami.

Anda dapat berhenti berlangganan kapan saja. Lihat Pernyataan Privasi Bird untuk detail tentang pemrosesan data.

R

Reach

G

Grow

M

Manage

A

Automate

Perusahaan

Newsletter

Tetap terinformasi dengan Bird melalui pembaruan mingguan ke kotak masuk Anda.