25 Haziran 2011 Cumartesi

Site Trafiğini Arttırmak ve SEO (Search Engine Optimization)

seo
Web sitesi hazırlamak göründüğünden daha zor, oldukça zahmetli bir iştir. Etkileyici, kullanışlı ve güzel bir görünümü elde etmek bir yana, hazırlanan içeriğin siteye yüklenmesi ve kullanıcılara sunulması ayrıntılı ve yoğun bir çalışmayı gerektirir. Buna ek olarak hazırladığınız sayfa her web tarayıcı için farklı yorumlanacağından(yaptığınız tasarımlar tüm web tarayıcılarda aynı görünmeyebilir) tarayıcı uyumunu sağlamak, web sitesini ziyaretçiler tarafından kullanılması muhtemel web tarayıcı model ve sürümlerinde en doğru biçimde görüntülenmesini sağlamak, site tasarımının zor taraflarıdır. Tüm bu zahmetlere karşılık web sitesi istatistiklerinin yerlerde sürünmesi, ziyaretçi sayısının düşüklüğü, tüm bu çalışmaları yapan; işin külfetini çeken kişi ya da kişiler için büyük bir hayal kırıklığı ve üzüntü kaynağıdır. Emeklerinizin boşa gitmemesi ve sitenizin amacına yani ziyaretçilerine ulaşabilmesi için yapmanız gereken çok önemli üç şey var.

1-Sitenizi google, yahoo ve bing gibi arama motorlarına kaydedin, indeksleyin.

2-Sitenizin bilinirliğini arttırın; mümkünse reklam yapın.

-Çeşitli forum ve sosyal paylaşım sitelerine(Donanım Haber, Facebook. Twitter gibi) üye olun reklamınızı yapın.

-Bloxoo, Bumerang gibi blogların listelendiği, paylaşıldığı sitelere üye olun ve bloğunuzu tanıtın.

-Google AdWords ile ücret karşılığı web sitenizin reklamını yapabilirsiniz.

3- Site tasarımınız arama motorlarına uygun hale getirin.

-Title, meta tag ve etiketler kullanın.

Title: Buraya yazdığınız yazı web tarayıcının başlık kısmında görüntülenecektir. Site ana başlıklarını buraya yazabilirsiniz. Title içinde sitenizde olmayan içeriklerle ilgili kelimeler kullanmayın. Arama motorları buna kızar.

Meta Tagı: Burada keyword ve description olarak anahtar sözcükler kullanılır. Arama motorları burada yazan kelimeleri sitenizi tanımlamakta kullanırlar. Şunu unutmayın buraya yazdığınız anahtar sözcükler site içeriği ile uyumlu olmalıdır.

Etiketler: Eklediğiniz içeriği anahtar sözcüklerle etiketleyin. Kullandığınız etiket sözcüklerini site içeriğinden seçerseniz arama motorları sitenizi o içerik ile ilgili aramalarda daha üst sıraya koyarlar. Aynı şekilde burada da konu ile alakasız etiket sözcükleri kullanmamaya dikkat edin.

-Eklediğiniz resimlere konu ile ilgili alternatif metinler yazın.

Mesela ben bu sayfaya seo.jpg isimli bir resim ekledim. Bunun için yaptığım kodlama şu şekilde oldu;

< img src=”seo.jpg” alt=”seo”/>

Siz de kodlamayı bu şeklinde yaparsanız sitenize koyduğunuz resim arama motorları tarafından verdiğiniz isim altında indekslenir. Eğer resme verdiğiniz alt metin konu metnindeki önemli sözcüklerden biri olursa internette o konu ile ilgili görselleri arayan bir kullanıcı rahatlıkla resim dosyanıza ulaşır. Arama motoru resim dosyanızı konu ile ilgili diğer resimlerin arasında gösterir. Böylelikle resimler aracılığıyla sitenize ulaşmış olurlar.

24 Haziran 2011 Cuma

Web Sitesi İçin Translater (Javascript Translater)

Web sitenizi dünyaya açmak yabancı kullanıcıların da site içeriğinizden faydalanmasını sağlamak istiyorsanız web sayfanıza dil seçenekleri koymak zorundasınız. Bunu sağlamak için elinizde üç seçenek bulunmakta (ya da en azından benim bildiğim bu kadar)
  1. Sitenin her sayfası için farklı dillerde HTML dosyaları oluşturmak
  2. İnternetten bulacağınız ASP ya da PHP tabanlı yazılmış bir çeviri programını kendi sunucunuza entegre etmek
  3. Google Translate kullanmak

İlk seçenek ufak çaplı siteler için uygulanabilir. Ama pek de verimli olmaz.

İkinci seçeneği tercih etmek daha mantıklı. Ancak bu tip programların ücretsiz olanlarından bulmak kolay mı? Ücretsiz yazılımlar ne kadar verimli? denemeden bilemeyiz. Bunun haricinde ücretli programlardan/servislerden de faydalanılabilir. Ayrıca Joomla, Moodle, gibi web portalları kullanıyorsanız bu portalların dil paketlerini sunucuya yükleyerek de kullanıcılar için farklı dil seçenekleri oluşturabilirsiniz. Ancak bu sadece sayfa şablonuun ve bu şablona bağlı üyelerin görünümünü etkiler, içeriğiniz yine aynı kalır. Burda amacım şablonu da dahil olarak tüm siteyi istenen dile çevirmek.

Üçüncü seçenek benim gibi bedavacılar için... Diğer iki seçenekte bahsedilen işlemler sitenin sunucu kısmında(host üzerinde) gerçekleştirilir. Eğer benim gibi Blogger kullanıcıysanız maalese size ulaşabileceğiniz bir host alanı verilmiyor. bu durumda alternatif yollara başvurmanız gerekiyor. Bloggerın sunduğu bazı Gadget'lar bu sorun için çözüm olabilse de Bu gadgetlar ile birlikte gösterilen reklamlar, gadgetın sayfa tasarımına uymuyor oluşu dil bloguna seçeneği koymak isteyen bir blog sahibi için büyük bir problem. Tabii ki bu elimizin kolumuzun bağlı olduğu anlamına gelmiyor. İşte tam bu noktada Google'un çeviri servisi olan Google Translate imdadımıza yetişiyor. Bilindiği gibi bu servis sadece metinleri değil, tüm site içeriğini istenen dile çevirebiliyor. siteyi komple çevirmek için tek yapmamız gereken sitenin tam adresini çeviri kutucuğuna yazmak. Google tüm siteyi otomatik olarak, büyük bir doğrulukla istediğiniz dile çevirecektir. Ancak ziyaretçilerinizden bunu yapmalarını isteyemezsiniz.

İşte ben de tam bu noktada şunu düşündüm. Acaba javascript kullanarak(Javascript kullanıcı tarafında çalıştığı için yukarıda saydığım hosting ve yükleme sorunum olmayacak)bunu otomatik olarak yaptırabilir miyim? Yani ziyaretçi aynı diğer büyük sitelerde olduğu gibi, dil seçeneği menüsünden tek bir tuşa basarak tüm siteyi istediği dile çevirmesini sağlayabilir miyim? Bu düşünce üzerine küçük bir araştırma yaptım ve şu sonuçlara ulaştım,

-İlk olarak google translate'nin nasıl çalıştığını, çeviri ile ilgili sorgulamaların google çeviri sunucusuna nasıl yollandığını araştırdım. Türkçe'den İngilizce'ye çevirmesi için çeviri kutusuna bir metin ya da site adresi yazdığımda bu bilgiler sunucuya şu şekilde gönderiliyordu,

"http://translate.google.com/translate?hl=tr&sl=tr&tl=en&u="

Adres çubuğunda bu ifadenin karşısında çevirlmesi için yazdığım metin ya da site adresi yazıyordu. Böylelikle google sunucusuna sorgu göndermenin yolunu da bulmuş oldum. Yukarıdaki kod sadece ingilizce için geçerlidir. Diğer dillerin kodunu elde etmek için de ayrıca çeviri işlemleri yaptırılmalı ve adres çubuğunda baştan çeviri metnine kadar olan kısım kopyalanmalıdır. Bu şekilde google'un sunduğu tüm çeviri seçenekleri elde edilebilir.

-Sonra bunu javascript'e otomatik olarak nasıl yaptırabileceğim üzerine çalışmaya başladım. Yazacağım program iki şey yapmalıydı,

  1. Kullanıcı herhangi bir dili seçtiğinde program sitenin o anki sayfasına ait url'yi adres çubuğundan kopyalamalı ve bir değişkene aktarmalı
  2. Sonra da bu değişkenin değeri ile google'dan aldığımız o dille ilgili kodu birleştirip ardes satırına yazmalı ve googe sunucusuna dil sorgulamasını yollamalı
İşte aşağıda yazdığım kodlar bu işi yapıyor. Kulanıcı herhangi bir butona bastığında o butonla ilgili bir fonksiyon çalışıyor. Seçeneklerdeki her dil için ayrı bir fonksiyon yazdım. Hepsi temelde aynı işi yapıyor sadece değişken isimleri ve dil sorgusu için kullandığı kodlar farklı. dil sorgusu için kullanılan kodlar turuncu renkle renklendirilmiştir. Bu program üç dil için yapılmıştır. istenirse aynı mantıkla diğer diller de eklenebilr.

<div style="heigth:23px;">
<script language="javascript" type="text/javascript">
function eng(){
var a
a=document.location.href;
parent.location.href='http://translate.google.com/translate?hl=tr&sl=tr&tl=en&u=' +a
}

function ger(){
var g
g=document.location.href;
parent.location.href='http://translate.google.com/translate?js=n&prev=_t&hl=tr&ie=UTF-8&layout=2&eotf=1&sl=tr&tl=de&u=' +g
}

function frn(){
var f
f=document.location.href;
parent.location.href='http://translate.google.com/translate?js=n&prev=_t&hl=tr&ie=UTF-8&layout=2&eotf=1&sl=tr&tl=fr&u=' +f
}


</script>
<input type="button" value="" onclick="eng()" style=" background-image:url(ingiliz.jpeg); width:26px; height:22px; cursor:pointer; " title="English" /><input type="button" value="" onclick="ger()" style="background-image:url(alman.jpeg); width:26px; height:22px; cursor:pointer; " title="German" /><input type="button" value="" onclick="frn()" style="background-image:url(fransiz.jpeg); width:26px; height:22px; cursor:pointer;" title="French" />

</div>

Bu kodlamanın sonucunda oluşturulan javascript dil menü çubuğu şu şekilde görüntülenir,