SEO Rehberi Adım 9: Kılavuzlama Optimizasyonu

Bu, 13 Adımlı SEO Rehberinin 9. adımıdır. Kılavuzlama optimizasyonu, SEO ile dönüşümün kesişim noktasıdır — çünkü ziyaretçiler harekete geçmediği sürece sıralama değersizdir.

Sıfırdan birinci, mükemmel meta etiketlerine, hızlı yükleme sürelerine ve otoriter geri bağlantılara sahip olabilirsiniz — yine de başarısız olabilirsiniz. Neden? Çünkü yerleşiminiz ziyaretçileri almak istediğiniz eyleme yönlendirmiyor.

Kılavuzlama optimizasyonu, SEO ve CRO (Dönüşüm Oranı Optimizasyonu) kesişiminde yer alır. Google, kullanıcı etkileşim sinyallerini ölçer — hemen çıkma oranı, kalma süresi, geri dönüş. Karmaşık bir düzen tüm bu üç duruma neden olur. Açık ve stratejik bir düzen ise hepsini iyileştirir.

Veriler açık: Optimize edilmiş düzenlere sahip sayfalar, ilave trafik olmadan %30-80 daha yüksek dönüşüm oranları görmektedir. Bu, zaten mevcut ziyaretçilerden gelen ücretsiz gelirdir.

Kılavuzlama Optimizasyonu Neleri Kapsar

Kılavuzlama optimizasyonu 8 alanı kapsar:

Yukarıda Katlama İçeriği — Kullanıcıların kaydırmadan gördükleri
Görsel Hiyerarşi — Gözleri önemli olan yere yönlendirme
F Deseni ve Z Deseni — Kullanıcıların sayfaları nasıl taradığı
CTA Yerleşimi — Butonların ve bağlantıların en iyi dönüşüm sağladığı yer
Boş Alan ve Okunabilirlik — Anlayış için iyileştiren nefes alma alanı
Mobil Yerleşim Desenleri — Parmak bölgeleri ve dikey akış
Isı Haritası Analizi — Veri odaklı yerleşim kararları
Dönüşüm Odağına Yönelik Tasarım — İş sonuçlarını yönlendiren düzen

1. Yukarıda Katlama İçeriği

"Yukarıda katlama" kullanıcıların kaydırmadan önce gördükleridir. Masaüstünde bu, yaklaşık olarak üst 600-800px’dir. Mobilde ise 500-700px’dir. Bu, en değerli mülkünüzdür.

Yukarıda katlamada görünmesi gerekenler:

"Bu sayfa neyle ilgili?" sorusunu cevaplayan net bir başlık
Ana değer öneriniz veya kilit mesajınız
En az bir CTA veya net bir sonraki eylem
Güvenilirliği doğrulayan görsel kanıt (logolar, puanlar, güven işaretleri)

Yukarıda katlamada kaçınılması gerekenler:

Metin katmanı olmayan dev hero resimleri (alan israfı)
İçeriği aşağı iten navigasyon menüleri
Tüm görünümü engelleyen çerez bannerları
İçerik renderını geciktiren otomatik oynayan videolar

5 saniye testi: Sayfanızı birine 5 saniye gösterin. Sayfanın neyle ilgili olduğunu ve ne yapmaları gerektiğini söyleyebilirler mi? Söyleyemezlerse, yukarıda katlama içeriğiniz başarısız demektir.

Hızlı kazanım: Mobilde en iyi 5 iniş sayfanızı kontrol edin. Eğer ilk CTA kaydırma gerektiriyorsa, yukarı alın. Yukarıda katlamada görünür olan CTA’lara sahip sayfalar ortalama %17 daha iyi dönüşüm sağlar.

2. Görsel Hiyerarşi

Görsel hiyerarşi, kullanıcıların sayfanızdaki bilgileri işlemekteki sırasını belirler. Boyut, renk, kontrast, aralık ve konumlandırma ile kontrol edilir.

Hiyerarşi piramidi (üst = en fazla dikkat çeken):

| Seviye | Amacı | Örnekler | |--------|-------|----------| | Birincil | Kullanıcıların yapmasını istediğiniz tek şey | Ana CTA butonu, hero başlığı | | İkincil | Güveni artıran destekleyici bilgiler | Alt başlıklar, kilit faydalar, sosyal kanıt | | Üçüncül | İlgili kullanıcılar için bağlam ve ayrıntı | Metin, özellik listeleri, spesifikasyonlar | | Dördüncül | Navigasyon ve faydalar | Alt bilgi bağlantıları, ekmek kırıntıları, meta bilgiler |

Etkili hiyerarşi için kurallar:

Her görünüm alanında yalnızca BİR birincil odak noktası olmalıdır
Birincil elemanlar ikincil olanlardan 2-3 kat daha büyük olmalıdır
Açık seviyeler oluşturmak için kontrast (renk, ağırlık, boyut) kullanın
Bir elemanın etrafındaki boşluk, algılanan önemini artırır
Görsel bir deseni kırmak anında dikkat çeker

SEO etkisi: Güçlü görsel hiyerarşi kalma süresini artırır (kullanıcılar ihtiyaç duyduklarını daha hızlı bulur) ve geri dönüşleri azaltır (kullanıcılar arama sonuçlarına geri dönmez).

Hızlı kazanım: Sayfanıza gözlerinizi kısarak bakın. Hala 3 farklı önem seviyesini görebiliyor musunuz? Her şey aynı görünüyorsa, hiyerarşiniz düz ve kullanıcılar kaybolmuş hissediyor.

3. F Deseni ve Z Deseni Düzenleri

Göz izleme araştırmaları (Nielsen Norman Group, Hotjar) kullanıcıların sayfaları öngörülebilir desenlerde taradığını sürekli olarak göstermektedir. Düzeninizi bu desenlerle uyumlu hale getirmek kritik içeriğin görünmesini sağlar.

F Deseni (İçerik Ağırlıklı Sayfalar)

Kullanıcılar, metin ağırlıklı sayfalarda (blog gönderileri, makaleler, ürün listeleri) F şeklinde tararlar:

Üst kısımda yatay tarama (başlık alanı)
Aşağıya geçip, başka bir yatay çizgiyi tarama (alt başlık)
Sol tarafta dikey tarama (anahtar kelimeleri arama)

Sonuçları:

En önemli anahtar kelimelerinizi ve mesajlarınızı ilk 2-3 satıra yerleştirin
Paragraflara ana bilgiyi baştan vererek başlayın (ön yükleme)
Her 2-3 paragrafta bir "tarayıcı sabitleri" olarak alt başlıklar kullanın
Önemli içeriği sola hizalayın (gövde metnini merkezde tutmayın)
Tarayıcı desenleri için madde işaretleri ve kalın yazı kullanın

Z Deseni (Az Metinli Sayfalar)

Kullanıcılar, daha az metin içeren sayfalarda (iniş sayfaları, ana sayfalar) Z şeklinde tararlar:

Sol üstten sağ üst köşeye (logo → navigasyon/CTA)
Aşağı sola diyagonal tarama (gövdeyi tarama)
Sol alttan sağ alta (bir CTA ile sona erme)

Sonuçları:

Logonuzu ve navigasyonu sol üst ve sağ üst köşeye yerleştirin
Ana mesajınızı ortaya koyun
Ana CTA’nızı desenin sağ alt köşesine yerleştirin
İçerik bloklarını diyagonal boyunca yapılandırın

Hızlı kazanım: Mevcut sayfa düzeninizi ya F ya da Z deseni ile eşleştirin. Ana CTA’nız gözlerin doğal olarak taramanın sonunda ulaşacağı yerde mi konumlandırılmış?

4. CTA Yerleşimi

CTA (Harekete Geçirici Mesaj) yerleşimi dönüşüm oranlarını doğrudan etkiler. ContentVerve, Unbounce ve kendi denetlenen sayfalarımızdaki veriler, net desenler göstermektedir.

Yüksek dönüşümlü CTA pozisyonları:

| Pozisyon | En İyi için | Neden İşliyor | |----------|-------------|---------------| | Başlığın altında | Kısa iniş sayfaları | Kullanıcılar hemen hazır olur | | İlk fayda bloğundan sonra | Özellik sayfaları | Talep öncesi inanç oluşur | | Sosyal kanıttan sonra | Hizmet sayfaları | Güven sürtünmeyi azaltır | | İçeriğin altında | Blog gönderileri, rehberler | İlgili okuyucular sona ulaşır | | Yüzen/yapışkan (mobil) | Tüm mobil sayfalar | Her zaman ulaşılabilir |

CTA kuralları:

Eylem fiilleri kullanın: "Ücretsiz denetim başlat" yerine "Gönder"
CTA’nın sayfadaki en yüksek kontrast öğe olmasını sağlayın
Her görünüm alanında bir ana CTA (birden fazla CTA = karar felci)
Mikro-taahhüt metni ekleyin: "Kredi kartı gerekmez" veya "30 saniye alır"
CTA butonu mobil üzerinde minimum 44x44px olmalı (Apple HIG standardı)

Yanlış alt problem: Sayfanız CTA öncesinde bittiği gibi görünüyorsa, kullanıcılar kaydırmayı durdurur. Daha fazla içeriğin geleceğini belirtmek için görsel ipuçları (kısmen görünür içerik, kaydırma göstergeleri, içerik teaserları) kullanın.

Hızlı kazanım: En iyi performans gösteren sayfalarınızın altına ikinci bir CTA ekleyin. Aşağıya kaydıran kullanıcılar yüksek düzeyde angajman gösterir — onlara yukarı kaydırmadan dönüşüm sağlama fırsatı verin.

5. Boş Alan ve Okunabilirlik

Boş alan (negatif alan) boş bir alan değil — bir tasarım aracıdır. Daha fazla boş alana sahip sayfalar, hemen hemen her ölçülebilir şekilde daha iyi performans gösterir.

Araştırmalar neyi gösteriyor:

Metin etrafındaki boş alan anlayışı %20 artırır (Wichita Eyalet Üniversitesi)
Artan satır aralığı okuma hızını iyileştirir
CTA'ların etrafındaki kenar boşlukları tıklama oranlarını artırır
Yoğun düzenler daha yüksek hemen çıkma oranları ile ilişkilidir

SEO için okunabilirlik kuralları:

Satır uzunluğu: Satır başına 50-75 karakter (göz yorgunluğunu önler)
Satır yüksekliği: Gövde metni için 1.5-1.8 (satırları sıkıştırmayın)
Paragraf uzunluğu: En fazla 2-4 cümle (metin duvarlarını kırın)
Bölüm aralığı: Bölümler arasında 2-3 kat satır yüksekliği
CTA nefes alma alanı: Tıklanabilir öğeler etrafında minimum 24px padding

Web için yazı tip boyutları:

Gövde: Minimum 16-18px (mobil: 16px temel)
Başlıklar: Modüler bir ölçek kullanın (1.25x veya 1.333x oran)
Sayfa başına 3'ten fazla yazı tipi boyutu kullanmayın
Minimum kontrast oranı: 4.5:1 (WCAG AA)

Hızlı kazanım: Ana CTA’nızın etrafındaki padding’i %50 artırın. Birçok site, en önemli öğelerini diğer içeriklerle sıkarak, görünürlüğünü zorlaştırır ve mobilde tıklamayı güçleştirir.

6. Mobil Yerleşim Desenleri

Mobil, web trafiğinin %60+'ını oluşturur. Mobil düzen temelde masaüstünden farklıdır — sadece daha küçük değil, farklı yapılandırmalara sahiptir.

Parmak bölgesi: Mobil kullanıcılar telefonlarını bir el ile tutar. Doğal parmak ulaşımı üç bölge oluşturur:

Kolay bölge (alt merkez): Ana CTA'ların buraya yerleştirilmesi
İyi bölge (merkez): İkincil eylemler ve ana içerik
Zor bölge (üst köşeler): Navigasyon, ayarlar, daha az kullanılan elemanlar

Mobil özel desenler:

[Hamburger Menü]                [Eylem]
┌────────────────────────────────────────┐
│  H1: Net başlık                      │
│  Alt metin: Bir satırlık açıklama    │
│                                      │
│  ┌────────────────────────────────┐    │
│  │     ANA CTA (tam genişlikte)  │    │
│  └────────────────────────────────┘    │
│                                      │
│  İçerik bloğu 1                     │
│  ────────────────────────────────      │
│  İçerik bloğu 2                     │
│  ────────────────────────────────      │
│  İçerik bloğu 3                     │
│                                      │
│  ┌────────────────────────────────┐    │
│  │    İKİNCİ CTA (tam genişlikte) │    │
│  └────────────────────────────────┘    │
│                                      │
│  [─────── ALT NAV ───────]          │
└────────────────────────────────────────┘

Mobil yerleşim kuralları:

Her şeyi dikey olarak sıralayın (360px’den daha küçük durumda yan yana elemanlar yok)
CTA’lar tam genişlikte butonlar olmalıdır (44px+ yükseklik)
Yapışkan başlıkları az kullanın (görünüm alanı kaplar)
Uygulama benzeri deneyimler için alt navigasyonu düşünün
16px boşluklu kartlar ve aralarında 12px boşluk
Hover efektlerini devre dışı bırakın (dokunmada yoktur)

Hızlı kazanım: Telefonunuzu bir elinizle doğal olarak tutarak mobil sayfalarınızı test edin. Parmak ucu ile ana CTA’ya uzanabiliyor musunuz? Ulaşamıyorsanız, daha aşağıya taşıyın.

7. Isı Haritası Analizi

Isı haritaları, kullanıcıların sayfalarınızda gerçekten neye baktığını, neyi tıkladığını ve ne kadar kaydırdığını göstermektedir. Yerleşim kararlarını tahminden veri odaklı optimizasyona dönüştürür.

Isı haritası türleri:

| Tür | Ne Gösterir | Neye Dikkat Edilmeli | |-----|-------------|---------------------| | Tıklama ısı haritası | Kullanıcıların nerelere tıkladığı | Ölü tıklamalar, göz ardı edilen CTAlar, beklenmedik tıklama hedefleri | | Kaydırma ısı haritası | Kullanıcıların ne kadar kaydırdığı | Ayrılma noktaları, "katlama çizgisi", %50 altındaki içerik | | Hareket ısı haritası | Fare hareketi (masaüstü) | Dikkat desenleri, okuma akışı, tereddüt alanları | | Dikkat ısı haritası | Görünüm süreleri | Yüksek değerli alanlar, göz ardı edilen içerik |

Isı haritası verisini nasıl kullanmalısınız:

2-4 hafta boyunca ısı haritası izleme çalıştırın (1000+ oturuma ihtiyaç var)
Hiç tıklanmayan "ölü bölgeleri" bulup o içeriği kaldırın veya yeniden konumlandırın
"Öfke tıklanması" (tıklanamaz elemanlar üzerinde hızlı tıklama) bulun — o elemanları işlevsel hale getirin veya kaldırın
Kaydırma derinliğini kontrol edin: Eğer kullanıcıların %70’i CTA’nıza ulaşmıyorsa, yukarı taşıyın
Mobil ile masaüstü desenlerini karşılaştırın — genellikle dramatik şekilde farklıdır

Isı haritası analizi için araçlar:

Microsoft Clarity (ücretsiz, sınırsız trafik, oturum kayıtları)
Hotjar (ücretsiz katman: günde 35 oturum)
FullStory (kurumsal, tam oturum yeniden oynatma)

SEO bağlantısı: LANGR'nın düzen tarama modülü, CTA yerleşimini, yukarıda katlama içerik yoğunluğunu ve mobil dokunma hedef boyutlamasını analiz eder. Düşük etkileşim sinyalleriyle ilişkilendirilen düzen sorunlarını tanımlar — aynı sinyalleri Google sıralama için kullanır.

Hızlı kazanım: Microsoft Clarity’i kurun (ücretsiz, 5 dakika). Bir hafta bekleyin. En çok ziyaret edilen sayfanızda kaydırma ısı haritanızı kontrol edin. Eğer çoğu kullanıcı CTA’nıza ulaşmadan kaydırmayı durduruyorsa, düzen sorununuz var.

8. Dönüşüm Odağına Yönelik Tasarım

Her yerleşim kararı dönüşüm hedefine hizmet etmelidir. Farklı niyet türleri için sayfaları nasıl yapılandıracağınıza dair bilgiler:

Bilgilendirici sayfalar (blog gönderileri, rehberler):

İçerik önce, CTAlar doğal karar noktalarında
Yüksek değerli bölümlerden sonra içerik içindeki CTAlar (kesintiye uğratmadan)
Oturum derinliğini artıran "İlgili içerik" widget'ları
Email yakalama noktaları %50 ve %100 kaydırma derinliğinde

İşlem sayfaları (ürün, fiyatlandırma, kayıt):

Katlama üzerinde değer önerisi + CTA olan hero
Katlama hemen altında sosyal kanıt (referanslar, logolar, istatistikler)
CTA’ya yönlendiren özellik/fayda blokları
Hero’nun ardından mobilde yapışkan CTA çubuğu
CTA’nın yanında itirazları ele alan SSS

Navigasyon sayfaları (kategori, merkezi sayfalar):

Görsel farklılıklarla net bir grid/liste
Bilişsel yükü azaltan filtrasyon/sıralama mekanizmaları
Öncelikli içerik için öne çıkan öğeler
Yönlendirme için ekmek kırıntıları

İçerik-CTA oranı kuralı: Her 3 içerik bölümüne 1 CTA fırsatı ekleyin. Saldırgan açılır pencereler değil — bağlam içi bağlantılar, satır içi CTAlar veya yapışkan çubuklar.

Kılavuzlama Optimizasyonu Kontrol Listesi

Her önemli sayfa için bunları kontrol edin:

[ ] Birincil mesaj ve CTA yukarıda katlamada görünür (kaydırma gerekmez)
[ ] 3+ belirgin seviyeye sahip net görsel hiyerarşi
[ ] Düzen F deseni (içerik) veya Z deseni (iniş sayfası) ile uyumlu
[ ] Birincil CTA sayfadaki en yüksek kontrast öğe
[ ] Boş alan: 50-75 karakter satır uzunluğu, 1.5+ satır yüksekliği
[ ] Mobil: Ana CTA parmak bölgesinde, 44px+ dokunma hedefleri
[ ] Kaydırma ısı haritası kullanıcıların %50+’sının ana CTA’ya ulaşmasını gösteriyor
[ ] Etkileşimli olmayan öğelerde öfke tıklaması yok
[ ] Sayfa, gerçek sona ulaşmadan önce "bitiyormuş" gibi görünmüyor (yanlış alt)
[ ] Yazı tipi kontrast oranı 4.5:1+ (WCAG AA uyumluluğu)

LANGR Düzen Sorunlarını Nasıl Tespit Eder

LANGR'nın düzen tarama modülü, sayfanızın düzenini üç görünüm alanında (mobil, tablet, masaüstü) analiz etmek için yapay zeka kullanır. Aşağıdakileri kontrol eder:

CTA görünürlüğü: CTAlar her cihazda katlama üzerinde mi görünür?
İçerik yoğunluğu: İlk görünüm alanında yeterli anlamlı içerik var mı?
Dokunma hedefleri: Mobil elemanlar 44x44px minimumunu karşılıyor mu?
Görsel hiyerarşi: Her görünüm alanında net bir birincil eleman var mı?
Yanlış alt: Sayfa gereksiz yere bitiyor mu gibi görünüyor?
Boşluk tutarlılığı: Kenar boşlukları ve paddingler tutarlı mı?

Bu, LANGR'nın 13 SEO disiplininden biridir. Her denetim, düzeninizi otomatik olarak kontrol eder ve ziyaretçilerin muhtemel olarak düşeceği noktaları tespit eder.

Yaygın Düzen Hataları (Etkilerine Göre Sıralanmış)

Yukarıda katlamada hiçbir CTA yok — Çoğu kullanıcı ilk ekranı geçmez
Düz görsel hiyerarşi — Her şey eşit derecede önemli görünür = hiçbir şey önemli değildir
Yoğun içerik blokları — Metin duvarları anında çıkmalara neden olur
Mobilde masaüstü düzeni — Okunaksız hale gelen yan yana elemanlar
İçerikten sonra gömülü CTA — Yalnızca ilgilenen kullanıcılar (azınlık) bunu görür
Küçük dokunma hedefleri — 30px butonlar öfke tıklamaları ve terk edilen oturumlar yaratır
Yanlış altlar — Düzen, sayfanın görünen sona ulaştığı gibi görünmesine neden olur
Rekabet eden CTAlar — Eşit öne çıkan çok sayıda buton karar felcine neden olur

Sırada Ne Var?

Adım 10: Çok Dilli SEO — Hedeflerinizi sıralamanızdan ödün vermeden hreflang, çeviri kalitesi, yerel yönlendirme ve uluslararası hedefleme ile küresel kitlelere ulaşmak.

Bu rehber, LANGR'nın 13 adımlı SEO serisinin bir parçasıdır. Ücretsiz bir denetim yapın ve sitenizin 13 disiplindeki durumunu görün.

SEO Rehberi Adım 9: Kılavuzlama Optimizasyonu — Elemanların Yerleşimi Beklediğinizden Daha Önemli