Etkileşimli Arama Motoru Optimizasyonu Rehberi

Başarılı seo çalışmaları konusunda örnekleri çoğaltmak mümkün. Çoğunda web tasarımın en temel konuları olan çözünürlük, renk kullanımı, tipografi, kullanılabilirlik (usability), yaratıcılık gibi konuların adı bile geçmiyor. Peki dünyanın geri kalanında web tasarımı ne anlama geliyor? Şu bilgi akıllarda yeterli bir şekil oluşturacaktır.

Web tasarımcısı için bırakın Java, C# bilmeyi JavaScript ve HTML bilgisi bile bir şart değil sadece tercih sebebi. Neden? Çünkü, evet çünkü web uygulaması gibi bir projeyi gerçekleştirmek farklı disiplinlerin uyumlu çalışmasını gerektiriyor.

Bu durumda herkes kendi işini, en iyi bildiği işi yapıyor. Zaten bir tanesinde uzman olmak yeterince marifet gerektiriyor. Bu durumda kendi konusuyla ilgili gelişmeleri takip edebilen, işinin ehli kişiler bir araya gelerek ortaya her açıdan tatmin edici ürünler ortaya çıkarabiliyorlar.

Peki, çoğumuzca web tasarım diye geçiştirilen işlemler zinciri profesyonel ortamlarda kimler tarafından nasıl gerçekleşiyor? Bir web uygulaması şöyle oluşuyor: Müşterinin dileklerine göre müşteri temsilcisi ya da proje yöneticisi içeriğin oluşturulmasında rol alıyor ya da yardımcı oluyor, yol gösteriyor.

Etkileşim tasarımcısı (interaction designer) bu içeriğin en etkili sunumu için kullanılabilirlik (usability) çerçevesinde çözümler geliştiriyor. Mesela ekranda şu sahnede şu bilgiler ve linkler olmalı ve bunlara şu şekilde ulaşılabilmeli gibi. Bu bir belge haline getiriliyor. Bu etkileşim mekanizmasına gösterişli bir yüz giydirmek ise bizim meşhur web tasarımcı diye adlandırdığımız kişinin işi.

Web tasarımcı sadece grafiklerle, görsellikle (varsa gerektiğinde işitsel unsurlarla) uğraşıyor teknik detayları bilmesi gerekmiyor, teknik konuları sadece teknik elemanlara danışıyor. Yaptığı ‘tasarımı’ diğer gruplarla ve müşteriyle paylaşıp teyid aldıktan sonra iş bu grafiklerin kesilerek web geliştiriciye (ıveb developer) aktarılmasına geliyor.

1.Aşama Web Tasarım

Web-Design-and-SEO Başından beridir bilişimle ilgili terimlerde bir kavram karmaşasıdır gidiyor. Bazı terimler dilimize öyle bir yanlış yerleşiyor ki bir daha düzeltebilene aşk olsun. Mesela bilişim alanında çok sık kullanılan İngilizce terim default’a Türk Dil Kurumu’ nun bulduğu karşılık ‘varsayılan’. Yani gerçekte olmayıp da varmış gibi düşünmemiz gereken şeyler için kullandığımız kelime! Bu karşılığın ne derece uygun olduğu tartışılır.

Zira default, aslında başka bir değer verilmediği sürece, aksi belirtilmedikçe anlamını taşıyor. Varsayılan ifadesi şimdiye kadar karşılaştığım defaulfhnn yüzde 80′ inde yetersiz, bozuk anlamlı, hatta gülünç kalıyor. Örnek “ Web tarayıcısındaki ‘varsayılan’ JVM …” Buna bakarak tarayıcıda JVM yok da biz mi varsaymalıyız, yoksa tarayıcının içinde yüklü bulunan JVM’ lerden aksi belirtilmedikçe kullanılması gereken mi kasdediliyor?

Önseçili, olağan ya da öntanımlı terimleri default için daha uygun birer karşılıkmış gibi geliyor. Kavram kaymalarında belki de en çok rahatsız edeni “ web tasarım ” lafının akıllarda, olduğundan farklı bir anlam bırakması ve yanlış kullanımının sınır tanımaması.

Oysa Web Tasarımı tamamen Web Design ifadesinin birebir karşılığı olup bütün dünyada aynı anlama gelmekte: Bir web uygulamasının görsel (ve/veya işitsel) yönden, sanatla ilgili kısmının tasarlanması ve oluşturulması. Yani temelde bir sanat dalı. Oysa bizde nedense web tasarımı denince akla web sayfası yapımı geliyor! Kişi seo uygulamasının oluşturulmasında hangi görevi alırsa alsın, ister programcı olsun ister mühendis adı web tasarımcı!

2.Aşama Seo Çalışmalarınıza işlevsellik kazandırın

seoislevsellik Seo çalışmaları sırasında uygulamanızda sunum ve içerik birbirinden ayrı kurgulanmış olmalı. Dekoratif tüm bilgi CSS tanımlarında taşınıyor olmalı. Uygulamanız işlevsellik ve ulaşılabilirlik açısından opsiyonel teknolojiler re, istemcitaraflı betik ya da CSS’e bağımlı olmamalı. CSS kodlarınız ayrı bir belge içinde yer alıyor olmalı ve XHTML içinde olmamalı.

XHTML ve CSS kodlarınız geçerlik testinden başarıyla geçmiş olmalı. XHTML belgeniz mümkünse Strict, değilse en azından Transitional varyasyonunu kullanıyor olmalı. Frame ya da iframe benzeri çerçeve elemanları kullanılmıyor olmalı. Dolayısıyla Frameset varyasyonu kullanılmıyor olmalı.

Belgeleriniz geçerli bir belge başlığına sahip olmalı. Belgelerinizde karakterset ve dil tanımı yapılmış olmalı. Her sayfanın kendi ünik başlığı olmalı. CSS id ve sınıf değerleri için anlamlı isimler kullanın.

Kodlarınız anlamına uygun (şematik) olarak yazılmış olmalı. Paragaraflar px/p imleri içinde yuvalanmış olmalı. Araları br imleriyle ayrılmış olmamalı. Kalın harf ile vurgu yapılacak içerik için erre ya da strong imleri kullanılmalı. Listeler ol ya da ul imleri içinde olmalı. Sup, sub ve p imlerini kullanmaktan kaçının. Görsel bir bilgi için yardımıyla alternatif metin bilgisi de verilmeli. Buna resim haritaları (imagemaps) da dâhil.

Arama motoru optimizasyonu sırasında içerik ve fon arasında yeterli kontrast kullanın. Linkleriniz için yeterli ve algılanabilir metin kullanılmalı. Linkleriniz sayfadaki diğer metinlerden ayırtedilebilir olmalı. Linklerinizde kullanıcı için olası sürprizler hakkında daha tıklanmadan yeterli bilgi verilmeli. Link ve form elemanları için sekmeler kullanılabilir durumda olmalı. Linkler için gerektiğinde kısayol tuş tanımları kullanılmalı.

Çalışmalarınız sırasında elemanların sınır, kenar boşluğu ve dolgu değerlerini atarken kutu modelini iyi anlamış olmanız gerekir. Bir elemanın sayfa içindeki genişliği (ya da yüksekliği) width ve height değerlerine ilaveten border ve padding değerlerinin eklenmesi ile ortaya çıkar. Editörünüzün ya da tarayıcınızın geliştirmede kolaylık sağlayan gereç ve eklenti uygulamalarından faydalanın. Bu uygulamalar seo çalışmaları sırasında çok işinize yarayacak.

Bazı durumlarda hedeflediğiniz sonuca ulaşamayabilirsiniz . Bunun sebebi muhtemelen tarayıcının kodlarınızı sizin düşündüğünüzden farklı yorumlamasındandır. Bu gibi durumlarda div imlerinize geçici olarak farklı fon renkleri atayarak sonucu gözlemlemek sorunların sebebini bulmanızda yardımcı olacaktır.

Blok seviye elemanlarla, satır içi elemanların farklı davrandıklarını gözden kaçırmayın. Float özelliğiyle hizaladığınız elemanlardan sonra ‘temizlikçi’ elemanı koymak çoğu sorunu halledecektir.

Bu noktaya kadar okuyarak ve bilgileri özümseyerek geldiyseniz erişilirlik kavramının ne anlama geldiğinin ve niçin önemli olduğunun, web uygulamalarını erişilir kılmak için neler yapmanız gerektiğinin bilincinde olduğunuzu umuyorum. Umduğum bir başka şey ise bu az öz kitabın çalışmalarınızda size yardımcı olabilmesi.

Hiçbirşeyin kendiliğinden zahmetsizce olmadığı hayatta, bu bilgilerin çalışmalarınıza uyarlanmasında bazı zorluklarla karşılaşabilir, yazının eksik kaldığı noktaları tecrübe edebilirsiniz. Böyle durumlarda tecrübeli kişilerden yardım isteyebilir, web’ de ya da farklı ortamlarda çözüm arayışına girişebilirsiniz. Merak ettiğiniz websitelerin kaynak kodlarını çalışmanın iyi bir alışkanlık olduğunu ve deneyiminizi arttıracağını unutmayın.

Web uygulamalarınızın erişilirliğini kontrol ederken pratiklik açısından, derlenmiş bu listeden faydalanabilirsiniz. Liste içeriğinin bağlacıyı hiç bir özelliği bulunmadığını ve liste başlıklarının kurum ve kişilere göre değişiklik gösterebileceğini aklınızdan çıkarmayın lütfen.

Sitenizin Seo Uyumlu Olduğunu Ne Kadar kontrol Ediyorsunuz?

css_for_seo Web sayfalarınıza ekleyeceğiniz CSS uygulamalarınızı yazarken dikkat etmenizi gerektirecek ya da işlerinizde size kolaylık sağlayacak bir kaç hususa değinmek istiyorum.  Bu hususlar seo açısından büyük önem teşkil etmektedir. CSS’ te en dikkat edilmesi gereken konu aynı sayfa elementine birden fazla stil tanımlanması konusudur. Mümkün olduğunca bu durumdan kaçınmaya çalışın. Aynı sayfa nesnesi için birden fazla stil tanımı yapmayın.

CSS büyükharf / küçükharf duyarlıdır. Bu sebeple seo çalışmaları sırasında bu kurala dikkat etmeniz gerekmektedir. Mümkün olduğunca az sayıda stil tanımlaması kullanın. Web sitenizin stilini mümkün mertebe linkli ekleme metoduyla kullandığınız ayrı kaydedilmiş CSS belgesi ile kontrol edin. Bu durumda merkezi bir kontrol birimi oluşturmuş olursunuz ve aynı stil tanımını her bir sayfa için tekrar tekrar yazmak zorunda kalmazsınız.

CSS belgelerinizi kullanmadan önce geçerlik testine tabi tutun. Farklı tarayıcılarda test edin. Hala istediğiniz gibi değilse rötuşları yapın. Komutuyla bir CSS tanımı içinden harici CSS tanımlarını çağırmanız mümkündür. Bazı geliştiriciler CSS tanımlarını yorumlayamayacak eski tarayıcılardan saklamak için bu komutu kullanırlar. CSS tanımınızda öimport en üstte yer almalıdır yani ilk komut olmalıdır.

CSS kodlarınızı mümkün olduğunca tertipli ve düzenli yazmaya çalışın. Gerek gördüğünüz durumlarda içerisine not düşün. Kendinize uygun standartlar belirleyin ve uygulayın. Tüm CSS özelliklerinin tüm işletim sistemleri ve web tarayıcıları için kullanılabilir olmadığını aklınızdan çıkarmayın.

Tarayıcıya özel özellikleri kullanmaktan kaçının. Eğer ayrı bir CSS dosyası kullanıyorsanız bu dosyanızı web sayfanıza ( linkli ekleme metodu ile) eklerken yazacağınız yol adresinin doğruluğundan ve dosyanızın yol adresi ile tarif edilen yerde olduğundan emin olun.

Yazı dizimizin bu bölümünde de bahsi geçtiği üzere uygulamaların farklı istemciler için erişilir olabilmesi ancak içerik ile sunumun ayrı olmasını gerektirir. Seo uyumlu içerik sitenize oldukça fazla katkı sağlayacaktır. Bu sayede farklı tip platform, yazılım ve donanımlar için aynı içeriği farklı sunumlarla şekillendirmek mümkün olabilmektedir.

Stil Tanımlama ve CSS

CSS’ te uygulamanızın algılanacağı ya da görüntüleneceği farklı araç (media) tipleri için farklı stil tanımları oluşturmanıza imkân tanıyan düzenlemeler mevcuttur. Bunun için iki yöntem bulunmaktadır. Stil tanımları arama motoru optimizasyonu sırasında dikkat edilmesi gereken bir konudur.

Bunlardan birincisi her bir araç tipi için farklı birer stil belgesi hazırlamak ve bunları CSS ekleme yönteminde belirtmek. İkincisi ise aynı stil belgesi içinde farklı araç tipinin kullanacağı tanımları belirtmek. Yukarıdaki CSS ifadesine göre paragraf metni ekranda 1 em, yazıcı çıktısında 0.75 em görünecek. Her iki araç tipinde de başlıklar 1.5 em olarak görünecek.

Her tarayıcı modelinin her CSS özelliğini aynı şekilde yorumlamadığı bilinen bir gerçektir. Bazı durumlarda bu yorum farkı uygulamanızın farklı tarayıcılarda farklı görüntülenmesine sebep olabilir. Erişilirlik açısından bakılacak olursa uygulamalarınız farklı tarayıcılarda (farklı şekillerde bile olsa) erişilir oldukları sürece sorun yoktur.

Bazı geliştiriciler bu farklılıkları yok etmek için CSS atlatma yöntemleri (CSS Hacks) kullanırlar. Bu yöntemlerin temeli bilinçli olarak yanlış CSS kodu yazarak tarayıcıların tolerans farklılıklarından faydalanmak üzerine kuruludur.

Dolgu değerinin Internet Explorer için 2 piksel diğer tarayıcılar için 4 piksel olarak algılanmasını sağlayabilir. Benim şahsi görüşüm projeyi en baştan ele alırken CSS atlatma yöntemlerine gerek kalmayacak şekilde kurgulamanın her zaman için mümkün olduğu, gerçekten gerekmediği sürece bu yöntemlere itibar edilmemesi gerektiği yönünde.

Semantik Uygulamalar ile Seo Gücünüzü Arttırma

semantic-seo

CSS tanımında siteniz için en özgün olandan en genel yazı tipi ailesine doğru bir kaç yazı tipini bildirin. Metinlerinize uyarlamak istediğiniz her türlü görsel etki için sadece CSS kullanın. Metnin orijinali olan içeriği değiştirmeyin. Arama motoru optimizasyonu sırasında Css kodlama yapısına dikkat etmelisiniz.

Örneğin harfler arasında uzaklık oluşturmak için boşluk karakteri kullanmayın. CSS kullanarak herhangi bir içeriği büyükharf olarak sunabilmek bile mümkündür. Ekranda blok başlığı büyük harfle görünüyor.

Tablosuz bir kodlamada, bir sitenin sunumu için sayfa elemanları ya da blokların arasındaki mesafelerin CSS tanımları içinde ayarlanması gerekir. Bu işlemler için kullanılan CSS özellikleri kenar boşlukları (marjinler), dolgular ve sınırlarla ilgili olanlardır. Bu detaylar seo çalışmaları sırasında çok önemlidir.

Semantik olarak liste halinde kodlanması gereken elemanların, ekranda görsel tasarımdaki haliyle görünebilmeleri için bazı CSS tanımlarının uygulanması gerekebilir. Mesela bazı listelerin alt alta değil de yan yana dizilmeleri gerekebilir. Aynen biraz önce gördüğümüz anamenü başlıkları gibi. Bu durumda float özelliğinden faydalanmanız gerekecektir.

Listelerin önlerindeki işaretler ve liste içeriklerinin bu işaretlere olan uzaklıkları gibi tüm özellikler CSS ile kontrol edilebilir. CSS’ te tanımlı işaretlerin dışında farklı bir görsellikte işaretler kullanmak isterseniz bu durumda resim dosyalarından faydalanabilirsiniz. Örneğin Koza içerik sayfasının altındaki linkler listesinde kullanılan ok işareti ve anasayfanın altındaki blokta yer alan artı işareti gif uzatılı birer grafiktir.

Sosyal Medya Stratejisi

Bir sosyal medya stratejisi oluştururken, ilk yapmanız gereken avantajları ve muhtemel riskleri gözden geçirmektir. Şirketinizin satın alma işlemlerini yürütebileceğiniz somut bir strateji oluşturmaya çalışın. Daha sonra stratejinizi uygulamaya koyun. Amaçlarınızı karşılamıyorsa stratejinizi değiştirme yoluna gidin. Doğra adımlar atıp, gelir gider durumunun makul olmasına dikkat edin.

1.    Markalaşmaya adımınızı atın
2.    Zengin içerik yayınlayın
3.    Paylaşıp, yayınlayın
4.    İzleyip, dönüştürün

Facebook pazarlama sisteminin üç temel türü vardır. Bunlardan ilki ilişki kurduğunuz, bağlantıya geçtiğiniz ve ilişkileri geliştirdiğiniz topluluk tabanlı yaklaşımdır. İkincisi, Facebook uygulamaları yoluyla sağlanır. Facebook’taki sosyal uygulamalarınızı nasıl geliştirebileceğiniz görmek için https://developers.facebook.com/ ’u ziyaret ediniz. Üçüncü tür de Facebook Reklamlarının kullanıldığı yaklaşımdır. Facebook Reklamları sayesinde reklam kampanyalarınızı oluştururken özel demografikleri hedefleyebilirsiniz.

MySpace Herkez İhmal Ediyor Etmeyin..

myspace_logo2

MySpace, şu anda eski önemini yitirmiş durumda olsa da medya kuruluşları, müzik grupları ve benzerleri için hâlâ oldukça önemli. MySpace, sosyal ağ domainleri arasında gözde konumunu geri kazanmak için son iki yıl içerisinde çeşitli değişiklikler yaptı ancak şimdiye kadar bunun bir etkisini göremedi.

MySpace ilk olarak müzik toplulukları için oluşturulmuştu. Çok geniş bir genç dinleyici kitlesi sayesinde de büyük çıkış sağlamıştı. MySpace sayesinde müzisyenler MySpace Records etiketiyle satılan albümlerini siteye yükleyebiliyorlardı.

MySpace hesabınıza girdikten sonra profil bilgilerinizi tamamlamanız gerekiyor. Birkaç fotoğraf ve video da ekleyin. Çünkü çoğu insan profil sayfasında fotoğrafı olmayan kişilerin Arkadaşlık İsteğini kabul etmiyor. Arkadaşlarınızı bulup onlara
mz bu duyuruları görecektir. Ayrıca ilan panonuza video da ekleyebilirsiniz.

MySpace’de spamlerden uzak durun. Şirketinizin linklerini eklemek için gerçek profilinizi kullanın. Aynı zamanda durumunuzu da güncelleyebilirsiniz. Alanınıza uygun forumlara katılın. Kendi etkinliklerinizi ekleyin. Diğer etkinliklere katılın. Eski okul arkadaşlarınızı bulun ve neler yaptıklarını öğrenin.

MySpace.com’un arama işlevi hâlâ Google tarafından yürütülmekte. Pazarlamacılar MySpacee reklam vererek MySpace reklam programından istifade edebilirler. Geliştiriciler de merak uyandıran MySpace uygulamaları ve daha fazlasını yaratabilmek için https:// developer.myspace.com/community/’ da bulunan geliştirici araçlarını kullanabilirler.

StumbleUponun Alternatif Kullanılabilir

StumbleUpon-Logo Şu anda, StumbleUponun yedi milyon kullanıcısı var. StumbleUpona üye olduktan sonra, kullanıcılar ilgi alanlarını seçerler ve daha sonra buna uygun StumbleUpon araç çubuğunu yüklemeye yönlendirilirler. Hesabınızı oluştururken veya profil ayarlarınızı yaparken Hotmaildeki arkadaşlarınız veya diğer e-posta adreslerindeki bağlantılarınızı da dahil edebilirsiniz. StumbleUpon ile birlikte açılış sayfanız http:lluserid. stumbleupon.com haline gelecektir.

Araç çubuğunu yükledikten sonra, ilgi alanlarınızla ilgili sayfalar arasında gezinmek için Stumble butonuna basmanız yeterli. Gezdiğiniz sayfalardan beğendiklerinizi beğendim (thumbs-up) butonuna basarak beğenmediklerinizi ise beğenmedim (thumbs-down) butonuna basarak görüşünüzü bildirebilirsiniz. StumbleUpon tavsiye motoru aşağıdaki şekilde işler:

StumbleUpon, yeni bir içerik önerme sistemi oluşturmak için denk öğeler ve sosyal ağ ilkelerini tek işlemde blog yazma ile birleştirir. Patent başvurusunu yaptığımız Araç Çubuğu sistemimiz web içeriğini toplama, dağıtma ve inceleme özelliklerini sezgisel sosyal bir çerçevede kullanıcılara webde “sörf yapmaya” benzer bir tarayıcı deneyimi sunarak otomatik olarak yerine getirmektedir. Kullanıcı sayısı oldukça kolay bir şekilde milyonları aşmıştır.