Mobil Uygunluğunu Test Eden Uygulama

Bir URL girin; test aracı bu URL’yi varsayılan olarak iPhone boyutu olan 375×812 piksellik bir simüle edilmiş telefon ekranına yükler, Google’un eski Mobile-Friendly Test testi tarafından tespit edilen yaygın mobil okunabilirlik sorunlarını kontrol eder ve düzeltebileceğiniz sorunların listesini geri verir: eksik viewport meta etiketi, metnin 12px’den küçük olması, dokunma hedeflerinin 48×48px’den daha yakın olması, yatay kaydırma, Flash veya desteklenmeyen eklentiler ve ekran boyutundan daha geniş içerik.

Test nasıl çalışır?

  1. 1

    URL'yi girin

    Protokol içeren tam URL. Yalnızca kamuya açık sayfalar için.

  2. 2

    Sayfa, telefon boyutundaki bir görünüm alanında görüntülenir.

    Standart olarak 375×812 boyutudur ve yapılandırılabilir.

  3. 3

    Otomatik kontroller çalışır

    Görünüm meta bilgileri, metin boyutu, dokunma hedef aralığı, aşırı gösterim, eklentiler.

  4. 4

    Önizle ve raporla

    Çıkarılan telefon görünümünün ekran görüntüsü ve belirli sorunların listesi.

Testçi neyi kontrol eder?

Görünüm Konfigürasyonu

  • <meta name="viewport" content="width=device-width, initial-scale=1"> modeli var mı? Bu model olmadan mobil tarayıcılar telefonun masaüstü boyutunda çalışmış gibi görünüyor ve metin çok küçük hale gelerek ekrana sığıyor.

Metin boyutu

  • 12 px’den küçük, işlenmiş her metin işaretlenir; pinch-zoom kullanılmadığında telefonlarda okunması zordur.
  • Birçok stil kılavuzu gövde metni için en az 16 px’lik yazı boyutu önerir. Çok küçük alt yazılar kabul edilebilir; ancak 11 px’lik gövde metni kabul edilemez.

Dokunma hedefi boyutu

  • Butonlar, linkler ve form kontrolleri en az 48×48 px boyutunda olmalıdır (Google/W3C Mobil Erişilebilirlik Kılavuzu).
  • Küçük hedefler başparmakla doğru şekilde vurulması zor olup işaretlenir.

Hedef noktalar arasındaki aralık

  • Komşu hedeflere 8 px’den daha yakın konumda yer alan hedefler yanlış dokunuşlara yol açar ve her biri ayrı ayrı işaretlenir.

Yatay kaydırma

  • Görünüm alanının ötesinde uzanan içerik yatay kayma gerektirir; bu da kötü bir mobil kullanıcı deneyimi oluşturur. Genellikle max-width: 100% etiketi bulunmayan bir görüntü veya yeniden akış yapamayan bir tablo nedeniyle meydana gelir.

Desteklenmeyen eklentiler

  • Flash, Silverlight ve ActiveX telefonlarda çalışmaz. Eski siteler bazen hâlâ bu teknolojilere başvurur.

Yazı yükleme

  • Birkaç saniye boyunca işlemeyi engelleyen çok büyük web yazı tipleri işaretlenir.

Neden hâlâ önemli?

Google, Aralık 2023’te bağımsız Mobil Dostu Testini durdurdu; ancak mobil uyumluluk, Core Web Vitals ve sayfa deneyimi metrikleri aracılığıyla hâlâ doğrudan bir sıralama sinyalidir. Mobil öncelikli indeksleme, Google’ın sitenizi bir telefon cihazı gibi taradığı anlamına gelir; mobilde bozulan öğeler masaüstü sıralamalarında da görülür.

Tipik düzeltmeler

  • Viewport meta etiketi ekleyin: <head> içine <meta name="viewport" content="width=device-width, initial-scale=1">.
  • Medya sorguları aracılığıyla responsif CSS: @media (max-width: 768px) { ... }.
  • Sabit genişlikli düzenler yerine Flexbox ve Grid kullanın.
  • Görseller için max-width: 100%; height: auto ayarlayın, böylece görseller görünüm alanıyla birlikte küçülür.
  • Küçük ekranlarda tabloları kaydırılabilir hale getirin: <div style="overflow-x: auto"> ile sarın.
  • Kullanıcı tercihine göre ölçekleme çalışsın diye metin boyutlandırmada rem veya em kullanın.

Testin fark etmedikleri

  • Gerçek donanımda performans: 3G şebekesinde çalışan düşük seviye bir Android telefonda, bu test aracının simüle etmediği gecikmeler yaşanır. Performans ölçümü için Lighthouse kullanın.
  • Dokunma etkileşimleri: Yalnızca üzerine gelince açılan, dokununca çalışmayan açılır menüler gerçek bir cihazda manuel olarak test edilmelidir.
  • Mobil boyutlandırmanın ötesinde erişilebilirlik: Kontrast, ekran okuyucu desteği ve klavye navigasyonu için özel erişilebilirlik araçlarını kullanın.
  • Mobile özgü tarayıcılarda JavaScript hataları: iOS’taki Safari bazen diğer WebKit sürümlerinden farklı davranır.

Sık Sorulan Sorular

Benzer kontroller, farklı uygulama. Google, kamuya açık aracı 2023 yılının sonlarında kullanımdan kaldırdı. Bu test aracı, başsız bir tarayıcı tarafından alınan sayfa sürümüne karşı Google’un kullandığı aynı klasik kontrolleri uygular.

Evet, Google, 2020 yılından itibaren mobil öncelikli yaklaşımı uygulamaktadır; yani mobil versiyonunuz sıralamada temel verilere dayanmaktadır. Mobil sorunları, masaüstü aramalarda bile sıralamayı olumsuz etkiler.

Hayır. Test aracı yalnızca kamuya açık URL’leri alır. Korumalı test ortamında testi Chrome DevTools’un cihaz emülasyon modunda yerel olarak gerçekleştirin.

Standart boyut 375×812 (iPhone 12/13/14)’dir. Bu değer, 390×844 (iPhone 14 Pro), 360×640 (tipik Android cihazları) veya 412×915 (Pixel 7) olarak ayarlanabilir.

Genellikle sayfanın büyüklüğüne bağlı olarak 5–15 saniye sürer. Birçok kod bloğu içeren ağır sayfalar daha uzun sürebilir; test aracı yüklenme olayını ve ardından kısa bir boş zaman dilimini bekledikten sonra verileri kaydeder.

İlgili Araçlar

Araç diğer dillerde mevcuttur