Sosyal Medya Uzmanı | Takiple Kazan

Seo Nedir?

Seo Nedir?

SEO Nedir?

Öncellikle herkesin anlaması gereken konu, SEO arama motorlarını kandırmak değildir. SEO, arama motorlarının websitemizi daha iyi tarayıp indeksleyebilmeleri için onlara yardımcı olabilmektir. Yani şöyle düşünebilirsiniz, eğer iyi ve başarılı bir websiteniz varsa Google’ı ne kadar çok websitenize çekebilirseniz, arama sonuçlarında o derece yukarılara çıkabilecek ve organik trafiğiniz artacaktır.
Doğru bir SEO çalışması aşağıdaki gibi olmalıdır.
  • 1. Teknik SEO Çalışması:
Bu çalışma ile websitemizin hatalarını giderebilmemiz gerekir. Bu çalışmalar arasında; kod hatalarının giderilmesi, sayfa açılış hızı optimizasyonu, meta/title oluşturulması, doğru URL yapılarının oluşturulması, Inline CSS ve Javascript hatalarının düzeltilmesi, robots.txt dosyasının oluşturulması, site haritasının oluşturulması gibi birçok çalışma sıralanabilir.
  • 2. Site İçi Optimizasyon:
Site içi optimizasyon ile tüm sayfalarımızın taranma ve indekslenme oranlarının arttırılması hedeflenmektedir. Bu çalışmalar arasında; website kod/içerik oranının azaltılması, anahtar kelime çalışmaları, H1 etiketlerinin belirlenmesi ve iç linkleme çalışmaları gelmektedir.
  • 3. Site Dışı Optimizasyon:
Site dışı optimizasyon, websitemize dışarından gelen linkler ile ilgili bir çalışmadır. Backlink olarak sıkça duyduğumuz, site dışı optimizasyon çalışmaları arasında, websitemize gelen spam trafiğin engellenmesi ve doğru kanallardan backlink edinme çalışmaları gelmektedir.
  • 4. Raporlama:
Yaptığımız tüm bu çalışmaları mutlaka kontrol ve takip etmeli hatta düzenli formatlarda raporlara yerleştirmeliyiz. Böylelikle nelerin iyi, nelerin kötü gittiğini anlayabilmemiz mümkün olabilecektir.

Website Şablonu

Website Şablonu


Bildiğimiz gibi bir web sitesi yapmaya kalkıştığınızda ilk önce websitesine ait şablonun oluşturulaması ve buna uygun olarak web programcının kodlamayı gerçekleştirmesi gerekir. Şablon oluştururken en kolay ve bir çok kişinin kullanıdığı yöntem tablolardır.Tablolarla şablon oluştururken sürükle bırak yöntemiyle yaklaşık 5 dakikada bir sitenin tasarımını oluşturabiliriz. Fakat bu yöntemle hazırlanan tasarımların düzgün olabilmesi için iç-içe tablolar eklenmesi gerekir. Bu da daha sonraki zamanlarda problemlere sebep olur. 

Kullandığımız IDE yardımıyla da tabloların arkaplanları (background) değiştirilerek hoş görünmesi sağlanır. Bu yöntem, tamamıyla sayfanın html kısmını şişirir. Bu yöntemle hazırladığımız web sitelerinin dinamik (kolay değişebilen) bir yapıya sahip değildir. Örneğin sayfanızı yada sayfaya ait belirli bir kısmın arkaplan renginin değiştirmek istediğimizde sayfanın html kodlarını açıp oradan bulmamız gerekir. Bu da zahmetli bir iştir. Üstelik birden daha fazla sayfa için bunu yapmamız gerekirse. 

Farklı bir örnek verecek olursak; sayfamızın bir kısmının genişliğini değiştirmek istediğimizde bir tablonun genişliğiyle oynarken diğer tablonun düzeni bozulur. Bir de 40 sayfamız olduğunu düşünürsek bu daha zordur. Sonuç olarak tablosuz tasarım yaptığımızda şablonumuz; kullanılabilirlik, yönetilebilirlik açısından pek iyi bir durum da olmaz.

Tablosuz, diğer bir ifadeyle div-CSS yardımıyla yaptığımız tasarımlar daha kullanılabilir, daha yönetilebilir ve daha dinamik oluyorlar. İlk olarak web şablonumuzda neyin nerde olacağını kağıt üzerine belirledikten sonra her birer bölüm için bir div oluşturulur ve bu div'lere ait kimlikler id (identity) verilir. Eğer karmaşık ve daha gelişmiş bir uygulama yapıyorsak div haritası çıkarılır ve daha sonra gelecek arkadaşların sistemi daha kolay anlaması için proje dosyasına döküman olarak ekleyebiliriz. Div'lerimizi Html sayfamıza doğrudan yazıyoruz.


Örnek:




Bootstrap Kodları

Bootstrap Kodları

Bootstrap Grid System

<div class="row">
<div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> <div class="col-md-1">.col-md-1</div> </div> <div class="row"> <div class="col-md-8">.col-md-8</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> <div class="col-md-4">.col-md-4</div> </div> <div class="row"> <div class="col-md-6">.col-md-6</div> <div class="col-md-6">.col-md-6</div>
</div>