E-posta tasarımını daha iyi hale getirmek amacıyla, sizinle paylaşmak için duyarlı e-posta (her cihazda uyumlu görüntülenen - en. responsive) tasarım ipuçlarını aramaktayız. Bu yazımızda New York'ta gerçekleşen "E-posta Tasarım Atölyesi"nin çalışmalarına yer veriyoruz. Yazımızın çok önemli bir kısmı seminerin sonuç raporunun Türkçe'ye tercümesi şeklinde; ancak biz de araya kendi notlarımızı ve tavsiyelerimizi ekledik. New York'un en iyi dijital tasarım eğitim kurumlarından Noble Desktop liderliğindeki "Designing Responsive Email" seminerinde, e-posta pazarlamacılarıyla bağlantı kurarak en son tasarım ipuçlarını keşfetmek için kafa yorduk. Tasarım bir e-posta kampanyasının başarı oranlarını nasıl etkiler ve duyarlı tasarım sınırlamalarını güçlü noktalara nasıl dönüştürür?  

Seminerden aldığımız 10 duyarlı e-posta tasarım ipucu

1) Duyarlı e-postanızı bir fragman gibi tasarlayın

Yaklaşan etkinlikler, en yeni ürününüz, en büyük satışınız veya şirket duyurusu gibi, e-posta listenizdeki okuyucularla iletişim kurmak istediğiniz çok şey olduğunu biliyoruz. Ancak, e-postanız ayrıntıları gösterecek bir yer değildir. E-postanızı mesajınızın ana içeriği için okuyucuları yönlendirmeye yarayan bir fragman olarak düşünün. E-postanızda kısa ve öz anlatımlar yaparak, kullanıcıların rahatlıkla tuşlayabilecekleri eylem butonları (call-to-action buttons) yerleştirin.  

2) Duyarlı e-postalarınızda bir hiyerarşi oluşturun

Hikâyelerinizi hiyerarşik bir tarzda anlatarak, e-postanızda odaklanma ve organizasyon oluşturun. İletinizin ters piramit modeli kullanılarak nasıl yapılandırıldığını düşünün.  Kampanya izleme, InVision'dan gelen bir e-postada bu yöntemin mükemmel bir örneğini bize gösteriyor. Her bölüm etkileyici bir görsel ögeyle başlar ve ardından doğrudan bir harekete geçirici mesaj tuşunun bulunduğu, destekleyici metin içeren kısa, kalın bir başlık ile daha sonra ne yapması gerektiğini netleştirir.  Bu, kısa sürede iletişim kurmak ve dikkatini kısa süreli o sayfaya veren okuyucuların (hemen hemen tüm okuyucular) tıklama sayılarını arttırmak için mükemmel bir yoldur. Aşağıdaki örnek e-bültende olduğu gibi:    

3) E-posta içi yönlendirme butonlarınız asla “Buraya Tıklayın” dememeli

Okuyucularınıza nereye tıklayacaklarını söylemek için boşuna yer işgal etmeyin. Özellikle mobil cihazlarda, okuyucular dokunuyor, tıklamıyor. “Tıklayın”  kelimesi gerçekten harekete geçirici bir mesaj değildir. Onu atlayın ve okuyuculara doğrudan neler yapması gerektiğini söyleyin.  Net, doğrudan bir hareket fiili kullanın ve özlü olun. Mesajınızı samimi ve ilgi çekici yapan "benim" ve "sizin" gibi zamirleri kullanmayı deneyin. “ Şimdi yerimi ayır” ya da  “Ücretsiz biletimi al” sözlerini de deneyebilirsiniz. Veya yukarıdaki örnekte olduğu gibi okuyucuyu sayfanızı ziyaret etmeye teşvik edebilirsiniz.  

4) Duyarlı bir e-postada hiçbir zaman tek bir büyük resim kullanmayın

Başka bir deyişle, sadece resimli e-posta tuzaklarından kaçının.  E-postanızda yalnızca bir tane büyük resim kullanmak spam puanınızı arttıracaktır. Böylece e-posta,  okuyucuların gelen kutusu yerine spam kutusuna düşmeye başlayacaktır. Ayrıca, bu e-postanızın tam olarak duyarlı olmadığı anlamına gelir ve eğer resim yüklenmezse, okuyucular yalnızca ALT metni görecektir. Yani işe yarar hiç bir şey görmeyeceklerdir. Bir çözüm var mı? Evet var. E-postanıza daima bir metin ve resim dengesi kullanın. Bunun için en iyi yol, eğer bu konuda yeterince iyi olduğunuzu düşünmüyorsanız, hazır şablonlarla çalışmaktır.  

5) Grid-tabanlı tasarım

Grid-tabanlı tasarımları duyarlı hale getirmek daha kolaydır. Bunun nedeni, HTML e-postalarının satırlar ve sütunlardan oluşan tablolarla oluşturulmuş olmasıdır. Modüler şablon tasarımından yararlanan e-posta editörleri, INBOXBrush gibi,  içeriğin düzenlenmesinde bol esneklik sağlarken, otomatik olarak bir ızgarada içerik düzenlemenize de yardımcı olur.  

6) ALT metnini unutma

Resimlerinizin yüklenmemesine karşı hazırlıklı olun. Bazı e-posta istemcileri otomatik olarak resmi yüklemez ve bazı aboneler güvenlik nedeniyle otomatik yükleme özelliğini etkinleştirmez. Bu konuda daha detaylı bilgi için buraya göz atabilirsiniz. E-postanın görüntüleri devre dışı bırakılmış haliyle yalnızca bir ALT metin görünür. Bu durumda eğer bir ALT metin koymazsanız, resimler yüklenmediği zaman okuyucu hiç bir şey görüntüleyemez. Dolayısıyla, ALT metni doğru düzenlemek önemlidir. Yazarken metni kısa tutmayı unutmayın.  Eğer iki satıra bölünürse, bazı e-posta istemcileri onu görüntüleyemez. Yapabiliyorsanız, resme stil ekleyerek ALT metninizi stilleyin (resminiz farklı görünmeyebilir, ancak ALT metniniz göründüğünde belirttiğiniz yazı tipi, renk ve boyut olacaktır).  

7) E-postanız bir web sitesi değil

Eğer ipucu #1 ve #2’yi izlerseniz,  o zaman muhtemelen iyi durumdasınızdır. Açık ve özlü bir e-posta dizayn edilmeli ve tek bir harekete geçirici mesaj vermelisiniz. Dolayısıyla, örneğin aşağıdaki örnek gibi, çok sayıda bağlantı ve gereksiz detay verilmemeli. Amaç okuyucuyu o mesajla birlikte özel bir noktaya taşımak olmalı. Örneğin kayıt sayfanıza. Basit olun ve özelleştirmeler yapmak için sahip olduğunuz verileri kullanmayı unutmayın. Biri şirketin web sitesine geldiğinde, o ziyaretçiyle ilgili pek fazla şey bilmiyorsunuz. Öte yandan, e-posta listeniz başka bir hikâyedir. Kullanıcılarınız ile ilgili verilere sahipsiniz. Dönüşüm oranlarını arttırmak için, kitlenizin bölümlere ayırın ve tetiklenmiş kampanyalar oluşturun.  

8) Özel yazı tipleri ile seçici olun

Çoğu e-posta istemcisi markanızın özel yazı tipini desteklemez. Açıklamalar yapmak için e-posta başlığınız gibi şeyleri dikkatli kullanın daha sonra mesajınızın gövdesi için e-postayla güvenli yazı tipleri ekleyin. E-postanıza güvenli yazı tipi seçimi biraz sınırlıdır, ancak şüpheleriniz olduğunda Serif yazı tipini kullanın. Gmail otomatik olarak bu yazı tipini kullanmaktadır. Ayrıca birçok marka Arial, Helvetica ve Verdana yazı tiplerini de kullanmaktadır.  

9) Üst başlığınızı düzenlemeyi unutmayın

Üst başlıklar (pre-header), gelen kutusundaki konu satırını izleyen küçük bir metindir.  Aboneler, e-postanın birkaç kelimeyle okunmaya değer olup olmadığına karar vererek tarama aracı olarak bu üst başlıkları kullanmaktadır;  dolayısıyla, dikkat çekici üst başlıklar kullanarak açılış oranları artırabilirsiniz. Manuel olarak düzenlememeniz halinde, e-postanızda görünen ilk düz metin üst başlık olarak görünecektir -ki bu çoğu zaman okuyucuya anlamsız gelecek kodlar olabilir. Bu bölümün kısa olması gerekir. Biz, çoğu cihazda tam olarak görüntülenebilmesi için üst başlığınızın 40-50 karakter arasında olmasını öneriyoruz.  

10) Hareketli GIF’leri akıllıca kullanın

Hareketli GIF’ler, çoğu e-posta istemcisinde kesintisiz çalışan güçlü bir görsel anlatım aracıdır. Outlook büyük bir istisnadır-Outlook 2007 ve sonraki sürümleri yalnızca GIF’inizin ilk karesini görüntülüyor. Çerçeve sayısına ve çözünürlüğüne bağlı olarak, GIF’ler büyük dosyalara dönüşebilir. Büyük boyutlu GIF'ler, mobil veri kullanımı sırasında zor yüklenebilir ve kotanızı çok tüketebilir. Bu konuda daha hassas davranmak için, yalnızca animasyona ihtiyaç duyulan şeyleri canlandırarak animasyonlu GIF boyutunu küçültün. Çerçeveler küçüldükçe, ne kadar az piksel değişirse, dosya boyutu da bir o kadar küçülecektir.   Sorular? Yorumlar? Ve şimdi daha net, çekici, duyarlı e-postalar tasarlamaya başlama zamanı! Yorumlarda herhangi bir ipucu veya sorunuz varsa bize bildirin ve bir sonraki kampanyanız için INBOXBrush'ı deneyin. Ücretsizdir ve INBOXBrush ile tasarlanan tüm e-postalar %100 mobile duyarlıdır (tek bir satır kodlamanıza dahi gerek yoktur).