Ekran boyutlarının farklılıklarının yanı sıra, mobil devrim e-posta bülteni tasarımcıları için enteresan bir zorluk daha çıkarıyor: Yüksek DPI (dots per inch); yani yüksek çözünürlüklü ekranlar. Genellikle, Retina ekranları olarak adlandırılan bu ekranlar (bu terim Apple Pazarlama Makineleri tarafından üretilmiştir) e-posta kampanyalarını geliştirecek güce sahiptirler. Eğer buna sahip değilseniz, abonelerinize daha mütevazı bir e-posta deneyimi yaşatırsınız. Bu yazıda, yüksek DPI ekranlarının nasıl çalıştığına ve bunun e-posta tasarımcıları ve pazarlamacıları için ne anlama geldiğine bir göz atacağız. Kendi kampanyalarınıza, Retina ekranları nasıl uygulayacağınızı gördükten sonra, Retina ekranları kullananlar için bazı önemli hususları tartışarak özetleyeceğiz.  

TARİHÇEYE BAKTIĞIMIZDA

2010 yılında, Apple iPhone4’ü piyasaya sürdü. Diğer donanım gelişmelerinin yanında, iPhone 4, Apple’ın Retina Ekran adını verdiği özelliği de taşıyordu. Apple’ın Retina Ekranlı iPhone 4’ü, tüketiciler için üretilen ilk yüksek çözünürlüklü yani yüksek DPI’lı cihazdı. DPI, bir cihazın ekranında, bir inçlik alana sığabilecek piksel sayısına verilen kısa addır. DPI ne kadar yüksekse, görüntü ve yazılar da o kadar net ve ayrıntılıdır. Apple‘ın yüksek DPI görüntülerine “Retina ekran” demesinin sebebi teorik olarak şudur: DPI öyle yüksektir ki, insan gözü artık pikselleri birbirinden ayırt edemez. Yani, ‘Retina Ekranı’ Apple’ın bir marka adıyken, Retina terimi aslında diğer üreticilerin sıklıkla yüksek DPI görüntüsünü tanımladıkları bir terimdir. Yine aynı şekilde; aşağıda da göreceğiniz üzere, “Retina” yüksek DPI ekranları için en iyi şekilde kullanılan görüntülere atıfta bulunur. Retina ekranı ilk defa yaygın olarak müşteriyle buluşturan Apple olmasına rağmen, diğer cihaz üreticilerinin de bu kervana katılmaları uzun sürmedi. Birçok şirket, telefon gibi daha küçük cihazlarla başlasa da Retina ekranlar artık tabletlerde, dizüstü bilgisayarlarda, hatta Apple’ın muazzam 27 inç Retina 5k iMac’i gibi büyük boy masaüstü bilgisayarlarda da bulunabiliyor.  

RETİNA’YA NEDEN İHTİYACIMIZ VAR?

Donanım ve DPI hakkında daha fazla şey öğrenmek iyidir hoştur ama kendinizi şu soruyu sorarken bulabilirsiniz: BUNUN E-POSTA PAZARLAMA İLE NE İLGİSİ VAR? Güzel soru! Pazarlamacılar olarak, markamızı olabilecek en iyi şekilde göstermek bizim işimizdir. Konu satırları, içerik ve editoryal uyum… Bunların hepsi abonelere iyi gözükmek için bir araçtır; fakat kişileri e-posta kampanyalarına asıl çeken şey görsellerdir. E-postayı açtıktan sonra, herhangi bir şeyi okumadan veya tıklamadan önce, gözlerimiz tasarımlara ve görüntülere takılır. Eğer bu devirde yüksek DPI görüntüleriniz yoksa, abonelerinizin size karşı umursamaz bir tavır takınmaları riskiyle karşı karşıya kalırsınız. Yüksek DPI görüntülerinin çalışma şekli nedeniyle, iyileştirilmemiş görüntüler sonunda Retina ekranlarında bulanık ve piksellerden ibaret görünür. İşte size bir örnek: Kullanıcılar Retina ekranlarına alıştıkça, metin ve görüntülerin keskin ve net görünmesini beklerler. Eğer görüntülerinizi yüksek DPI ekranlar için iyileştirmiyorsanız, bu aboneler değeri düşük bir e-posta görecekler ki bu da markanıza olan güvenin eşit derecede azalmasına yol açabilir. Sonuçta yapılan iş tamamen pazarlama ile ilgili. Konu bu kadar detay gibi görünse de, çağa ayak uydurmayan markaların itibarı da çok yüksek olamaz.  

E-POSTALARDA RETİNA GÖRÜNTÜ KULLANMA

Retina ekranlar için görüntüleri nasıl tam olarak iyileştirebilirsiniz? Aslına bakarsanız cevap oldukça basit. Kabaca söylemek gerekirse, yüksek DPI ekranların, geleneksel emsallerine göre her inç’e düşen piksel sayısı iki kat daha fazladır. Bu yüzden, görüntülerimizin böyle ekranlarda güzel görünmesini istiyorsak, görüntünün 2 kat büyümesi gerek. Böylece, görüntüler e-postada küçültüldüğünde, Retina ekranlarında daha fazla piksel görüntülenir. Bir örnek ele alalım: Bu örnek e-postamızda en üstte INBOX logosu bulunmaktadır. HTML kodlaması kullanarak, bu logo 130x48 piksellik bir oranla boyutlandırıldı. Eğer biz logo görüntüsünü bu boyutta oluşturup kaydedersek, aboneler Retina ekranlarında aşağıdaki gibi bulanık bir şey görürler: Logoyu netleştirmek için, görüntüyü sadece daha büyük bir boyutta oluştururuz. Bu durumda, logo dosyası 276x102 pikseldir. Ancak, amaçlanan ekran boyutunun en az iki katı olan bir şeye ihtiyacımız vardır. O yüzden, HTML’imizde orijinal olanı, yani amaçlanan genişlik ve yükseklikte ekran boyutuna uygun büyük resmi aşağıya ölçeklendiririz. Yüksek DPI ekranlarında net, güzel ve Retina görüntüler elde ederiz.  

Retina Görüntüleri OUTLOOK’ta kullanma

Genişlik ve yükseklik özelliklerine göre belirlenmiş boyutlara rağmen, Microsoft Outlook’un bazı sürümleri hala Retina görüntülerini tam boyutlu olarak gösteriyor. Bu işi çözmek için, görüntünün biçim özelliklerine bir maksimum genişlik kuralı ekleyebilirsiniz. Aşağıdaki örnekte, tüm e-posta istemcileri üzerinde çalışan Retina görüntü elde etmek için, genişlik özelliğini (yükseklik özelliği yok) ve maksimum genişliği kullanırız. Genişlik biçiminin %100’e kadar ayarlandığını fark edeceksiniz. Bu, farklı ekran boyutlarında görüntü vermek için kullanılan pratik bir numaradır. Daha büyük ekranlarda, maksimum genişlik kuralı resim boyutunu kısıtlamak için zorlayacakken daha küçük ekranlarda, ekranın veya kap genişliğinin %100’ü dolacak.  

ARKA PLAN GÖRÜNTÜLERİ RETINA OLABİLİR Mİ?

Evet, Retina görüntülerini arka plan olarak kullanabilirsiniz.  Uygulaması biraz daha karmaşık olsa da, ilkeleri aynıdır. Dikkat çekilmesi gereken en önemli şey, bunun her yerde çalışmadığıdır. Retina arka plan görüntüleri için, arkaplan HTML özelliği yerine arkaplan CSS özelliğini kullanmanız gerekir. Arka plan, hem “shorthand property”  hem de Gmail ve Android istemcilerindeki bazı tuhaflıklarını hesaba katmak için CSS’nin arka plan özelliklerini kullanarak ayarlanır.  

DİKKAT EDİLMESİ GEREKEN BAZI NOKTALAR

Resimlerinizin boyutunu iki katına çıkarmak, resimlerinizin Retina ekranlarda güzel görünmesini sağlar; fakat bu tekniğin de bazı eksik tarafları vardır. Mobil veri kullanım ücretleri konumunuza ve ağ bağlantısına bağlı olarak pahalı ve yavaş olabilmektedir. Eğer bir görüntünün boyutlarını büyütürseniz, haliyle dosya boyutu da büyür. Bu artan boyut, hem veri kullanımı arttırır hem de e-postanın yavaş yüklenmesine neden olur. Her iki sorun da büyüktür ve hiç de dostane olmayan bir kullanıcı deneyimi oluşturur. Şunu da söylemek gerekir ki; her kampanyada Retina görüntülere ihtiyaç olmaz. Eğer kampanyanızda gerçek boyutu büyük olan çok fazla resim kullanıyorsanız, Retina olmayan resimler size daha çok yardımcı olabilir; çünkü kampanyanızdaki resimlerinizin indirilmesi hızlı olacaktır. Eğer Retina görüntüleri kullanmanız gerekiyorsa, şişmiş dosya boyutlarından kaçınmaya yardımcı olmak için iki teknik vardır: Binicisi ve karmaşık olanı, ‘şıkıştırılmış görüntüler’ kullanmaktır. Bunlar büyük boyutlarda kaydedilmiş ancak çok düşük kalite ayarları olan resimlerdir. Çoğu resim düzenleme programı, sizin resimlerin kaydedileceği kaliteyi ayarlamanıza izin verir. Photoshop’ta örneğin, basit bir kaydırıcı kullanarak JPEG kalitesini ayarlayabilirsiniz. Sıkıştırma görüntüsü oluşturmak için, görüntüyü istenilen boyutun 4 katına yakın bir boyutta tasarlayın ve son derece düşük kalitede kaydedin. Resim boyutu tam görüntülendiğinde kötü görünmesine karşın, bir e-postada istenilen boyuta küçültüldükten sonra görsel sorunsuz görüntülenir. Dosya boyutlarını kontrol altına tutmanın ikinci bir yolu, resimlerinizi kaydettikten sonra daha da sıkılaştırmak için özel bir program kullanmaktır. Oluşturulduktan sonra, resimleri işleyip sıkıştırmanıza izin veren her işletim sistemi için birçoğu ücretsiz olan uygulamalar mevcuttur. Bunlardan favorilerimiz olanlardan bazıları: ImageOptim, JPEGmini, TinyPNG, Compressor.io, Kraken, and Pied Piper. Çoğu durumda, resimlerinizi programa sürükleyip bırakmanız veya yüklemeniz yeterlidir. Onlar kendileri sıkıştırırlar. Ardından, hazır Retina kampanyalarına dahil etmek için, iyileştirilmiş resimleri ESP veya sunucunuza yükleyebilirsiniz.

RETINA DÜNYASI

Son istatistiklere göre, e-posta kullanım ve okuma alışkanlıkları hızlı bir şekilde mobil cihazlara kayıyor. Öyle ki, artık mobil cihazlardan e-posta erişimi diğer tüm cihazları ciddi bir farkla geride bırakmış durumda. Yani mobil çağ çoktan başladı. Yüksek DPI ekranlı aletlerin üretimindeki artış trendi ile birleştiğinde, e-posta kampanyalarında Retina görüntülere duyulan ihtiyaç apaçık. Dosya boyutlarını göz önünde bulundurduğunuz sürece, Retina görüntüleri de dahil olmak üzere, herhangi bir kampanyanın yatırım getirisini arttırmak artık oldukça kolay. Artık bulanık grafikler hakkında endişelenmeyi bırakın ve Retina görüntüleri ile çağa ayak uydurmaya başlayın!