Mobil uyumluluk nedir?
Mobil uyumluluk, bir web sayfasının küçük ekranlarda içeriği okunabilir sunması ve temel işlemlerin dokunma, gezinme ve form kullanımıyla tamamlanabilmesidir. Küçük ekranda açılmak, bütün alışveriş adımlarının çalıştığını göstermez.
Tanım
Mobil uyumluluk, bir web sayfasının küçük ekranlarda içeriği okunabilir sunması ve temel işlemlerin dokunma, gezinme ve form kullanımıyla tamamlanabilmesidir.
Bir bakışta
Mobil uyumluluk satıcı için ne demektir?
Mobil uyumluluk, ürün sayfasının telefonda yalnız açılmasıyla tamamlanmaz. Müşteri ölçüyü okuyabilmeli, doğru seçeneği belirleyebilmeli ve ilerleme düğmesini kullanabilmelidir. Türkiye’de kendi mağazasını yöneten satıcı kontrolü ana sayfayla sınırlamamalıdır. Kategori, ürün, sepet ve form adımlarını aynı kullanıcı işi içinde inceleyin. Uzun ürün adları veya farklı seçenek sayıları olan ürünler farklı sorunlar gösterebilir. Kontrol listesine sayfa türünü, cihazı, tarayıcıyı ve incelenen işi yazın. Tek bir ekran görüntüsünün doğru görünmesi, bütün alışveriş yolunun çalıştığını göstermez; özellikle açılır seçenekleri ve hata mesajlarını da deneyin.
Ürün varyantı seçerken müşterinin hangi ölçüyü veya rengi seçtiği açık olmalıdır. Dokunma alanları birbirine çok yakınsa yanlış seçenek işaretlenip işaretlenmediğini kontrol edin. Fiyatın veya stok metninin ekran dışında kalmasıyla düğmenin hiç çalışmaması farklı bulgulardır. Her sorunu görüldüğü adımla kaydedin. Düzeltmeyi yalnız yazıyı küçülterek yapmaya çalışmayın; küçük metin daha çok içeriği ekrana sığdırsa da okumayı zorlaştırabilir. Müşteri metni büyüttüğünde ürün bilgisi ve temel işlemler kullanılmaya devam etmelidir. Kontrolü gerçek ürün içeriğiyle yapın; kısa deneme başlıkları uzun gerçek başlıklardaki taşmaları gizleyebilir.
Duyarlı tasarım ve mobil öncelikli dizin farkı
Google’ın mobil belge açıklamasında duyarlı tasarım aynı adreste ve aynı HTML ile ekran boyutuna göre farklı görünüm sunar. Dinamik sunum ve ayrı mobil adresler de farklı yapılandırmalardır. Hangi yöntemin kullanıldığını teknik ekiple belirleyin; “mobil sayfa var” ifadesinin ne anlama geldiğini kaydedin. Bir yöntemin adı, bütün mağazanın kullanım kontrolünden geçtiğini kanıtlamaz. Menü açıldığında ürün listesine ulaşılabildiğini, klavye açıldığında form alanlarının ve hata metninin görünür kaldığını inceleyin. Aynı sayfanın yatay ve dikey kullanımında kritik bilgi kayboluyorsa bunu ayrı bulgu olarak yazın. Tasarım kararıyla gözlenen sonucu birbirine karıştırmayın.
Mobil öncelikli dizine ekleme, Google’ın dizin ve sıralama için akıllı telefon aracısının taradığı mobil içeriği kullanmasını anlatır. Bu, mobil kullanım başarısıyla aynı ölçüm değildir. Google belgesi önemli içeriğin mobil sürümde de bulunmasını ve ana içeriğin yüklenmesinin kullanıcı etkileşimine bağlanmamasını vurgular. Masaüstündeki ürün bilgilerini telefonda yer açmak için tamamen kaldırmayın. Yapısal veri ve başlık gibi kayıtların ilgili sürümlerde tutarlı olduğunu da kontrol edin. İç bağlantı mobil menüde kaybolduysa ürünlere erişim yolu değişmiş olabilir. SEO incelemesini müşterinin gerçekten kullanabildiği akışla birlikte yürütün.
Metin akışı ve dokunma ölçütleri nasıl okunur?
W3C WCAG 2.2 yeniden akış açıklaması, dikey kaydırılan içerik için 320 CSS piksel genişliğinde bilgi ve işlev kaybetmeden, iki yönde kaydırma gerektirmeden sunumu ele alır. Belgedeki örnekte 1.280 CSS piksel genişlikte %400 yakınlaştırma, 320 CSS piksel karşılığıdır. Anlamı veya kullanımı gereği iki boyutlu düzen isteyen içerik bölümleri için istisna bulunur; veri tabloları bunlara örnek olabilir. Bu yüzden ürün ölçü tablosunu sırf sayfaya sığsın diye bilgileri silerek küçültmeyin. Tabloyu ve çevresindeki açıklamayı kendi yapılarıyla inceleyin. CSS piksel ölçüsünü telefonun fiziksel ekran çözünürlüğüyle aynı saymayın.
W3C’nin hedef boyutu açıklaması, işaretçiyle kullanılan hedefler için 24 × 24 CSS piksel ölçütünü ve istisnalarını anlatır. Yeterli aralık, aynı işlevi sunan eşdeğer kontrol, satır içi hedef, tarayıcı kontrolü veya zorunlu sunum gibi istisnalar vardır. Bu sayıyı bütün bağlantılar için istisnasız tek tasarım kuralına çevirmeyin. Satıcı açısından önemli olan, ürün seçimi ve ilerleme kontrollerinin yanlışlıkla komşu düğmeyi etkinleştirmeden kullanılabilmesidir. Teknik ekip ölçü ve aralık koşullarını güncel ölçüte göre incelemelidir. Buradaki W3C ölçütleri Türkiye’de bütün mağazaların yasal uygunluk belgesi veya tüm sitenin erişilebilirlik onayı olarak sunulmamaktadır.
İşlev kontrolü örneği nasıl hesaplanır?
Kurguda ürün okuma, seçenek belirleme, sepet ve form kullanımından oluşan 12 kontrol işi tanımlansın. Aynı test koşulunda 9 iş tamamlanıyor, 3 iş engelleniyorsa tamamlanabilen iş payı 9 / 12 × 100 = %75, engellenen pay %25 olur. Bir engel düzeltilip aynı 12 iş yeniden denendiğinde 10 iş tamamlanıyorsa yeni pay yaklaşık %83,33, kalan engel payı %16,67’dir. Bu, kurgusal iş listesinin sonucudur; evrensel mobil uyumluluk puanı değildir. Her işe eşit ağırlık verilmiştir; küçük bir görüntü sorunu ile siparişi durduran engelin etkisi aynı kabul edilmemelidir.
Örnekteki %83,33’ü müşterilerin sipariş tamamlama oranı diye raporlamayın. Gerçek ziyaretçi veya satış ölçülmedi. Sayfa hızı da farklı kontrol alanıdır: sayfa okunabilirken yavaş, hızlıyken kullanılamaz olabilir. Teknik ölçümleri ve gözlenen iş engellerini ayrı kaydedin. Düzeltme sonrası yalnız değiştirilen düğmeyi değil, onun öncesindeki seçim ve sonrasındaki adımı da tekrar deneyin. Kullanılan cihaz ve tarayıcı kapsamını belirtin; tek denemeden bütün telefonlar için sorunsuzluk sonucu çıkarmayın. Canlı satış oluşturmadan uygun test ortamında akışı inceleyin ve hangi aşamaya kadar doğrulandığını açıkça yazın.
Örnek: 12 işlik mobil kullanım kontrolü
Kurguda aynı koşulda 12 kontrol işinin 9’u tamamlanır, 3’ü engellenir. Bir engel giderildikten sonra aynı iş listesi yeniden denenir.
- 9 / 12 × 100 = %75 ilk tamamlanabilen payı bulun.
- 3 / 12 × 100 = %25 engel payını hesaplayın.
- 10 / 12 × 100 ≈ %83,33 yeni tamamlanabilen payı bulun.
- 2 / 12 × 100 ≈ %16,67 kalan engel payını bulun.
Kontrol listesindeki tamamlanabilen iş payı yaklaşık %83,33 olur; 2 engel kalır. Ziyaretçi veya satış sonucu ölçülmez.
Mobil uyumluluk ile karıştırılan kavramlar
Ekrana uyum sağlamak için kullanılan tasarım yaklaşımıdır; gerçek işlerin çalıştığı ayrıca denenir.
Google’ın mobil içerikten dizin oluşturma yaklaşımıdır; kullanıcı görev başarısı ölçümü değildir.
Yüklenme ve etkileşim performansını ele alır; okunabilirlik ve kullanılabilirlik aynı kontrol değildir.
Satıcı ne yapmalı?
- Kategori, ürün, sepet ve form için kontrol işleri yazın.
- Gerçek ürün bilgilerini farklı ekranlarda okuyup seçenekleri deneyin.
- Metin büyütme, taşma ve dokunma hedeflerini istisnalarıyla inceleyin.
- Mobilde ana içerik, bağlantı ve işaretleme tutarlılığını kontrol edin.
- Engelleri işlem üzerindeki etkilerine göre önceliklendirin.
- Düzeltmeden sonra aynı iş listesini koşullarıyla yeniden deneyin.
İlgili rehberler
Mobil uyumluluk hakkında sık sorulanlar
Mobil uyumluluk nedir?
Telefon ekranında açılması yeterli mi?
320 CSS piksel neyi anlatır?
24 × 24 ölçütü bütün bağlantılara istisnasız mı?
Örnekte %83,33 satış oranı mı?
Öteki terimler
- 301 yönlendirme
- 404 hatası
- Anahtar kelime
- Backlink
- Breadcrumb
- Canonical etiketi
- Core Web Vitals
- E-E-A-T
- Filtreli gezinme (faceted navigation)
- Google Analytics 4
- Google Search Console
- Görsel alt metni
- hreflang
- İç bağlantı
- İndeksleme
- Kategori sayfası
- Kopya içerik
- Meta açıklama
- Noindex
- Organik trafik
- robots.txt
- Sayfa hızı
- SEO
- Site haritası