E-posta bültenlerinde görseller: pratik rehber

Her görselin ne işe yarayacağını belirleyin

Ürün fotoğrafı yeni bir ürünü gösterebilir. Etkinlik fotoğrafı, okuyucunun mekânı veya yapılacakları gözünde canlandırmasına yardımcı olabilir. Bir şema, değişikliği bir paragraftan daha anlaşılır anlatabilir. Görseli, okuyucunun bu e-postada neyi anlamasına yardımcı olacağına göre seçin.

Görseli kaldırırsanız hangi bilginin kaybolacağını düşünün. Yalnızca süsleme amacı taşıyorsa daha küçük bir görsel kullanmak veya hiç kullanmamak mesaja daha fazla yer bırakabilir. Önemli bir ürün ayrıntısını gösteriyorsa bu ayrıntının telefonda da net görüldüğü bir açı seçin.

Bu rehber, bültenin içeriğinde görünen görselleri ele alır. İndirilebilir ek olarak fotoğraf gönderiyorsanız e-posta için görsel sıkıştırma rehberimizi kullanın.

Önemli bilgileri görselin dışında da yazın

Başlığı, önemli ayrıntıları ve ana bağlantıyı bülten düzenleyicisinde, örneğin Moosend’de, metin olarak yazın. Bir kampanyada indirim, koşullar ve bitiş tarihini; bir etkinlikte tarih, yer ve rezervasyon bağlantısını ekleyin. Tanıtım görseli bunları destekleyebilir, ancak bilgiler yalnızca görselde yer almamalıdır.

Alternatif metni görselin amacına göre seçin:

• Yararlı bilgi veren bir fotoğraf: ürünün görünen biçimi veya bir özelliği gibi okuyucunun ihtiyaç duyduğu ayrıntıyı açıklayın.
• Yalnızca dekoratif bir görsel: bilgi eklemiyorsa ve bağlantı değilse alternatif metni boş bırakın. W3C’nin dekoratif görseller rehberi, gereksiz açıklamaların ekran okuyucu kullanan kişilerin dikkatini neden dağıtabileceğini anlatır.
• Bir bağlantının tek içeriği olan görsel: yalnızca görünüşü anlatmak yerine bağlantının hedefini veya eylemini belirtin; örneğin “Mavi kupayı inceleyin”. W3C’nin işlevsel görseller rehberine bakın.

Alternatif metin, e-postanın asıl metninin yerini tutmaz: bazı uygulamalar onu her durumda göstermez. Mailchimp bu sınırlamaları açıklar. Daha fazla örnek için alternatif metin rehberimize bakın.

Görseli e-posta şablonuna uygun hazırlayın

Şablonun görsel bloğu için önerilen boyutlarla başlayın. Sütunun tamamını kaplayan fotoğrafla küçük bir ürün kartı farklı dosyalar gerektirir. Görseli esnetmek yerine bir kopyasını ayrılan alana uygun şekilde kırpın. Gerekirse görsel kırpma aracını kullanın.

E-postada gösterilen genişliği dosyanın piksel boyutlarından ayırın. Fotoğraf 600 piksel genişliğinde gösteriliyorsa 600 ve 1200 piksel genişliğinde dosyaları karşılaştırabilir, ikisini de aynı 600 piksellik alanda gösterebilirsiniz. Daha geniş dosya, yüksek çözünürlüklü ekran için daha fazla görsel pikseli sağlar; e-postayı genişletmemelidir. Ayrıca yeterince büyük bir orijinal gerektirir ve indirme boyutunu artırabilir. Bunlar örnek ölçülerdir: şablonun yönergelerini izleyin ve gelen e-postaları karşılaştırın. Mailchimp’in önerileri şablona ve içerik bloğuna göre değişir.

Hem bülten hizmetinin dosyayı kabul ettiğini hem de gelen e-postanın görseli denediğiniz uygulamalarda gösterdiğini kontrol edin. Başarılı bir yükleme, alıcıların görseli doğru göreceğini kanıtlamaz. JPEG fotoğraflar için pratik bir başlangıçtır; PNG şeffaflık ve grafikler için yararlıdır. Mailchimp, şablon görselleri rehberinde JPG, PNG veya GIF önerir. Web sitesi için dışa aktarılan bir dosyayı yeniden kullanmadan önce kendi hizmetinizin yönergelerini kontrol edin.

Animasyonlu GIF kullanıyorsanız ilk kare tek başına da anlaşılır olsun. Bazı alıcılar yalnızca bu kareyi görebilir; Microsoft’un animasyon rehberi, animasyon ayarlarının Outlook’ta buna nasıl yol açabileceğini açıklar. Gerekli bir adımı veya teklifi yalnızca sonraki karelere yerleştirmeyin.

Ayrıntıların yanında görsellerin toplam dosya boyutunu da değerlendirin. Birkaç büyük görsel e-postanın yüklenmesini yavaşlatabilir. Dosya boyutunu küçültme rehberimiz daha küçük kopyalar hazırlamayı anlatır.

Örnek: yeni bir ürünü duyurmak

Yeni bir mavi seramik kupa duyuran ev eşyası mağazası düşünün. Aşağıdaki iki düzen aynı ürün fotoğrafını kullanır:

İkinci düzende fotoğrafı, kupa ve kulpu telefonda da görünür kalacak şekilde kırpın. Fotoğraf ürüne giden ayrı bir bağlantıysa uygun alternatif metin ekleyin ve hem fotoğrafın hem metin bağlantısının hedefini kontrol edin.

E-postayı alıcının gördüğü hâliyle test edin

Düzenleyicinin önizlemesi içeriği yerleştirmeye yardımcı olur, ancak e-posta uygulamaları aynı mesajı farklı gösterebilir. Bülten hizmetinizden bir test gönderin ve gelen e-postayı bilgisayarda ve telefonda açın. Mümkünse kitlenizin kullandığı Gmail, Outlook veya Apple Mail gibi uygulamaları deneyin. Mailchimp’in önizleme ve test rehberi neden ikisinin de gerekli olduğunu açıklar.

• Görselin ana konusunu ve kırpmayı kontrol edin. Yüzler, ürünler ve önemli ayrıntılar esnemeden veya sayfa düzenini genişletmeden görünüyor mu?
• Görseli gösterildiği boyutta inceleyin. Yakınlaştırmadan anlaşılabiliyor mu? Gerekli etiketleri veya şema açıklamalarını e-postanın metnine de ekleyin.
• Varsa açık ve koyu görünümü deneyin. Şeffaf arka planlı koyu bir logo, koyu zemin üzerinde zor görülebilir. Kontrast oluşturan bir kenarlığı veya görselin içinde uygun bir düz arka planı olan bir sürüm deneyin ve iki görünümü de kontrol edin. Mailchimp’in koyu mod rehberi, logo kontrastını ve uygulamalar arasındaki farkları ele alır.
• Uygulama izin veriyorsa görseller engelliyken mesajı görüntüleyin. Kalan içeriği okuyun, alternatif metinleri inceleyin ve ana bağlantının kullanılabilir olduğunu kontrol edin.
• Bağlantıları açın. Tıklanabilir görselleri ve düğmeleri ayrı ayrı kontrol edin; hedefleri farklı olabilir.

Görsel görünmüyorsa nedenini bulun

Bu kontrolleri sırayla yapın. Klasik Outlook, Microsoft’un indirme rehberinde anlatıldığı gibi dış kaynaklı görselleri engelleyebilir. Gmail şüpheli bulduğu mesajlardaki görselleri göstermeyebilir; Gmail’in görsel ayarlarına bakın.

1. Gelen testte görsel yüklemeyi kontrol edin. Uygulama görselleri göstermeyi veya indirmeyi öneriyorsa kendi test mesajınız için izin verin. Görseller açılırsa onları uygulama engelliyordu. Sıkıştırma bu ayarı geçersiz kılmaz.
2. Sorunlu görseli bülten düzenleyicisinde bulun. Görsel bloğunu açın ve kütüphaneden doğru dosyanın seçildiğini kontrol edin. Dosya yoksa sakladığınız bir kopyayı yeniden yükleyip yeni dosyayı seçin. Başka bir sunucuda barındırılan görsel için bloğun kullandığı adresi kontrol edin.
3. Dış kaynaktaki dosyaya erişimi kontrol edin. Görselin doğrudan adresini oturum açmadan tarayıcının gizli modunda açın. Giriş ekranı veya paylaşım sayfası görsel dosyasının kendisi değildir. Bunun yerine hizmetin görsel kütüphanesini ya da uygun bir herkese açık görsel adresini kullanın. Buradaki başarı, yalnızca tarayıcıdan oturum açmadan erişilebildiğini gösterir; her e-posta uygulamasının görseli göstereceğini değil.
4. Uygulamalar arasındaki farkları inceleyin. Dosyaya erişilebiliyor ama bir uygulamada görünmüyorsa önce o uygulamanın görsel yükleme ayarlarını kontrol edin. Ardından biçimi hizmetinizin yönergeleriyle karşılaştırın. Fotoğraf için JPEG kopyası, şeffaflık gerekiyorsa PNG deneyin ve normal bir görsel bloğundan ekleyin. Özel bir şablon hâlâ çalışmıyorsa sorumlusundan görselin HTML kodunu incelemesini isteyin.
5. Düzeltmeden sonra yeni bir test gönderin. Sorunun yaşandığı uygulamada açın. Görseli, güncel alternatif metni ve varsa hem görsel bağlantısını hem ayrı metin bağlantısını kontrol edin.

Mailchimp’in sorun giderme rehberi görsel adresi, kısıtlı erişim ve görüntüleme sorunlarını açıklar. Kütüphane dosyalarını seçmek veya değiştirmek için kendi hizmetinizin yönergelerini izleyin.

Göndermeden önce son kontrol

• Kırpma, ayrıntılar ve dosya boyutu şablona uygun.
• Ana mesaj ve bağlantı görseller olmadan da işe yarıyor.
• Alternatif metin her görselin amacına uygun.
• Kullanılan GIF’in ilk karesi tek başına anlaşılır, logolar açık ve koyu görünümde seçilebiliyor.
• Son test mesajı ilgili uygulamalarda, görsel kaynakları ve bağlantı hedefleri de dahil olmak üzere kontrol edildi.