Membantu! Email Saya Rusak: Kesalahan Umum + Perbaikan

Diterbitkan: 2017-04-18

Dunia email penuh dengan potensi jebakan. Dukungan untuk teknik dapat hilang tanpa peringatan, dan perubahan mendadak pada mesin rendering klien email mempersulit pemasar email untuk memahami apa yang akan berhasil di mana. Apa yang mungkin terlihat bagus di Apple Mail bisa menjadi mimpi buruk di Outlook atau Gmail. Apa yang tampak sempurna hari ini mungkin rusak besok. Selain itu, versi kotak masuk, pembaruan aplikasi, dan perubahan browser dapat memengaruhi tampilan email.

Langkah pertama dalam mendesain pada tenggat waktu adalah mempersiapkan yang terburuk. Memiliki perlindungan yang dibangun ke dalam template Anda untuk menutupi masalah besar yang mungkin Anda temui. —Logan Baird, Emma

Kami telah mengumpulkan beberapa masalah umum yang mungkin Anda temukan, dan cara memasukkan pengamanan ke dalam kampanye email Anda berikutnya. Secara umum, itu turun ke…

HTML atau CSS yang tidak didukung di klien email

Tidak mengherankan bahwa setiap klien email berbeda. Tetapi ketika Anda mengerjakan 10.000 hal lain sekaligus, mengikuti perubahan mendadak adalah yang paling tidak Anda khawatirkan. Bahkan ketika dukungan tidak berubah, klien email menafsirkan kode Anda secara berbeda. Lihat sendiri bagaimana email standar dapat terlihat sangat berbeda di seluruh klien dalam pratinjau ini dari Daftar Periksa Litmus.

Jika Anda tidak yakin apakah teknik Anda akan berhasil atau tidak di klien email Anda, gunakan alat Analisis Kode Litmus.

Tersedia di Litmus Builder, Analisis Kode akan menunjukkan kepada Anda properti HTML atau CSS yang tidak didukung di klien email tertentu tersebut, sehingga menghemat waktu Anda untuk memecahkan masalah.

Kesalahan umum karena perubahan dukungan meliputi:

Gambar tidak muncul

Email antropologi dengan gambar diaktifkan dan diblokir

Ada beberapa alasan mengapa gambar mungkin tidak muncul di email Anda. Yang paling umum? Banyak program email memblokir gambar secara default, hingga pengguna mengklik "Tampilkan gambar." Jika Anda tidak yakin, berikut adalah daftar dukungan saat ini.

Perbaikan: Untuk memastikan bahwa pengguna Anda masih memiliki pengalaman hebat, bahkan dengan gambar tidak muncul, sertakan teks ALT. Ini adalah baris teks yang dirancang untuk meringkas konteks gambar dalam email. Menyertakan teks ALT untuk semua gambar Anda, bahkan jika Anda tidak mengoptimalkan untuk setiap klien, adalah praktik terbaik umum. Ini memastikan pesan Anda tersampaikan bahkan jika Anda menggunakan teks dalam gambar Anda, dan itu juga membuat email Anda lebih mudah diakses oleh mereka yang menggunakan pembaca layar.

Masalah lain yang kurang umum mungkin:

  • Gambar Anda tidak dihosting di server yang dapat diakses publik
  • Gambar Anda menggunakan relatif, bukan jalur URL absolut
  • Format file gambar Anda bukan JPEG, GIF, atau PNG
  • Kesenjangan muncul di bawah gambar Anda

Periksa untuk memastikan gambar berfungsi, dan seperti apa email Anda dengan gambar tidak aktif, di Daftar Periksa Litmus.

Pratinjau email Anda dengan gambar nonaktif

Pratinjau email dengan gambar mati dan dapatkan pemberitahuan jika ada gambar Anda yang kehilangan teks ALT dengan Daftar Periksa Litmus. Lihat sendiri apa yang bisa dilakukan Daftar Periksa! Lihatlah email yang rusak ini di Daftar Periksa Litmus

Lihat lebih banyak →

Font khusus tidak muncul

Anda mungkin telah bekerja dengan desainer Anda untuk membuat font kustom yang menakjubkan—hanya agar font tersebut tidak muncul di email Anda. Ini mungkin karena Anda tidak menggunakan font web-safe atau sistem, yang memiliki dukungan di semua klien dan umumnya diinstal pada sebagian besar komputer.

Cara Mengatasinya: Jika Anda ingin memiliki font khusus, pastikan untuk menyertakan fallback, dan jenisnya sama dengan font khusus Anda—misalnya, menggunakan font sans-serif untuk keduanya—yang akan membantu mempertahankan desain email di klien email yang berbeda.

Untuk informasi lebih lanjut tentang tipografi, lihat panduan utama kami.

Email terlihat funky di ponsel

Ukuran layar dapat membuat perbedaan besar dalam hal bagaimana email Anda dirender. Dengan lebih dari 50% email yang dibuka sejak 2015 berasal dari seluler, penting untuk mengoptimalkan email Anda untuk layar yang lebih kecil. Menguji email Anda di iPhone, iPad, dan Android menjadi mudah dengan Pratinjau Instan Litmus.

Desain responsif adalah norma baru, terutama sekarang karena Gmail mendukungnya. Email responsif bergantung pada kueri media—atau aturan @media dalam kode—agar berfungsi dengan baik. Kueri media adalah kumpulan gaya CSS khusus yang bertindak seperti pernyataan bersyarat atau aturan dinamis. Direncanakan dengan hati-hati, mereka dapat membantu membuat email lebih bermanfaat pada ukuran layar yang berbeda. Kueri media tidak didukung di semua tempat, jadi ingatlah itu saat mendesain.

Cara Mengatasinya : Meskipun Anda belum memilih untuk menggunakan desain responsif, ada beberapa cara untuk memastikan email Anda dapat dibaca dan ditindaklanjuti oleh semua audiens pelanggan Anda.

Memikirkan tentang:

  • Memperbesar font: Kami merekomendasikan minimum 14px untuk body copy dan 22px untuk headline sehingga email Anda dapat dibaca di layar kecil.
  • Menggunakan CTA ramah sentuhan: Pelanggan Anda tidak lagi mengeklik—mereka juga mengetuk! Kami merekomendasikan tombol menjadi minimal 44x44px yang ramah jari.
  • Menyederhanakan tata letak Anda: Gunakan pendekatan satu kolom atau desain responsif untuk mengakomodasi tampilan di layar yang lebih kecil dan meningkatkan keterbacaan.
  • Merampingkan konten Anda: Evaluasi konten di email Anda dan singkirkan tautan, salinan, dan gambar yang kurang berguna atau tidak relevan. Singkat, tapi tetap persuasif.

Tautan putus + pelacakan

Saat membuat email, Anda tidak hanya mencari yang terbuka, tetapi juga membuka konversi itu. Dan agar pelanggan Anda berkonversi, mereka harus dapat mengambil tindakan, biasanya dalam bentuk tombol ajakan bertindak. Jika tautan untuk tombol Anda (atau tautan apa pun, dalam hal ini) rusak, Anda telah kehilangan peluang besar—dan mungkin telah merusak reputasi Anda di mata pelanggan. Anda tidak pernah ingin mereka melihat layar seperti ini:

Tangkapan Layar 13-04-2017 pukul 17.30.07

Demikian pula, jika tautan Anda tidak memiliki pelacakan, Anda tidak akan merusak pengalaman pengguna, tetapi Anda tidak akan dapat membedakan mana yang berfungsi dan mana yang tidak. Apakah ada yang mengklik tautan Anda?

Cara Mengatasinya : Periksa kembali setiap tautan Anda dengan Daftar Periksa Litmus untuk memastikannya berfungsi.

Tangkapan Layar 18-04-2017 pukul 09.55.04

Kemudian, pastikan Anda telah menambahkan kode pelacakan ke setiap tautan Anda dengan Manajer Pelacakan di Litmus Builder sehingga Anda dapat mengukur keberhasilan kampanye email Anda.

Tangkapan Layar 2018-04-18 pukul 09.55.38

GIF animasi + video tidak berfungsi

GIF animasi dan video keduanya menambahkan sedikit bumbu ke email Anda. Mereka bisa menyenangkan dan menarik, atau memberikan demo cepat dari produk Anda dalam tindakan. Terlepas dari bagaimana Anda menggunakan salah satu teknik, mereka bisa sulit untuk disertakan dalam email.

Pertama, GIF dan video animasi berukuran besar cenderung menambah kecepatan pemuatan email Anda, dan dapat membuat pelanggan frustrasi karena mereka tidak akan melihat narasi lengkap yang Anda coba sampaikan saat gambar berat masih dimuat. Hal-hal menjadi lebih rumit di seluler di mana memuat gambar mungkin membuatnya tampak seolah-olah Anda mengirim email kosong.

Cara Mengatasinya : Karena tidak semua klien mendukung GIF atau video animasi, optimalkan bingkai pertama GIF Anda dan sertakan gambar mundur untuk video Anda. Untuk keduanya, pastikan gambar menangkap pesan Anda secara akurat.

jack-sekop

Menambahkan video adalah teknik yang ampuh untuk mendorong keterlibatan. Menyertakan ikon putar ke gambar itu akan mendorong klik. Host video Anda di halaman lain, sebaiknya halaman arahan yang ditunjuk untuk melacak lebih lanjut keterlibatan pelanggan Anda yang mengklik video dari email.

Dalam hal kecepatan memuat, seimbangkan materi iklan Anda dengan data Anda: Gunakan Daftar Periksa Litmus untuk menentukan kecepatan muat email Anda dengan video atau GIF Anda. Kami telah mengumpulkan semua yang perlu Anda ketahui tentang ukuran file, termasuk bagaimana Anda dapat menguranginya, dalam panduan ini.

Waspadai frekuensi untuk teknik ini. Jika digunakan dengan hemat, GIF dan video animasi dapat mengejutkan dan menyenangkan pelanggan. Terlalu sering digunakan, pelanggan yang sama mungkin bosan dengan mereka dan menjadi kecil kemungkinannya untuk terlibat dengan kampanye Anda.

Lalu ada hal-hal kecil…

Masalah Sintaks

Ini bisa sangat membuat frustrasi untuk tidak tahu mengapa hal-hal terlihat funky. Kemungkinannya adalah, ada tag penutup yang salah, tabel bersarang yang tidak tepat, atau kesalahan ketik tersembunyi lainnya dalam kode Anda.

Tangkapan Layar 13-04-2017 pukul 17.24.50

Cara Mengatasinya : Untuk mengetahui kesalahan apa pun, jalankan email Anda melalui Daftar Periksa Litmus untuk langsung melihat apa yang rusak.

tautan biru

Apple mengubah nomor telepon, alamat, tanggal, dan kata-kata undangan seperti "malam ini" menjadi tautan biru yang digarisbawahi dalam email. Ini karena informasi tersebut dapat memicu peristiwa yang didorong oleh aplikasi, seperti menambahkan sesuatu ke kalender Anda atau meluncurkan peta.

Tangkapan Layar 13-04-2017 pukul 17.31.22

Meskipun ini mungkin bagus untuk pengguna yang membuka email pribadi, dalam HTML, ini bisa menyulitkan untuk membaca atau mengambil tindakan pada email Anda. Tautan biru dapat menyebabkan berkurangnya keterbacaan (pikirkan: tautan biru dengan latar belakang biru), dan juga dapat bertentangan dengan desain merek Anda.

Perbaiki : Untungnya, ada beberapa cara untuk memperbaikinya.

Memecahkan masalah email Anda

Jaminan kualitas adalah salah satu bagian yang paling memakan waktu dari proses desain email, dan salah satu yang paling membuat frustrasi, tetapi tidak harus demikian. Sederhanakan proses pengujian Anda dengan Litmus, untuk melihat apakah Anda memiliki masalah rendering di lebih dari 70 klien email, ditambah pelacakan tautan, analisis kode, dan fitur lain yang memudahkan Anda memecahkan masalah sebelum menekan kirim.

Mulai pengujian sekarang →