SEO İçin HTML: Hangi Etiketler Gerçekten Önemli?

HTML, bir web sayfasının iskeletidir. Arama motoru sayfanızı ziyaret ettiğinde gördüğü şey tasarım değil, bu iskelettir: hangi metin başlık, hangisi paragraf, hangi görselin ne anlattığı, sayfanın hangi dilde olduğu. Bu yüzden SEO’nun önemli bir bölümü doğrudan HTML ile ilgilidir.

Bu yazıda SEO açısından gerçekten fark yaratan HTML etiketlerini, doğru kullanım biçimleriyle birlikte topladık. Kod bilmenize gerek yok; her başlıkta neyin neden önemli olduğunu anlatıyoruz.

Önce kısa bir hatırlatma: SEO nedir?

SEO (Search Engine Optimization), sitenizin arama sonuçlarında bulunabilir olması için yapılan çalışmaların bütünü. İçerik, teknik altyapı ve otorite olmak üzere üç ayağı var. HTML, bu ayaklardan teknik olanın temelini oluşturuyor. Konuya sıfırdan bakıyorsanız temel SEO rehberimiz iyi bir başlangıç olur.

HTML nedir, ne değildir?

HTML (HyperText Markup Language) bir programlama dili değil, bir işaretleme dilidir. Yani hesap yapmaz, koşul çalıştırmaz; içeriğin ne olduğunu tarayıcıya ve arama motoruna anlatır. "Bu bir başlıktır", "bu bir liste", "bu bir görsel" demenin yoludur.

HTML5 ile birlikte gelen anlamsal (semantic) etiketler bu anlatımı güçlendirdi. Eskiden her şey isimsiz kutulara yazılırken, bugün sayfanın hangi bölümünün ana içerik, hangisinin menü olduğunu doğrudan belirtebiliyoruz.

SEO açısından önemli HTML etiketleri

Sayfa dili ve karakter kodlaması

Sayfanın en üstünde yer alan iki küçük tanım, Türkçe içerikler için kritik:

<html lang="tr">
<meta charset="utf-8">

Dil tanımı eksikse arama motoru içeriğin hangi dilde olduğunu tahmin etmek zorunda kalır. Karakter kodlaması yanlışsa Türkçe harfler bozuk görünür ve bu doğrudan kullanıcı kaybına yol açar.

Başlık etiketi (title)

Arama sonucunda görünen mavi başlık budur ve tıklanma oranını en çok etkileyen tek unsurdur. Her sayfada farklı olmalı, sayfanın konusunu net anlatmalı ve gereksiz uzun olmamalı.

<title>SEO İçin HTML Nedir? | Clicks'us Insight</title>

Meta açıklama

Sıralamaya doğrudan etkisi yok ama arama sonucundaki açıklama metnini belirlediği için tıklanma oranını etkiliyor. Nasıl yazılacağını meta açıklama yazımızda örnekledik.

Meta robots

Bir sayfanın dizine eklenip eklenmeyeceğini bu etiket belirler. Yanlış kullanıldığında, tamamen sağlıklı bir sayfanın arama sonuçlarından kaybolmasına yol açabilir; bu yüzden şablon dosyalarında unutulmuş noindex değerleri en sinsi SEO hatalarından biridir. Tarama tarafındaki kuralları ise robots.txt rehberimizde anlattık.

Canonical etiketi

Aynı içeriğe birden fazla adresten ulaşılabiliyorsa (filtreli listeler, izleme parametreli bağlantılar, www’lu ve www’suz sürümler), hangisinin asıl adres olduğunu canonical etiketiyle söylersiniz. Ayrıntılar için canonical URL yazımıza bakabilirsiniz.

Başlık hiyerarşisi (h1-h6)

Başlıklar yazı tipini büyütmek için değil, içeriğin yapısını anlatmak için vardır. Üç kural yeterli: sayfada tek bir h1 olsun, sıralamayı atlamayın (h2’den sonra h4 değil h3 gelsin), başlıkları tasarım kaygısıyla değil anlam kaygısıyla seçin.

Görsel etiketi ve alternatif metin

Görseller arama motorları için görünmezdir; onları anlatan tek şey alternatif metindir. Alt metni görselin ne anlattığını söyleyecek şekilde yazın, anahtar kelime deposu gibi kullanmayın. Ayrıca genişlik ve yükseklik değerlerini belirtmek, sayfa yüklenirken içeriğin zıplamasını (CLS) önler.

<img src="/gorsel/ornek.webp" alt="Search Console performans raporu ekranı" width="1200" height="800" loading="lazy">

Bağlantılar

Bağlantı metni (anchor text), bağlantının nereye gittiğini anlatmalı. "Tıklayınız" yazan bir bağlantı, arama motoruna hiçbir şey söylemez. Reklam ya da sponsorlu bağlantılarda rel="sponsored", kullanıcı tarafından eklenen bağlantılarda rel="ugc" kullanmak doğru yaklaşımdır.

Anlamsal bölüm etiketleri

HTML5’in header, nav, main, article, section ve footer etiketleri sayfanın hangi bölümünün ne işe yaradığını anlatır. Her şeyi isimsiz kutulara koymak yerine bu etiketleri kullanmak, hem erişilebilirliği hem de içeriğin doğru yorumlanmasını iyileştirir.

Liste ve tablo etiketleri

Adım adım anlatımlarda numaralı liste, seçenek sıralarken madde işaretli liste, karşılaştırma yaparken tablo kullanın. Bunlar yalnızca görsel tercih değil: yapılandırılmış içerik hem okunmayı kolaylaştırıyor hem de arama motorlarının bilgiyi ayıklamasını basitleştiriyor. Öne çıkan snippet’lerde en sık görülen biçimler tam olarak bunlar.

Tabloları tasarım amacıyla, yani sayfa yerleşimi kurmak için kullanmayın; bu yöntem yıllar önce terk edildi ve mobil uyumluluğu doğrudan bozuyor.

Yapısal veri (JSON-LD)

Bugün HTML tarafında en çok fark yaratan başlık bu. Yapısal veri, sayfadaki bilgilerin ne anlama geldiğini makinelere açıkça söyler: bu bir makale, şu bir yazar, bu bir soru-cevap bölümü. Google zengin sonuçlarda kullanır, yapay zekâ sistemleri ise içeriği doğru yorumlamak için. Konunun yapay zekâ tarafını GEO yazımızda ele aldık.

Sık yapılan HTML hataları

• Her sayfada aynı title. Şablondan gelen tek başlık, sayfaların birbirinden ayırt edilmesini engeller.
• Birden fazla h1. Tasarım gereği büyük görünsün diye h1 kullanmak yapıyı bozar.
• Boş ya da anlamsız alt metinleri. Dosya adının olduğu gibi bırakılması en yaygın örnektir.
• Unutulmuş noindex. Test ortamından canlıya taşınan şablonlarda sık görülür ve sayfaların kaybolmasına yol açar.
• Yanlış canonical. Tüm sayfaların ana sayfayı işaret etmesi, sitenin tamamının dizinden düşmesine neden olabilir.
• Ölçüsüz görseller. Genişlik ve yükseklik verilmediğinde sayfa yüklenirken içerik kayar; bu da Core Web Vitals puanını düşürür.

Bir de erişilebilirlik tarafı var: doğru etiketlenmiş bir sayfa, ekran okuyucu kullanan ziyaretçiler için de kullanılabilir hâle gelir. Başlık hiyerarşisi, alternatif metinler ve anlamlı bağlantı metinleri hem erişilebilirliği hem arama motoru anlayışını aynı anda iyileştirir; ikisi için ayrı iş yapmanız gerekmez.

HTML ile site hızı ilişkisi

Temiz HTML sadece anlam için değil, hız için de önemli. Gereksiz iç içe kutular, satır içi yazılmış devasa stil tanımları ve sayfanın üstünde bekleyen script dosyaları açılış süresini uzatır. Bu da doğrudan Core Web Vitals ölçümlerine yansır.

Bir de şu var: sayfanın kaynak kodunda içeriğin gerçekten bulunması gerekiyor. Tamamen JavaScript ile sonradan yüklenen metinler, arama motorları tarafından geç işlenir ya da bazı durumlarda hiç görülmez. İçeriğinizin sunucudan gelen HTML içinde yer alması, bugün hâlâ en güvenli yaklaşım. Bunu kontrol etmek için tarayıcıda JavaScript’i kapatıp sayfayı yenilemeniz yeterli: yazınız hâlâ duruyorsa sorun yok.

Sayfanızda hızlı bir HTML kontrolü

Teknik bilgi gerektirmeyen, beş dakikalık bir kontrol yapabilirsiniz. Herhangi bir sayfanızda sağ tıklayıp "Sayfa kaynağını görüntüle" deyin ve şunlara bakın:

1. lang değeri "tr" mi?
2. title bu sayfaya özel mi, yoksa tüm sitede aynı mı?
3. Meta açıklama var mı ve sayfanın içeriğini anlatıyor mu?
4. Canonical adresi bu sayfanın kendi adresi mi?
5. Kaynakta noindex geçiyor mu? Geçiyorsa neden?
6. Sayfada kaç tane h1 var?
7. Görsellerde alt metni dolu mu?

Bu yedi maddede çıkan sorunlar, çoğu sitede en hızlı düzeltilen ve en hızlı geri dönüş veren hatalardır. Aynı kontrolü tüm siteye yaymak isterseniz Screaming Frog gibi bir tarama aracı bu alanları toplu olarak listeler.

Özetle

HTML, arama motoruyla konuştuğunuz dildir. Doğru etiketle yazılmış bir sayfa, arama motoruna içeriğinin ne olduğunu tahmin ettirmez; doğrudan söyler. Yukarıdaki kontrolleri kendi sitenizde tek tek geçmek, çoğu sitede birkaç saatlik iş ve karşılığı hızlı alınıyor.

Teknik tarafı kendi ekibinizle yürütmek yerine dışarıdan destek almak isterseniz, SEO hizmetlerimiz kapsamında yaptığımız teknik denetimle sitenizdeki bu hataları çıkarıp öncelik sırasına koyuyoruz. Daha geniş bir bakış için 10 kritik SEO faktörü yazımıza da göz atabilirsiniz.