Bir sitenin mobilde açılması ile mobilde kullanılabilir olması farklı şeylerdir. Çoğu site teknik olarak duyarlıdır; ancak buton küçüktür, form alanı yanlış klavye açar, sayfa yana kayar. Bunların her biri ölçülebilir dönüşüm kaybı üretir.
Yatay kaydırma neden oluşur?
Mobilde sayfanın sağa sola kayması, en sık rastlanan ve en çok gözden kaçan sorundur. Sebepleri genelde şunlardır:
- Sabit genişlik verilmiş ögeler (piksel cinsinden tanımlanmış tablolar, görseller)
- Izgara veya esnek kutu içinde daralamayan içerik
- Uzun ve bölünemeyen metinler (uzun adresler, kesintisiz kelimeler)
- Ekran dışına taşan dekoratif ögeler
- Yatay kaydırmalı bileşenlerin ana akışı zorlaması
Izgara yerleşimlerinde sütunların daralabilmesi için ilgili ögelere daralma izni verilmesi gerekir. Bu tanım olmadan içerik, kutusunu genişletir ve sayfa yana kayar.
Dokunma hedefleri ne kadar olmalı?
Parmakla basılacak ögelerin en az 44×44 piksel olması önerilir. Bunun altındaki butonlar, yanlış tıklamaya ve tekrar denemeye yol açar. Yan yana duran bağlantılar arasında yeterli boşluk bırakılmalıdır; menü ve alt bilgi bağlantılarında bu sorun sık görülür.
Telefon numarası, WhatsApp ve form gönder butonu gibi kritik ögelerin bu ölçütü karşılaması özellikle önemlidir.
Form alanlarında hangi hatalar yapılır?
- Telefon alanında sayısal klavye açılmaması
- E-posta alanında otomatik büyük harf açık kalması
- Otomatik doldurma etiketlerinin tanımlanmaması
- Alan yüksekliğinin küçük olması
- Hata mesajlarının form gönderildikten sonra en üstte gösterilmesi
- Klavye açıldığında gönder butonunun görünmez olması
Bunların her biri, formu doldurmaya başlamış bir kullanıcının vazgeçmesine yol açabilir. Mobilde form terk oranı masaüstünün belirgin biçimde üzerindedir; bu farkın önemli bir bölümü teknik ayrıntılardan kaynaklanır.
Metin ve okunabilirlik
Mobilde 16 piksel altındaki gövde metni okuma zorluğu yaratır ve bazı tarayıcılarda otomatik yakınlaştırmayı tetikler. Satır uzunluğu da önemlidir; ekran dar olduğu için satır başına düşen karakter sayısı zaten sınırlıdır, ancak yan boşlukların yeterli olması gerekir.
Açık zemin üzerine açık gri metin, mobilde dış mekân aydınlığında okunamaz hâle gelir. Kontrast oranını yalnızca ekranda değil, gerçek kullanım koşullarında değerlendirmek gerekir.
Yapışkan ögeler ne zaman sorun olur?
Yapışkan başlık, çerez bildirimi ve canlı destek düğmesi ayrı ayrı makul görünür; ancak hepsi birlikte küçük bir ekranda kullanılabilir alanın yarısını kaplayabilir.
Mobilde yapışkan öge sayısını sınırlamak, çerez bildirimini kompakt tasarlamak ve destek düğmesini içerikle çakışmayacak konuma almak gerekir. Yapışkan bir ögenin sayfa içi bağlantılarda başlığı örtmesi de sık görülen bir kusurdur.
Test nasıl yapılmalı?
Tarayıcının geliştirici araçlarındaki cihaz simülasyonu iyi bir başlangıçtır ancak yeterli değildir. Gerçek cihazda test etmek, dokunma hedeflerini ve klavye davranışını görmenin tek yoludur.
Test edilecek asgari senaryolar: ana sayfadan bir hizmet sayfasına gitmek, telefon numarasına basmak, formu doldurup göndermek, menüyü açıp kapatmak ve sayfayı yana sürüklemeyi denemek. Bu beş adım, sorunların büyük bölümünü ortaya çıkarır.
Menü tasarımı mobilde nasıl olmalı?
Mobil menü, sitenin en çok kullanılan bileşenlerinden biridir. Sık yapılan hatalar:
- Menü açıldığında arka planın kaymaya devam etmesi
- Kapatma düğmesinin küçük veya belirsiz olması
- Çok seviyeli menülerde geri dönüş yolunun bulunmaması
- Menünün ekranın tamamını kaplayıp içeriğe dönüşü zorlaştırması
- Menü içinde iletişim bilgisinin bulunmaması
Mobil menüde telefon numarasına ve teklif düğmesine yer vermek, hizmet işletmelerinde dönüşümü doğrudan etkiler. Kullanıcı menüyü genelde bir eylem yapmak için açar.
Görseller mobilde nasıl davranmalı?
Masaüstü için hazırlanmış yatay görseller mobilde ya çok küçülür ya da kırpılır. Önemli görsellerde farklı ekran boyutları için ayrı kırpımlar tanımlamak, hem görselin anlamını korur hem gereksiz veri indirilmesini önler.
Ayrıca mobilde indirilen dosya boyutu masaüstünden küçük olmalıdır. Aynı büyük dosyayı her cihaza göndermek, mobil kullanıcının veri ve süre kaybetmesine yol açar.
Yapışkan çağrı çubuğu işe yarar mı?
Hizmet işletmelerinde, ekranın altında sabit duran "Ara" ve "WhatsApp" çubuğu ölçülebilir katkı sağlayabilir. Ancak çubuğun içeriği örtmemesi, sayfanın alt kısmında yeterli boşluk bırakılması ve form doldurulurken devreye girmemesi gerekir.
Aynı anda çerez bildirimi, canlı destek düğmesi ve çağrı çubuğu bulunduğunda ekranın alt yarısı kullanılamaz hâle gelir. Bu ögelerin birlikte nasıl göründüğü gerçek cihazda test edilmelidir.
Mobilde form doldurma deneyimi
Formu masaüstünde tasarlayıp mobilde denemeden yayına almak yaygın bir hatadır. Mobilde klavye açıldığında ekranın yarısı kapanır; o sırada hangi alanın göründüğü belirleyici olur.
Uygulanması gereken temel kurallar: alanlar tek sütun hâlinde dizilmeli, etiketler alanın üstünde yer almalı, hata mesajları ilgili alanın hemen altında görünmeli ve gönder düğmesi klavye açıkken erişilebilir kalmalı. Uzun formlarda ilerleme göstergesi, terk oranını düşürür.
Sık sorulan sorular
Sitem duyarlı, yine de mobil sorunu olur mu?
Olur. Duyarlı tasarım ekrana uyum sağlar ama kullanılabilirliği garanti etmez. Buton boyutu, klavye tipi ve yapışkan öge yoğunluğu ayrı konulardır.
Ayrı mobil site yapmalı mıyım?
Genelde gerekmez ve önerilmez. Ayrı mobil site iki ayrı içerik yönetimi, iki ayrı SEO çalışması demektir. Tek duyarlı site bakımı kolay ve arama motorları açısından daha sağlıklıdır.
Google mobil uyumu nasıl değerlendiriyor?
Arama motorları siteleri ağırlıklı olarak mobil sürüm üzerinden değerlendirir. Yani mobilde eksik olan içerik, masaüstünde var olsa bile değerlendirmeye tam girmeyebilir.
Nereden başlamalı?
Telefonunuzu alın ve sitenizde bir müşteri gibi gezinin: hizmet sayfasına gidin, numaraya basın, formu doldurun. Takıldığınız her nokta, gerçek ziyaretçinin de takıldığı noktadır. Bu beş dakikalık test, çoğu analiz aracından daha net sonuç verir.
Mevcut sitenizi inceleyip hız, mobil uyum, teknik SEO ve dönüşüm açısından ne durumda olduğunu ücretsiz olarak raporluyoruz. Rapor için bizimle çalışmaya başlamanız gerekmiyor.
Bunu kendi hesabınızda uygulayalım mı?
Ücretsiz analizde hesabınıza bakıp yazıdaki adımların sizde nasıl karşılık bulduğunu gösteriyoruz.