Blog / Hazır Site Şablonları
"Responsive" yazması, gerçekten öyle olduğu anlamına gelmiyor.
Bir şablonun mobil uyumlu olduğu iddiası ile gerçekten sorunsuz çalışması arasında fark olabiliyor. Yayına almadan önce nasıl test edeceğinizi anlatıyorum.
Google'ın Mobil Uyumluluk Testi aracı nerede?
Uzun yıllar "mobil uyumluluk testi" denince akla Google'ın aynı adlı ücretsiz aracı geliyordu. Google bu aracı, API'sini ve Search Console'daki Mobil Kullanılabilirlik raporunu Aralık 2023'te kaldırdı. Bugün aynı kontrolü yapmak için Google'ın önerdiği yol Lighthouse ve PageSpeed Insights.
- — PageSpeed Insights: sayfa adresini girip "Mobil" sekmesine bakın. Hem gerçek kullanıcı verisi (varsa) hem de laboratuvar ölçümüyle hız, erişilebilirlik ve temel SEO kontrollerini gösterir.
- — Lighthouse: Chrome'da sayfaya sağ tıklayıp "İncele" ile geliştirici araçlarını açın, Lighthouse sekmesinde cihaz olarak "Mobile" seçip raporu çalıştırın. Yayına almadığınız bir şablonu yerel ortamda da test edebilirsiniz.
- — Search Console URL Denetimi: yayındaki bir sayfada "Canlı URL'yi test et" ile Google'ın sayfayı akıllı telefon tarayıcısıyla nasıl gördüğünü ve ekran görüntüsünü inceleyebilirsiniz.
Tarayıcı geliştirici araçlarıyla hızlı kontrol
Tarayıcınızın geliştirici araçlarındaki "cihaz simülasyonu" özelliği, farklı bir telefon satın almadan hızlıca bu kontrolü yapmanızı sağlıyor — birkaç dakikanızı alır ama yayın sonrası sürprizlerin önüne geçer. Genel çerçeve için HTML Hazır Site Şablonları Ücretsiz rehberime bakabilirsiniz.
Gerçek cihazlarda test etmenin önemi
Simülatörler çoğu sorunu yakalasa da dokunma etkileşimleri ve gerçek yükleme hızı ancak gerçek bir cihazda test edildiğinde tam olarak anlaşılıyor. Mümkünse farklı ekran boyutlarına sahip birkaç cihazda kontrol edin.
Yayına almadan önce mobil kontrol listesi
- — Sayfanın
<head>bölümünde<meta name="viewport" content="width=device-width, initial-scale=1">etiketi var mı? - — Telefonda yatay kaydırma çıkıyor mu? Geniş tablo, görsel ya da sabit genişlikli bir blok ekranın dışına taşıyor mu?
- — Gövde metni yakınlaştırmadan rahat okunuyor mu? Çoğu tasarımda 16 piksel civarı gövde yazısı güvenli bir başlangıç.
- — Buton ve linkler parmakla rahat basılıyor mu? Erişilebilirlik önerisi, dokunma alanlarının yaklaşık 48 piksel olması ve birbirine yapışmaması.
- — Menü açılıp kapanıyor, alt menülere dokunarak ulaşılabiliyor mu?
- — Açılır pencere ya da çerez bandı ana içeriği kapatıyor mu? Google, içeriği kapatan araya giren pencereleri mobilde kötü deneyim olarak değerlendiriyor.
- — Formlarda telefon alanı sayı klavyesini, e-posta alanı @ klavyesini açıyor mu; form telefonda baştan sona gönderilebiliyor mu?
- — Telefon numarası tıklanınca arama başlatıyor, WhatsApp butonu doğru numaraya gidiyor mu?
- — Görsellerin genişlik ve yüksekliği tanımlı mı? Tanımsız görseller yüklenirken sayfayı kaydırır (CLS).
En sık görülen mobil sorunlar
Taşan menüler, küçük dokunma alanları ve yavaş yüklenen büyük görseller en sık karşılaşılan sorunlar. Bu sorunların birçoğu hız ve SEO sorunlarıyla da ilişkili — detaylar için Hazır Şablonlarda En Sık Karşılaşılan Hız ve SEO Sorunları yazımı okuyabilirsiniz.
Sık Sorulan Sorular
Mobil uyumluluk testi hakkında merak edilenler
Mobil uyumluluk SEO'yu etkiliyor mu?
+
Evet. Google sayfaları mobil öncelikli indekslemeyle, yani mobil sürümünü esas alarak değerlendiriyor; mobilde eksik ya da bozuk görünen içerik aramadaki görünürlüğü de etkiliyor.
Google Mobil Uyumluluk Testi aracı kaldırıldı mı?
+
Evet. Google Mobil Uyumluluk Testi aracını ve Search Console'daki Mobil Kullanılabilirlik raporunu Aralık 2023'te kaldırdı. Aynı kontrol için PageSpeed Insights'ın mobil sekmesini, Chrome'daki Lighthouse'u ve Search Console'daki URL Denetimi aracını kullanabilirsiniz.
Test için ücretli araç gerekli mi?
+
Hayır. Tarayıcınızın geliştirici araçları, Lighthouse ve PageSpeed Insights ücretsiz ve çoğu durumda yeterli; bunları birkaç gerçek telefonda yapılan kontrolle tamamlamak en sağlıklısı.
Test ne sıklıkla tekrarlanmalı?
+
Yayına almadan önce ve her önemli içerik ya da tasarım güncellemesinden sonra tekrar test etmek en sağlıklısı. Yeni eklenti, canlı destek ya da çerez bandı eklediğinizde de mobil görünümü yeniden kontrol edin.
İlgili Rehberler
Konunun tamamı için
Pillar Rehber
HTML Hazır Site Şablonları Ücretsiz
Pillar Rehber
Gerçekten Kullandığım Araçlar
Hizmet
Teknik SEO
HTML Hazır Site Şablonları
Bu konudaki diğer yazılar
Yazan
Harun Erçoban
Esnafa ve KOBİ'lere web sitesi, SEO ve sosyal medyada 10 yılı aşkın süredir tek muhatap olarak hizmet veriyorum. Ajans değilim — bu sayfadaki içerik de dahil, sitedeki tüm çalışmaların arkasında benim adım var.
Hakkımda daha fazla bilgi →İletişim
Mobil deneyiminizi birlikte test edelim.
Sitenizin farklı cihazlarda nasıl göründüğünü kontrol edip gerekli düzeltmeleri önerebilirim.
Bu Konuda Destek mi Arıyorsunuz?
Hazır bir şablonla hızlı başlayabilir ya da size özel bir site yaptırabilirsiniz.
Yukarıda anlattıklarımı kendi işletmenize nasıl uygulayacağınızdan emin değilseniz, ilgili hizmetime göz atabilir ya da doğrudan WhatsApp'tan yazabilirsiniz.
Bu hizmetle yürüttüğüm gerçek işlerden: Aktar Şeyhi vaka analizi · Demirhas Makine vaka analizi · tüm başarı hikayeleri