E-postalarınıza HTML imza ile daha ilgi çekici olun

Dikkat: Bu yazının yazılma tarihinin üzerinden en az 60 gün geçmiş. İçerisindeki bilgiler güncelliğini yitirmiş olabilir. Yorumları ve güncellemeleri göz önünde bulundurarak yazıyı takip ediniz.

E-Postalarda imza kullanımı

Günümüzde eposta ile yazışmak artık günlük bir parçamız. Yazışmalarınızda imza kullanarak kişisel tanımınızı yapmanın yanı sıra, statünüzü (iş ve pozisyon gibi) yansıtmak, portfolyo veya blog gibi internetteki kaynaklarınızı insanlara yaymak için vereceğiniz kısa linkler ile yazışmalarınızdan daha çok verim alabilirsiniz. Hatta şu anda oldukça verimli işleyen bir reklam tekniği olarak algılanabilir bu konu.

Bu dökümanda imza kullanımınızı daha iyi, etkileşimli hale getirmek için birkaç numara yapmayı göstereceğim.

Etik

İmza ile link paylaşmak, kendiniz hakkında bilgi vermek bu işin güzel yanı fakat burada belirteceğiniz bilgiler konusunda dürüst olmanız, abartıdan kaçmanız gerekiyor. Yani imza'daki amaç aynen bir kartvizit'de verilmek istenen bilgiler gibidir. Yani insanlara sohbetiniz arasında verirsiniz, o anda baktıklarında sizin bir çeşit kimliğinizi, yaptığınız işi, yetkinlik durumunuzu bunun yanı sıra sizinle iletişime geçebilecekleri bilgileri verirsiniz.
Yani etik olarak kartvizitinizde naısl abartı bilgi, yanlış bilgi vermezseniz imzanıda da vermemelisiniz.

İşin bir diğer tarafı da burada vereceğiniz bilginin kalabalık olmaması, öz olmasıdır. Yani 10 tane link ve 2 paragraf yazı yazmamalısınız. En fazla 2 veya 3 tane bağlantı belirtip siteniz, blogunuz veya portfolyonuzu belirtin. Bunun dışında kullandığınız diğer eposta hesapları ve telefonunuzu da belirtebilirsiniz. Ama adres gibi uzun ve her zaman işe yaramayacak bilgileri her espotanızda yaymayın. Çünkü farkında olmadan insanlara spam yapıyor olursunuz. Rahatsız etmeyecek, göz yormayacak bir içerik hazırlamaya özen gösterin.

İçerik, Resimler İkonlar

Hazırlayacağınız imzada az sayıda ikon ve kullandığınız bir sembol, şirketinizin logosu veya hiçbiri yoksa kişisel olur belki ama küçük bir fotografınızı ekleyebilirsiniz. Ekleyeceğiniz materyallerin hem dosya boyutlarının büyük olmamasına hem de görünür boyutlarının çok büyük olmamasına dikkat edin. Daha önce de bahsettiğim giib insanları rahatsız etmeden kendi reklamınızı yapmaya çalışıyor olacaksınız.

Başlayalım

İmzanızı hazırlarken html etikerleri bile bulunmayan bir html bloğu oluşturacağız. Burada kesinlikle ilkel düşünmeniz gerekiyor çünkü neredeyse tüm mail client'lar oldukça ilkel motorlarla ve spam gibi engellerden dolayı da sade kodlamada bulunmasını şart koşuyor. Bu kurallar ve öneriler hakkında daha önce birşeyler yazmıştım (Başarılı bülten (newsletter) mesajı oluşturmanın 5 kuralı). Bu kurallardan hatırlatmam gerekenler :
  • External css kullanamazsınız
  • Kompleks ve css 3 gibi yeni öznitelikleri kullanamazsınız
  • Javascript, flash gibi şeyler kullanamazsınız
  • Artalan imajı kullanmamaya çalışın (bazı web client'lar desteklemiyor)

Bu hatırlatmalar dışında burada hazırlayacağınız html olabildiğince sade yapın. Yerleşimi table ile yapıp sadece text tipi stillemeyi inline kullanın.

Şimdi bu kurallara uygun benim kendim için hazırladığım imzam şöyle :
- Basitçe yaptığım işten bahsedeceğim
- Kullandığım logo/amblem/sembol'u belirteceğim
- Komunite sitesi ve portfolyo sayfamın adresini vereceğim
Bunları basit bir tablo ile yerleştirdiğimde şu şekilde bir imza oluşturdum :

Imza

Farkettiyseniz oldukça sade, zaten buradaki amaç sizin epostanızı okuyan birisi, gönderen kişi hakkında fikir edinebilmesi için vereceğiniz şey olmalı. Tabiki bu kısımda karışık veya uzun metinler kullanarak bunu sağlayamazsınız.

Bu imzayı oluşturan html kodu şöyle :
<div style="border-top: 1px dotted #ccc; height: 15px; font-size: 1px;"></div>
<table border="0" cellspacing="0" cellpadding="0">
	<tr>
		<td valign="top"><img src="mail_logo.gif" alt="Logo" width="52" height="43" border="0" /></td>
		<td width="15">&nbsp;</td>
		<td valign="top">
			<span style="font: 20px Lucida Grande, Arial; font-weight:bold;">Mehmet Fatih YILDIZ</span>
			<span style="font: 15px Lucida Grande, Arial; color:#999; margin-bottom:5px;">// UI Designer and Web Developer</span><br />
			<a style="font: 12px Lucida Grande, Arial; color:#F63; text-decoration:none; border-bottom:1px solid #06F;" href="http://mfyz.com" target="_blank">mfyz.com</a>
			<a style="font: 12px Lucida Grande, Arial; color:#666; text-decoration:none; border-bottom:1px solid #F00;" href="http://mfyz.net" target="_blank">mfyz.net (Portfolyo)</a>
		</td>
	</tr>
</table>
gördüğünüz gibi tüm css'ler satır içinde kullanılmış durumda. Artalan imajı yok ve yerleşim tablo ile sağlanmış. İşte bu ilkellikte olması gerekiyor.


Bu noktada hazırladığınız sayfayı body, html etiketlerinden arındırarak kaydedin. Yani mesela benim imzam için yukarıda verdiğim kodu kaydettim bir dosyaya. Bu noktaya geldiyseniz şimdi yapacağınız şey, imzada kullandığınız imajları external bir yere almak. Bu örnekte tek imaj var mail_logo.gif bu imajı kendi sitem altında bir yerlere koyup adresini değiştirdim. Yanihttp://mfyz.com/mail_logo.gif adresinde mesela. Çünkü bu düzeltmeyi yapmazsanız tüm mesajlarınızda bu dosya ekli (attach) olarak gitmeye başlayacaktır. Bu da karşı tarafı rahatsız edebilir (ben rahatsız olurum açıkcası). Tabiki ekli de gönderseniz, dış bağlatı ile de gönderseniz eposta okuyucu programlar, karşıdaki kişi kabul edene kadar sizin imajlarınızı göstermeyecektir. Bu noktada imajlarınız içinde bilgi olmamasına dikkat edin. Yani bu örnekteki gibi logo, ikon gibi materyalleri imaj olarak kullanın.

E-posta istemcilerinin ayarlanması

Bu dökümanda html ve css ile eposta imzanızı nasıl şekillendireceğinizi ve etkileyici hale getirebileceğinizi anlatmaya çalıştım. Thunderbird universal bir yazılım olduğu için ve html imza ayarlaması kolay olduğu için kısaca anlatacağım fakat diğer eposta okuyucularda ayarlamayı başka dökümanlarda değineceğim.

MacOSX'de Mail.app (Apple Mail) istemcisinde html imza ayarlamayla iligili yazdığım diğer dökümana ulaşmak için buraya tıklayın.

Thunderbird'de html imza ayarlamak gerçekten oldukça kolay. Hesap bilgilerinizi ayarladıktan sonra Tools / Account Settings menüsünden ulaşabileeğiniz hesap bilgileri penceresini açın.



Ayarlamak istediğiniz eposta hesabını seçin. Seçenekler içinden "Attach this signature" kısmını işaretleyerek alttaki alandan kaydettiğimiz html dosyasını gösterin.
Artık yeni mesajlarınıza html imzanız eklenecektir.

Hazırlayan : Mehmet Fatih YILDIZ

Yorumlar

Üye Resmi yedincisenol
3 Temmuz Cuma ´09 11:25
Güzel döküman olmuş. Ellerine sağlık.
Üye Resmi Mahmut ŞAhin
4 Temmuz Cumartesi ´09 17:12
Outlookta da Thunderbird de olduğu gibi bir imza ayarı penceresi var mıdır?
5 Temmuz Pazar ´09 00:10
outlook'da sanırsam html'i açınca tümünü seçip kopyaladıktan sonra outlook'ın imza yazma editörüne doğrudan yapıştırarak ayarlayabiliyorsunuz.
5 Temmuz Pazar ´09 15:34
Teşekkürler mfyz
Üye Resmi Adem Çırak
15 Ekim Perşembe ´09 21:25
teşekkürler...
Üye Resmi Sercan ŞANLI
30 Kasım Pazartesi ´09 22:29
Teşekkürler.   :-)  işime yarayabilir.
24 Mart Çarşamba ´10 16:07
Çok teşekkürler Mehmet abi böyle ilgi çekici yenilikleri bizlere en güzel bir şekilde gösteriyorsun.
Üye Resmi Atilla Yalman
26 Mart Cuma ´10 02:27
Çok teşekkürler ancak küçük bir sorunum var. Image eklemeyi yapamadım, biraz daha açabilirseniz çok sevinirim. Teşekkürler.
27 Mart Cumartesi ´10 03:31
<td valign="top"><img src="mail_logo.gif"  alt="Logo" width="52" height="43"  border="0" /></td>
Şuradaki Kodu görüyorsun "mail_logo.gif" diyor. sen kendi img'ini istersen upload et linkini oraya ekle. sorun çıkmaz.
Üye Resmi imagemaker
17 Eylül Cuma ´10 10:26
ellerinize sağlık gerçekten çok yardımcı oldu teşekkür ederim. ancak benim bir sorum olacak. html olarak hazırladığım imza dosyamın mailimde sadece txt olan kısmı görülüyor. ayrıca eklemiş olduğum jpg dosyasını tanımsız dosya olarak görünüyor. (sol üst köşesinde çarpı olan açılmaz dosya) html dosya ile içinde belirtilen jpg resim aynı klasörde yine de resim görünmüyor sadece txt olan kısmı çıkıyor. bu konuda ne yapabilirim. şimdiden teşekkür ederim.
21 Eylül Salı ´10 14:34
imajların muhtemelen bir yerlerde host edilip oradan ayarlanmamıştır. Yani buradaki kod örneğinde sadece e imza epostasını şekilendirmek anlatılıyor. Dikkat ederseniz dokuman içinde, imzanızdaki majların bir public domain altında yayınlanacak şekilde bir yerlere konulup html kodda o domaindeki full path'leri ayarlanması gerektiği yazıyor. Tahmin ediyorum ki o kısımlardaki ayarlamalarda atladığınız bir kısım var.
Üye Resmi Nikola Tesla
9 Aralık Perşembe ´10 11:45
Maalesef Outlook 2007 ve sonrasında HTML formatı kullanılamıyor. HTML olarak hazırladığınız imzayı tarayıcıda açıp kopyala - yapıştır yapabiliyorsunuz ancak bu durumda HTML özellikleri yok oluyor.
Üye Resmi savaş avcı
10 Ocak Perşembe ´13 13:10
merhaba. basitce facebook ve twitter adresimi eklemek istedim. fakat sadece sttekine gidiliyor. adları görünüyor imzada ama tıklayınca sadece ilki neyse ona gidiyor. nasıl çözebilirim? maillede yanıtlarsanız sevinirim. çünki sitenizde güvenlik kodu sorunu var. firefoxda kullandığım güvenlik kodu çözme eklentisi sitenizi çözemediğinden ancak bir gören bulursam iletişim kurabiliyorum butarz sitelerle. çünki ben görme engellil bir bilgisayar kullanıcısıyım. kod şöyle.

1. <form action="https://facebook.com/savasci1907">
 <input type="submit" value="facebook" /> <br>
2.<form action="https://twitter.com/savasci1907">
 <input type="submit" value="twitter" /> <br>
bunlar alt alta duruyor dosyada. ama üste hangisini koyarsam ileti alıcısı ona gidiyor. fakat adları yazıyor.
şimdiden teşekkürler.
Üye Resmi Sami Arslan
29 Mart Cuma ´13 04:53
Web mail de bu dediğiniz oluyor mu acaba ? Ben yapamadım   :-)
Üye Resmi dekoristanbul
21 Nisan Pazar ´13 08:22
paylaşım için teşekkürler, arkadaşlar.
Üye Resmi Emre Kaya
11 Ocak Cumartesi ´14 01:42
Çok yararlı bir paylaşım teşekkürler. Ancak benim takıldığım bir yer var. Ben oluşturduğum görselde link vermek istiyorum. Dreamweaverda yapıyorum fakat görseli resim sunucusundan çektiğim için sanırım olmuyor. Bunu nasıl aşarım.

Yani sunucudan çektiğim görselde bir bölüme link vermek istiyorum (facebook logosu) fakat olmuyor.
Üye Resmi TabloStick
4 Eylül Perşembe ´14 02:24
Teşekkür ederiz kesinlikle es geçilmemesi gereken bir durum
Yeni Yorum *
İletişim Bilgileri
*
*
E-Posta adresiniz gösterilmeyecektir.
(unut)
Güvenlik Kodu *

Gönderiliyor