Skip to main content
SEO

Mobil Erişilebilirlik ve SEO

Sitenizin mobil cihazlarda erişilebilir ve SEO açısından optimize edilmiş olmasını sağlayın — dokunma hedefleri, görünüm alanı yapılandırması, mobil ekran okuyucu testi ve mobil öncelikli dizine eklemeyi kapsar.

Mobil Öncelikli Dizine Ekleme ve Erişilebilirlik

Google tüm siteler için mobil öncelikli dizine eklemeye geçti. Bu, sayfanızın mobil sürümünün Google'ın dizine eklediği ve sıralama için kullandığı sürüm olduğu anlamına gelir. Mobil erişilebilirlik ve mobil SEO dolayısıyla aynı problemdir.

Görünüm Alanı Yapılandırması

Görünüm alanı meta etiketi mobil oluşturmanın temelidir. Doğru yapılandırma duyarlı oluşturmayı etkinleştirir. maximum-scale=1 veya user-scalable=no asla kullanmayın — bu, kullanıcıların sıkıştırarak yakınlaştırmasını engeller ve WCAG 1.4.4'ü ihlal eder.

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

Dokunma Hedefi Boyutu

WCAG 2.5.5, dokunma hedeflerinin en az 44×44 CSS piksel olmasını gerektirir. Google'ın mobil kullanılabilirlik raporu, birbirine çok yakın 48×48 pikselden küçük dokunma hedeflerini işaretler.

  • Minimum önerilen dokunma hedefi: 44×44 CSS piksel.
  • Görsel öğeyi büyütmek yerine küçük öğelerin etrafına dolgu ekleyin.
  • Bitişik dokunma hedefleri arasında yeterli boşluk bırakın (minimum 8 piksel).
/* Erişilebilir dokunma hedefleri */
button, a, input {
  min-height: 44px;
  min-width: 44px;
  padding: 0.75rem 1rem;
}

Metin Boyutu ve Okunabilirlik

WCAG 1.4.4, içerik veya işlevsellik kaybı olmadan metnin %200'e kadar yeniden boyutlandırılabilmesini gerektirir. Yazı tipi boyutları ve satır yükseklikleri için göreli birimler (rem, em) kullanın. Rahat okuma için minimum 16 piksellik gövde yazı tipi boyutu sağlayın.

Yön Kilidi: WCAG 1.3.4

WCAG 1.3.4, içeriğin görüntüsünü ve işlemini tek bir ekran yönüyle kısıtlamamasını gerektirir. Sabit konumlarda bağlanmış cihazları olan kullanıcılar cihazlarını döndüremez. CSS veya JavaScript kullanarak bir sayfayı dikey veya yatay moda asla kilitlemeyin.

Mobil Ekran Okuyucu Testi

Masaüstü ekran okuyucu testi mobil deneyimleri kapsamaz. Sitenizi mobil ekran okuyucularla test edin:

  • iOS VoiceOver: Ayarlar → Erişilebilirlik → VoiceOver'dan etkinleştirin. Öğeler arasında gezinmek için sağa kaydırın, etkinleştirmek için çift dokunun.
  • Android TalkBack: Ayarlar → Erişilebilirlik → TalkBack'ten etkinleştirin.
  • Gerçek cihazlarda test edin, yalnızca emülatörlerde değil.

Mobil Ağlarda Sayfa Hızı

Mobil kullanıcılar daha yavaş bağlantılarda olma olasılığı daha yüksektir. Google'ın Temel Web Vitals değerlendirmesi, yavaş bağlantılardaki mobil kullanıcılar dahil gerçek kullanıcılardan gelen saha verilerini kullanır.

  • Sunucu yanıt süresini küresel olarak azaltmak için bir İçerik Dağıtım Ağı (CDN) kullanın.
  • Kritik yazı tipleri ve görseller için <link rel="preload"> kaynak ipuçlarını uygulayın.
  • Sunucunuzda Brotli veya gzip sıkıştırmasını etkinleştirin.

Kaynaklar