← Blog
SEO7 dk okumaMegis

Mobil SEO Optimizasyonu: Mobile-First Indeksleme Rehberi

Google'in mobile-first indeksleme yaklasimina uyum saglayarak mobil arama siralamalarinizi yukseltin.

Mobile-First Indexing Nedir?

Google, 2019'dan itibaren tum yeni siteler icin ve 2023'ten itibaren tum siteler icin mobile-first indexinguygulamaktadir. Bu, Google'in sitenizin mobil versiyonunu birincil dizinleme ve siralama kaynagi olarak kullanmasi anlamina gelir. Masaustu versiyonunuz ne kadar iyi olursa olsun, mobil deneyiminiz yetersizse arama siralamnaleriniz olumsuz etkilenir.

Turkiye'de internet kullaniiclarinin %75'inden fazlasi mobil cihazlardan erisim saglamaktadir. Bu rehberde, sitenizi mobil SEO icin kapsamli sekilde optimize etmenin tum adimlarini bulacaksiniz.

Responsive Tasarim: Temel Yaklasim

Google'in resmi olarak onerdigi mobil uyumluluk yaklasimi responsive web tasarimdir. Tek bir URL ve tek bir HTML kodu kullanilarak, CSS media queries ile farkli ekran boyutlarina uyum saglanir.

Responsive Tasarim Ilkeleri

  • Viewport meta etiketi: Her sayfanin <head> bolumunde asagidaki etiket bulunmalidir:
<meta name="viewport"
      content="width=device-width, initial-scale=1" />
  • Esnek grid sistemi: Sabit piksel degerleri yerine yuzde, vw, vh, rem ve fr birimleri kullanin.
  • CSS Flexbox ve Grid: Modern layout teknikleri ile duyarli tasarimlar olusturun.
  • Media queries: Yapisal degisiklikler icin breakpoint'ler tanimlayin.
  • Gorsel esneklik: max-width: 100% ile gorsellerin tasmasini onleyin.
  • Minimum font boyutu: Govde metni en az 16px olmalidir.
/* Temel responsive breakpoint ornegi */
/* Mobil (varsayilan) */
.container {
  padding: 1rem;
  font-size: 1rem;
}

/* Tablet */
@media (min-width: 768px) {
  .container {
    padding: 2rem;
    max-width: 720px;
    margin: 0 auto;
  }
}

/* Masaustu */
@media (min-width: 1024px) {
  .container {
    max-width: 960px;
  }
}

Mobil Kullanilabilirlik Optimizasyonu

Google Search Console'daki "Mobil Kullanilabilirlik" raporu, sitenizde mobil uyumluluk sorunlarini tespit eder. En yaygin sorunlar ve cozumleri:

Dokunma Hedefleri (Touch Targets)

Mobil cihazlarda butonlar, baglantilar ve form elemanlari parmakla rahatca tiklanabilir boyutta olmalidir.

  • Minimum boyut: 48x48 piksel (CSS pikseli).
  • Minimum bosluk: Dokunma hedefleri arasinda en az 8 piksel bosluk.
  • Padding kullanin: Kucuk metin linklerini padding ile genisletin.
/* Dokunma hedefi optimizasyonu */
.mobile-button {
  min-height: 48px;
  min-width: 48px;
  padding: 12px 24px;
}

.nav-link {
  display: inline-block;
  padding: 12px 16px; /* Tiklanabilir alani genisletir */
}

Icerik Genisligi ve Yatay Kaydirma

  • Icerik, viewport genisligini asmamalidir. Yatay kaydirma kotu kullanici deneyimidir.
  • Tablolar icin overflow-x: auto ile yatay kaydirma saglayiin.
  • Genis gorsellere max-width: 100% uygulayin.
  • Sabit genislikli elemanllardan kacinin.

Okunabilirlik

  • Font boyutu: Govde metni minimum 16px. Basliklar oransal olarak buyuk.
  • Satir yuksekligi: line-height: 1.5 veya daha yuksek.
  • Kontrast orani: WCAG AA standartlarini karsilayin (metin/arka plan kontrast orani en az 4.5:1).
  • Zoom engellemeyin: user-scalable=no ve maximum-scale=1 kullanmayin.

Mobil Sayfa Hizi

Mobil cihazlar genellikle daha yavas islemcilere ve daha dusuk bant genisligine sahiptir. Bu nedenle mobil hiz optimizasyonu ayri bir onem tasir.

Mobil Hiz Kritik Alanlar

  • JavaScript boyutunu azaltin: Mobil cihazlar JS'yi daha yavas parse ve calistirir. Bundle boyutunu 200KB altinda tutmaya calisin (gzip sonrasi).
  • Kritik CSS inline: Above-the-fold icerik icin gereken CSS'i <style> etiketi icinde inline yerlestirin.
  • Font dosyalarini optimize edin: Yalnizca kullandiginiz karakter alt kumelerini yukleyin. font-display: swap ile metin gorunurlugunu garantileyin.
  • Gorsel boyutlarini mobil icin ayarlayin: Masaustu boyutundaki gorselleri mobilde yuklemeyin. srcset ile cihaza uygun boyutlar sunun.
  • Ucuncu parti scriptleri minimuma indirin: Her ek script mobil performansi orantisiz etkiler.
  • Network bilgi API: Yavas baglantilarda dusuk kaliteli gorsel veya azaltilmis animasyon sunun.

Mobil Performans Test Araclari

AracOzellik
PageSpeed InsightsMobil ve masaustu ayri skorlar, CrUX verisi
Chrome DevTools (Device Mode)Mobil cihaz simulasyonu, CPU/ag yavaslatma
LighthouseMobil performans denetimi ve iyilestirme onerileri
WebPageTestGercek mobil cihazlardan test (Moto G4, vb.)
Google Mobile-Friendly TestSayfanin mobil uyumluluk durumunu kontrol eder

Mobil Icerik Stratejisi

Mobile-first indexing ile mobil ve masaustu iceriginin ayni olmasi kritik oneme sahiptir. Google, mobil versiyonda eksik olan icerigi dizinlemez.

  • Icerik esitligi: Mobil ve masaustu versiyonlarinda ayni icerik sunun. Mobilde icerik gizlemeyin veya azaltmayin.
  • Yapilandirilmis veri: Schema markup hem mobil hem masaustu versiyonunda ayni olmalidir.
  • Meta etiketler: Title, description ve robots etiketleri her iki versiyonda tutarli olmalidir.
  • Gorsel alt etiketleri: Mobil versiyondaki gorsellerde de alt etiketleri olmalidir.
  • Hreflang: Cok dilli sitelerde hreflang etiketleri mobil versiyonda da dogru uygulanmalidir.

AMP (Accelerated Mobile Pages)

AMP, Google'in mobilde ultra hizli sayfa yukleme icin gelistirdigi bir frameworktur. 2026 itibariyle AMP artik bir siralama gerekliligi degildir ve ozel carousel ayricaligi kaldirilmistir. Ancak belirli durumlarda hala fayda saglayabilir:

  • Ne zaman dusunulmeli: Cok yuksek hacimli haber siteleri, basit icerik sayfalari.
  • Ne zaman gerekli degil: E-ticaret, SaaS, interaktif uygulamalar. Standart web teknolojileri ile ayni veya daha iyi sonuclar elde edebilirsiniz.
  • Alternatif yaklasim: Core Web Vitals metriklerini karsilayan hizli bir standart site, AMP'in tum SEO avantajlarini saglar.

Mobil SEO Teknik Kontrol Listesi

  1. Viewport meta etiketi dogru tanimlanmis mi?
  2. Responsive tasarim tum ekran boyutlarinda dogru calisiyor mu?
  3. Dokunma hedefleri minimum 48x48px boyutunda mi?
  4. Yatay kaydirma sorunu var mi?
  5. Font boyutu en az 16px mi?
  6. Zoom engellenmemis mi?
  7. Mobil ve masaustu icerik ayni mi?
  8. Intrusive interstitial (tam ekran pop-up) kullanilmiyor mu?
  9. Mobil Core Web Vitals metrikleri "Iyi" kategorisinde mi?
  10. JavaScript mobil cihazda performans sorunu yaratiyor mu?
  11. Gorseller responsive ve optimize edilmis mi?
  12. Schema markup mobilde de uygulanmis mi?
  13. Hamburger menu ve navigasyon mobilde dogru calisiyor mu?
  14. Form elemanlari mobilde kolayca dolduruulabiliyor mu?

Mobil Pop-up ve Interstitial Politikasi

Google, mobil kullanicilarin icerige erisiimini engelleyen "intrusive interstitial" elemanlarini cezalandirmaktadir. Asagidaki durumllardan kacinin:

  • Sayfa yuklendiginde icerigi kaplayan tam ekran pop-up'lar.
  • Kullanicinin kapatmasi gereken, icerigi gorunmez kilan overlay'ler.
  • Above-the-fold alanin tamamini kaplayan standalone interstitial.

Kabul edilen durumlar:Yasal zorunluluk gerektiren bildirimler (cerez onay banneri, yas dogrulama), giris gerektiren ozel icerik, makul boyutlu banner'lar.

PWA (Progressive Web App) ve Mobil SEO

PWA teknolojileri, mobil kullanici deneyimini onemli olcude iyilestirebilir:

  • Service Worker: Offline erisim ve hizli tekrarlayan ziyaretler icin cache stratejileri.
  • Web App Manifest: Ana ekrana ekleme ozeligi ile uygulama benzeri deneyim.
  • Push bildirimleri: Kullanicilari geri getirmek icin web push bildirimleri.
  • App Shell modeli: Temel arayuz aninda yuklenirken icerik arka planda getirilir.

Not: PWA ozellikleri dogrudan siralama faktoru degildir, ancak kullanici deneyimini ve tekrarlayan ziyaret oranini artirarak dolayli SEO faydasi saglar.

Sonuc:Mobil SEO, 2026'da artik ayri bir disiplin degil, SEO'nun kendisidir. Mobile-first indexing ile Google, sitenizin mobil versiyonunu birincil kaynak olarak kullanmaktadir. Responsive tasarim, mobil hiz optimizasyonu, dogru dokunma hedefleri ve tutarli icerik sunumu, basarili bir mobil SEO stratejisinin temelleridir. Megis olarak, tum web projelerimizi mobile-first yaklasimla gelistiriyor ve mobil performansi en ust duzeyde tutuyoruz.

#mobil seo#mobile-first#responsive tasarim#mobil uyumluluk