Mobil Öncelikli Dizine Ekleme: Küçük Ekranlar İçin SEO

Yıllarca Google, bir web sitesinin masaüstü sürümünü "birincil" sürüm ve mobil sürümü "alternatif" olarak ele aldı. O devir bitti.

Mobil Öncelikli İndeksleme (Mobile-First Indexing) ile Google, indeksleme ve sıralama için ağırlıklı olarak içeriğinizin mobil sürümünü kullanır. Sitenizin harika bir masaüstü içeriği varsa ancak soyulmuş veya bozuk bir mobil sürümü varsa, masaüstünde arama yapan kullanıcılar için bile sıralamanız zarar görür.

Bu rehber, sitenizin mobil öncelikli bir dünyada hayatta kalmasını ve gelişmesini nasıl sağlayacağınızı açıklar.

1. Mobil Öncelikli İndeksleme Nedir?

Yaygın bir yanlış kanıyı açıklığa kavuşturmak önemlidir: Ayrı bir "Mobil İndeks" yoktur. Yalnızca tek bir Google İndeksi vardır.

• Eski Yöntem: Googlebot (Masaüstü) sitenizi tarardı. Büyük bir ekranda gördüklerine dayanarak nerede sıralanacağınıza karar verirdi.
• Şu Anki Yöntem: Googlebot (Akıllı Telefon) sitenizi tarar. Mobil bir ekranda gördüklerine dayanarak nerede sıralanacağınıza karar verir.

Sonuç: "Yerden tasarruf etmek" için mobilde içerik gizlerseniz (örneğin, metin veya sekmeleri kaldırarak), Google artık bu içeriği etkili bir şekilde göremez. İndekslenmeyecektir.

2. Çözüm: Duyarlı Web Tasarımı (Responsive Web Design)

Ayrı bir mobil siteniz (m.ornek.com) olsa da, Google Duyarlı Web Tasarımını şiddetle önerir.

Duyarlı tasarım, web sitenizin tüm cihazlar için aynı HTML kodunu ve aynı URL'yi kullandığı, ancak ekran boyutuna göre düzeni değiştirmek için CSS kullandığı anlamına gelir.

Hayati Etiket: Görüntü Alanı (Viewport)

Duyarlı tasarımın çalışması için, sitenizdeki her sayfanın <head> bölümünde aşağıdaki meta etiketini içermesi gerekir:

<meta name="viewport" content="width=device-width, initial-scale=1">

Bu satır tarayıcıya şunu söyler: "Bu içeriği, kullanılan belirli cihazın genişliğine uyacak şekilde ölçeklendirin." Bu olmadan, mobil tarayıcılar masaüstü sürümünü oluşturmaya ve küçültmeye çalışır, bu da kullanıcıları sıkıştırıp yakınlaştırmaya zorlar (büyük bir kullanılabilirlik hatası).

3. "İçerik Eşliği" Kuralı

Mobil Öncelikli İndekslemede başarılı olmak için, masaüstü ve mobil sürümleriniz arasında Eşlik (eşitlik) sağlamalısınız.

• Aynı İçerik: Metin, resimler ve videolar aynı olmalıdır. Mobil kullanıcılar için makalelerinizi özetlemeyin.
• Aynı Yapısal Veri: Şema işaretlemesi (JSON-LD) mobil sürümde mevcut olmalıdır.
• Aynı Meta Veriler: Başlıklar ve Meta Açıklamalar aynı olmalıdır.
• Görsel Kontrol: Reklamların veya açılır pencerelerin (geçiş reklamları) mobilde asıl içeriği kapatmadığından emin olun. Google, içeriğe ulaşmayı zorlaştırdığı için rahatsız edici geçiş reklamlarından kaçınmayı önerir.

4. Mobil Sorunları Bulmak

Google, Search Console’daki "Mobil Kullanılabilirlik" raporunu ve Mobil Uyumluluk Testi’ni Aralık 2023’te kullanımdan kaldırdı. Bugün sayfaları kontrol etmek için Chrome DevTools’ta Lighthouse çalıştırın veya PageSpeed Insights kullanın ve gerçek bir telefonda test edin.

İşte yaygın üç mobil sorun (adlar eski rapordan geliyor) ve bunları nasıl düzelteceğiniz:

Hata A: "Metin okunamayacak kadar küçük"

• Sorun: Yazı tipi boyutu o kadar küçüktür ki, kullanıcılar okumak için yakınlaştırmak zorunda kalır.
• Çözüm: Google, gövde metni için en az 16px temel yazı tipi boyutu önerir. Yazı tiplerini sabit küçük boyutlara (örneğin, 10px) ayarlamadığınızdan emin olmak için CSS'nizi kontrol edin.

Hata B: "Tıklanabilir öğeler birbirine çok yakın"

• Sorun: "Şişman Parmak Sendromu." Düğmeler veya bağlantılar o kadar yakındır ki, "İptal"e dokunmaya çalışan bir kullanıcı yanlışlıkla "Gönder"e dokunur.
• Çözüm: Dokunma hedeflerinin en az 48x48 piksel boyutunda olduğundan ve aralarında kabaca 8 piksellik bir kenar boşluğu olduğundan emin olun.

Hata C: "İçerik ekrandan daha geniş"

• Sorun: Kullanıcı, sayfanın tamamını görmek için yatay olarak (soldan sağa) kaydırmak zorundadır. Bu, UX'te kesin bir "hayır"dır.
• Çözüm: Bu genellikle sabit genişliğe sahip bir resim veya tablodan kaynaklanır (örneğin, width: 800px). Öğelerin otomatik olarak küçülmesi için CSS'nizdeki sabit genişlikleri göreli genişliklerle (örneğin, max-width: 100%) değiştirin.

Sonuç

Mobil öncelikli dizine ekleme kapatabileceğiniz bir ayar değil, web’in varsayılan durumudur. Duyarlı tasarım, içerik eşliği ve sayfalarınızı gerçek telefonlarda ve Lighthouse ile test ederek sitenizin küçük ekranda gezinen herkes için çalışmasını sağlarsınız.