Merhabalar, MyBB’de temalarınız için oluşturduğunuz logoları SEO uyumlu hale getirmek için birkaç ipucu bulunmakta. Çoğunlukla karşılaştığım tasarımlarda tema yapımcıları ekledikleri logoları standart img etiketi kullanarak ekliyorlar. Bazıları xHTML standartlarına uygun olarak kodluyor, bazılarıysa xHTML’in yanından bile geçmiyorlar. İşte bugün bu yazıda SEO ile ilgili birkaç ipucu vereceğiz.
Öncelikle SEO uygulamak istediğimiz sitemizin hedef kelimesini ön plana çıkararak derse başlayalım. Ben “MyBB” kelimesini seçerek uygulamaya başlıyorum. İlk önce kullanılmaması gereken yöntemi göstereceğim.
Kullanılmaması Gereken
1 | <a href="{$mybb-settings['bburl']}/index.php"><img title="MyBB" src="{$theme['logo']}" alt="MyBB" /></a> |
Tavsiye Edilen
Bunun için biraz CSS bilgisi gerekiyor arkadaşlar. O yüzden CSS ile kodlamamıza başlayalım. Öncelikle logo adında bir ID tanımlıyorum ve bu ID için arkaplan, genişlik – yükseklik ve ek öznitelikler giriyorum:
#logo { width: 400px; height: 82px; float: left; } #logo h1 a { background: url(images/logo.png) no-repeat center left; width: 400px; height: 82px; display: block; text-indent: -9999px; } #logo h2 { display: none; } |
Yukarıdaki kodları incelediğinizde #logo için h1 ve h2 başlıkları ekledim. Yani logo adlı ID içerisinde H1 ve H2 etiketlerini kullanacağız, ki bu etiketlerin SEO açısından önemi çok büyüktür. Arama motoru botları tarafından bu etiketler okunarak websitenizin önem verdiği anahtar kelimeler belirlenir.
Şimdi yazdığımız CSS için logomuzu xHTML kullanarak kodlayalım:
<div id="logo"> <h1><a title="MyBB" href="{$mybb-settings['bburl']}/index.php">MyBB</a></h1> <h2>MyBB</h2> </div> |
H1 ve H2 etiketlerini kullanarak web sayfamıza logomuzu eklemiş olduk. Bu sayede websitemiz SEO açısından daha iyi bir konuma geldi. Sizlere de tavsiyemiz bu şekildedir. Hepinize bol hitli günler dilerim. Görüşmek üzere…
