Seo

Başlık etiketlerinin seo açısından önemi ve kullanımı

başlık etiketleri

Hepimiz biliyoruz ki başlık etiketleri bir web sayfasının içerik yapısını oluşturan elementlerdir. Başlık etiketleri sayesinde içeriğimizi aslında filtrelemiş gibi oluyoruz. Çünkü önemli başlıklar farklı etiketlerle belirtilerek, arama motorlarına içeriğin önem sıralamasını belirtmiş oluyoruz. Yazıyı kalın yada italik yapmak bu konuda tek başına yeterli değildir.

Not: Makalemin sonunda başlık etiketi kullanımında yapılan en büyük yanlış kullanımı açıkladım. Mutlaka göz atın.

Başlık Etiketleri Nelerdir?

<h1> ve <h6> arasındaki tüm başlık etiketleri içerikteki başlıkların önem derecesini belirtmektedir.

<h1> Etiketi bir sayfadaki en önemli başlığı belirtmek için kullanılan kritik bir başlık etiketidir.

<h6> Etiketi ise bir sayfadaki en az öneme sahip başlıklar için kullanılır.

Başlık Etiketleri Nasıl Kullanılır?

Sayfanıza ekleyeceğiniz başlık etiketlerini aşağıdaki şekilde kullanabilirsiniz.

  • <h1> En önemli başlık<h1>
  • <h2> Başlık <h2>
  • <h3> Başlık <h3>
  • <h4> Başlık <h4>
  • <h5> Başlık <h5>
  • <h6> En az öneme sahip başlık <h6>

H1 başlık etiketi sayfanızın ana başlığı gibi düşünebilirsiniz. Bu başlık etiketi genelde en büyük puntolara sahip ve kalın bir yazı biçiminden oluşur ki önem derecesi belli olsun.

H2 ve H3 başlık etiketlerinin puntoları biraz daha küçük olmakla birlikte isteğe bağlı kalın yazı tipinden oluşabilir.

Başlık etiketleri arama motorlarına sayfanızın önem derecesine göre kategorilendirilmiş olduğunu belirterek, en önemli ve daha az öneme sahip kısımları belirtir.

Başlık etiketlerinin kullanım amacı

Başlık etiketlerinin kullanımının en büyük sebebi, kullanıcıların içeriğinizdeki hiyerarşiyi görerek önemli ve az önemli kısımlara daha rahat odaklanarak, okumalarını kolaylaştırmaktır. Aynı zaman arama motorları için de oldukça önemlidir.

H1 etiketinin en önemli başlıkları belirtmek için kullanıldığını söylemiştim. H1 etiketinde kullanacağınız başlık yazınızın özeti niteliğinde, yazınızla ilgili net bir fikir veren başlık olmalı.

Hiyerarşi

başlık etiketleri

Başlık etiketleri içerisindeki hiyerarşi için kullanım örneğini üst kısımda belirtmiştim. Özetlemek gerekirse, H1 etiketi ile başlayıp önem derecesine göre H6 etiketine kadar devam eden başlıklardır.

Anahtar kelimelerin başlık etiketlerinde kullanımı

Anahtar kelimelerin seo açısından ne derece önemli olduğunu Yeni başlayanlar için anahtar kelime seçimi ve kullanımı makalemde belirtmiştim. Anahtar kelime seçimlerinin olduğu kadar anahtar kelimelerin başlık etiketleri içerisinde kullanımları da çok önemlidir. Onpage seo nedir onpage seo teknikleri nelerdir? makalesinde bu konuya değinmiştim.

H1 başlık etiketinin kullanım sıklığı ne kadar olmalı?

H1 başlık etiketi en önemli başlık etiketi olduğu için içeriğinizde sadece 1 kez kullanılmalıdır. Çünkü hatırlarsanız demiştik ki H1 etiketi sayfanızın özeti niteliğinde olan açıklayıcı bir başlıktır, ve bir yazıda bir adet ana başlık olur.

Html5 platformunda H1 etiketi kullanımı

Html’in önceki sürümlerinde sadece 1 adet H1 etiketi kullanımına izin veriliyordu. Fakat yeni sürüm olan Html5 içerisinde kullanıcılar sayfa tasarımının ihtiyaçları doğrultusunda birden fazla H1 etiketi kullanabilmektedirler.

Başlık etiketlerinin kullanımında yapılan en büyük hata

Makalemin başında da belirttiğim gibi, başlık etiketlerinin kullanımında bazen büyük hatalar yapılmaktadır. Bunlardan en belirgin olanı ise hiyerarşiyi takip etmemektedir.

Örneğin : Yazınızın içeriğinde h1 etiketini kullandınız bir alt başlık oluşturdunuz ve bunu da h3 yada h4 etiketi içerisine aldınız. Burada H2 etiketini atlamış  oldunuz. Başlık etiketlerini açıklarken ne demiştik, hepsi birer hiyerarşi içerisinde olmalıdır. Dolayısıyla h1 den sonra h2,h3,h4 şeklinde devam etmelisiniz.

Yazar Hakkında

Sadri Ercan

Wordpress,Seo,Blogging,Blogger ve Sosyal Medya konularında makaleler yazmakta ve Seo Danışmanlığı yapmaktayım.

17 Yorum

  • Merhaba Sadri bey, sitemdeki temam üzerinde bu hiyerarşiyi uygulamaya çalıştığımda arada dengesiz boşluklar oluşuyor. Ekseriyetle şu şekilde yapıyorum;

    h2
    h3
    h4

    Ancak son yazılarımda sırf görüntüyü bozduğu için kullanmadım. Örnek olarak göstermem gerekirse bu sayfada ikinci başlık h2 dir. Bu başlığın üst kısmında h2 yapınca, iki satır boşluk varmış gibi duruyor. Kaldırınca düzeliyor. Ne yapmam gerekir?

  • Bahsettiğiniz durumun sebebi kullandığınız temadaki başlık etiketlerinin css kodlamasıyla ilgilidir. h2 etiketinde line-height gibi bir parametre varsa bunun değerini düşürdüğünüzde satır boşluğunu da düşürecektir. Ya da ilgili başlık etiketinin css kodlarına line-height:20px !important; gibi bir parametre ekleyerek verdiğiniz değerin geçerli olmasını sağlayabilirsiniz.

  • Bu kodları Chrome üzerinde incele diyerek bulup düzeltiğimde oluyor. Ancak aynı kodları temanın düzenleyici kısmındaki style.css dosyasında bulup uyguladığımda herhengi bir değişme olmuyor.

  • Yaptığınız değişikliğin var olan ayar üzerine yazılması için !important; kodunu kullanabilirsiniz.

    örneğin : line-height: 20px !important;

    şeklinde.

  • /* Post Elements */
    .entry {line-height:20px !important;}
    .content .entry iframe { max-width: 100%; }
    .entry p {padding-top: 0; padding-bottom: 1em;}
    .entry img { max-width:100%; height:auto;}
    .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 {
    margin-top: 5px;
    margin-bottom: 20px;
    line-height: 1em;
    font-family: Helvetica;
    font-weight: normal;

    Bu şekilde yaptım. “margin-top: 5px; margin-bottom: 20px” yaptım.

  • Dediğiniz şekilde de yapabilirsiniz ya da sadece hangi başlık etiketinde değişiklik isterseniz o etiket içinde yapabilirsiniz.

    Örneğin: .entry h1 {line-height:20px !important;} gibi.

  • /* Post Elements */
    .entry {line-height:1.5;}
    .content .entry iframe { max-width: 100%; }
    .entry p {padding-top: 0; padding-bottom: 1em;}
    .entry img { max-width:100%; height:auto;}
    .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 {
    margin-top: 25px;
    margin-bottom: 10px;
    line-height: 1em;
    font-family: Helvetica;
    font-weight: normal;
    }
    .entry h1 {line-height:20px !important;}
    .entry h2 {line-height:20px !important;}
    .entry h3 {line-height:20px !important;}
    .entry h4 {line-height:20px !important;}
    .entry h5 {line-height:20px !important;}
    .entry h6 {line-height:20px !important;}

    Bu şekilde değiştirdim yine düzelmedi. Yada ben yapamıyorum. Siz bu kodu düzenleyebilirmisiniz.

  • şu şekilde kullanabilirsin;

    .entry {line-height:1.5;}
    .content .entry iframe { max-width: 100%; }
    .entry p {padding-top: 0; padding-bottom:0;}
    .entry img { max-width:100%; height:auto;}
    .entry h1, .entry h2, .entry h3, .entry h4, .entry h5, .entry h6 {
    line-height:20px !important;
    margin:0px;
    padding:0px;
    font-family: Helvetica;
    font-weight: normal;
    }

    line-height kısmındaki değer ile başlık etiketlerinin satır yüksekliğini ayarlayabilirsin.

  • Çok teşekkür ediyorum H2 başlıklarının hepsi düzeldi. Ancak bu sefede “H” etiketi olmayan başlıklar yazılara dahada bitişti. Örnek;

    yorsunuz.
    “Göze Çarpan Özellikleri:” Ortadaki etiketsiz başlık
    Güvenli Tara

  • O başlıklar için de yine line-height kullanabilirsin. kodlar içerisinde yer alan .entry {line-height:1.5;} kısmı standart yazının satır yüksekliğini belirtir. Bu kısımdaki artışta yine satır arası yüksekliği arttırır.

  • Sadri bey, editör yeni yazı sayfasında hazırladığım yazıların paylaşıldığında otomatik olarak “12pt” gibi bir boyutta çıkmasını nasıl sağlıyabilirim? Bunun için daha uygun bir konu varsa orada da yazabilirim. Yani istiyorum ki; gerek editör yazı sayfamda gerekse tüm sitemdeki paylaştığım yazıların boyutu istediğim boyutta ve yazı fontunda “yazı tipinde” olsun. Ama bunu her yazı paylaşırken editör kısmından yapmıyayım. Şimdiden teşekkür ettim.

  • aşağıdaki dosyayı açın ve alt kısımda verdiğim kodlar içerisinde dilediğiniz değişikliği yapıp kaydedin ve geri yükleyin.

    wp-includes/js/tinymce/skins/wordpress/wp-content.css

    body {
    font-family: Georgia, “Times New Roman”, “Bitstream Charter”, Times, serif;
    font-size: 16px;
    line-height: 1.5;
    color: #333;
    margin: 9px 10px;
    max-width: 100%;
    -webkit-font-smoothing: antialiased !important;
    overflow-wrap: break-word;
    word-wrap: break-word; /* Old syntax */
    }

    Eğer eklenti ile yapmak isterseniz https://wordpress.org/plugins/easy-google-fonts/ eklentisini kullanabilirsiniz. Fakat font olayı temanız ile de ilgilidir.

  • Merhaba sari bey; sayfa içinde h1 h2 h3 h4 h5 h6 şeklinde etiket kullanımını yazıyorsunuz. peki şunun gibi seçenekler uygun olur mu:
    H1
    H2
    H2
    H2
    H3
    H3
    H4
    H5

Yorum yapmak ister misin?

Pin It on Pinterest