Arayüz Geliştiricileri için SEO İpuçları

Kişilerin ve markaların SEO’nun önemini henüz kavramaya başladığı, web sitelerinin SEO uyumlu olmasını istediği şu günlerde, SEO konusunda bilgi sahibi olmak ve SEO uyumlu arayüzler kodlayabilmek arayüz geliştiricileri için çok büyük önem taşıyor.

Bu sebeple, SEO ile yakından ilgilenen bir arayüz geliştiricisi olarak, arayüz geliştiricilerinin bir tasarımı dökerken genel olarak dikkat etmeleri gereken bazı SEO kriterlerini tek bir yazıda toplamanın SEO konusunda fazla bilgi sahibi olmayan arayüz geliştiricileri için faydalı olacağını düşündüm.

HTML’i Geride Bırakıp (X)HTML ile Tanışın!

(X)HTML, HTML’i ortadan kaldırmak adına W3C tarafından 2000’li yılların başında tanınmasına rağmen birçok arayüz geliştiricisi tarafından doğru bir şekilde kullanılmamaktadır. Arayüz kodlarının daha anlaşılır, daha kolay ve daha işlevsel bir şekilde olmasını sağlayan (X)HTML yapısı, HTML’in aksine açılan etiketi kapatma ve XML yapısına uygun kodlama istemektedir. Bu sayede, arama motorları belirli etiketler arasında yer alan içerikleri daha kolay ayırt edebilmekte ve (X)HTML ile kodlanan internet sitelerini arama sonuçlarında daha üst sırada listelemektedirler. Örnek olarak,

<p>Arayüz Geliştiricileri için SEO İpuçları

Şeklinde bir HTML kodlamasını ele alacak olursak, bu kodlamada p etiketi ile başlanılan paragrafın kapama etiketi bulunmadı için arama motorları paragrafın nerede bittiğini algılayamazlar. Ancak,

<p>Arayüz Geliştiricileri için SEO İpuçları</p>

gibi (X)HTML yapısına uygun bir kodlamada arama motorları paragrafı kolayca algılayabilmekte ve bu sayede içeriği daha sağlıklı bir şekilde indexleyebilmektedirler.

CSS Sprite Tekniği ile Sorgu Sayınızı Azaltın

CSS Sprite Tekniği, bir web sayfasında yer alan görsellerin birleştirilerek tek bir görsel dosyasında tutulmasıyla, web sayfası içerisinde yer alan sorgu sayısını azaltarak sayfanın daha hızlı  bir şekilde açılmasını sağlayan oldukça önemli bir tekniktir.  Bu teknik sayfanızdaki sorgu sayısını azaltmakla beraber, sayfa içerisindeki kod fazlalıkların kurtulmanızı da sağlamakta ve görsel ağırlıklı tasarımların SEO uyumlu hale gelmesinde oldukça önemli bir rol oynamaktadır.

Hiyerarşik Yapıya Özen Gösterin

Ziyaretçiler gibi arama motorları da bir web sayfasını yukarıdan aşağıya doğru indexlemektedirler. Bir ziyaretçi nasıl gözüyle gördüğü bir web sayfasının içeriğinde alt başlığın ana başlığın üzerinde olmasından hoşlanmaz ise, arama motorları da aynı şekilde kodlarda böyle bir içerikten hoşlanmazlar. Bu sebeple, hazırladığınız web sayfası içerisinde kısaca H etiketleri olarak adlandırdığımız Heading etiketlerinin hiyerarşik yapısına özen göstermeniz gerekmektedir.

Yani, sayfa kodlarına yukarıdan aşağıya doğru bakıldığında H etiketleri küçükten büyüğe doğru yer almalıdır. Örnek vermek gerekirse, H2 etiketinin üstünde H3 etiketinin yer alması ya da H1 ve H3 etiketi kullanılmışken bu iki etiket arasında H2 etiketinin yer almıyor olması sitenizin arama motorları tarafından sevilmemesine sebep olacaktır.

Listeleme Kullanın

(X)HTML yapısından bahsederken, arama motorlarının belirli etiketler arasında yer alan içerikleri daha kolay ayırt edebildiğine değinmiştim. Bu etiketlerin en önemlilerinden olan liste etiketleri, web sayfalarının arama motorları tarafından özellikle ayırt edilmesi istenilen bölümlerinde çok büyük önem taşımaktadır. Örnek vermek gerekirse; birçok web sayfasında yazı alanlarının altında yer alan tarih, okunma sayısı ve kategori gibi alanların belirli bir sınıfı olan liste etiketleri ile belirtilmesi, arama motorlarının bu alanları kısa sürede esas içerikten ayırmasını sağlamakta ve bu sayede esas içeriğinizin değeri oldukça artmaktadır. Aşağıda belirli sınıflar atanmış örnek bir listeleme yer almaktadır.

<ul class=”yazibilgisi”>

<li class=”tarihcan”>Tarih</li>

<li class=”kategorican”>Kategori</li>

<li class=”yazarcan”>Yazar</li>

</ul>

Önce İçerik!

Arama motorlarının ziyaretçiler gibi web sayfanızı yukarıdan aşağıya doğru indexlemesi sebebiyle, sayfa içeriğinizin mümkün olduğu kadar yukarıda yer alması gerekmektedir. Bu sayede içerikle kısa sürede tanışan arama motorları, ziyaretçilerinizin de içeriğiniz ile kısa sürede tanıştığını düşünerek sayfanıza ve içeriğinize büyük önem gösterecektir. Bu kritere özellikle WordPress gibi hazır sistemlerin tema kodlarında dikkat etmek, içerikten önce sağ-sol bölümlerin kodlamalarını yapmamak gerekmektedir.

Arkaplan Linklemeden Uzak Durun!

Arayüz geliştiricilerinin işi bir nebze de olsa kolaylaştırmak adına sık olarak uyguladığı tekniklerden bir tanesi de arkaplan görselleri üzerine linkleme yapmaktır. Bu linklemelerde ziyaretçileriniz sayfa içerisindeki görseli görerek linkin hangi nesneye verildiğini algılayabilirler ancak arama motorlarının göreceği boşluğa verilmiş linkler olacaktır ve bu sebeple sayfa içerisinde yer alan linklemeleri spam olarak algılayacaklardır. Sitenizi daha sağlıklı bir kod yapısına kavuşturarak arama motorları tarafından sevilen sayfalar oluşturmak adına, arka plan linkleme işleminden uzak durmanız gerekmektedir.

Özgün Kodlama Yapın!

Bir sayfanın içeriğinin özgünlüğü kadar tasarımının özgünlüğü de arama motorları tarafından oldukça önemlidir. Günümüzde sayfa içeriğinin özgün olup olmadığını başarıyla kontrol eden arama motorları, gelişen alt yapılarıyla beraber site tasarımının özgünlüğünü de kolay bir şekilde algılayabilmektedir. Ziyaretçiler gibi sayfaları görsel olarak algılayamayan örümcekler, sayfanın ve sayfaya çağrılmış diğer dosyaların içerisinde yer alan kodları inceleyerek bu kodların özgünlüğünü tasarım özgünlüğü olarak değerlendirmektedir. Bu sebeple, özellikle CSS sınıflarınızın isimlerini özgün tutmanız, sayfanızın arama motorları tarafından özgün bir sayfa olarak algılanmasını ve bu sayede arama sonuçlarında daha üst sıralarda yer almasını sağlayacaktır.

SEO Uyumlu Arayüz Kodlamak

Yukarıda yer alan kriterlere ek olarak, site açılış hızını etkileyen diğer kriterlere de kodlama işlemi sırasında dikkat etmek oldukça önemlidir. Bu sebeple, SEO uyumlu arayüzler geliştirmek isteyen arayüz geliştiricilerine görselleri optimize etmek, javascript ve css dosyalarını düzenlemek gibi birçok farklı konuda bilgi alabilecekleri, Kaan Gülten tarafından yazılan Site Hızlandırma Teknikleri makalelerini de önermekteyim.

Devamı: Arayüz Geliştiricileri için SEO İpuçları – 2

Bir Cevap Yazın