Bir işletmenin adını duyan kişi çoğu zaman ilk aramayı telefonundan yapar. Açılan sitede yazılar küçücükse, düğmelere basmak zor oluyorsa ya da sayfayı sağa sola kaydırmak gerekiyorsa, o kişi birkaç saniye içinde geri dönüp başka bir sonuca geçebilir. Mobil uyumlu tasarım tam olarak bu kaybı önlemek için yapılır.
Mobil uyumlu tasarım ne demek?
Mobil uyumlu bir site, telefon, tablet ve bilgisayarda aynı içeriği o ekrana uygun biçimde gösterir. Ziyaretçi yakınlaştırma yapmadan yazıyı okur, parmağıyla düğmeye rahatça basar ve aradığı bilgiye fazla kaydırmadan ulaşır.
Bu işin en yaygın yöntemine duyarlı tasarım (responsive tasarım) denir. Sitenin tek bir sürümü vardır ve yerleşim ekran genişliğine göre kendini düzenler. Örneğin bilgisayarda yan yana duran üç kart, telefonda alt alta dizilir veya yana kaydırılan bir şeride dönüşür. Eskiden sık görülen ayrı mobil site (m.siteadi.com gibi) yönteminde ise iki sürümü birlikte yönetmek gerekirdi. Bugün yeni bir site için çoğunlukla duyarlı tasarım tercih edilir, çünkü içeriği tek yerden güncellemek yeter.
Neden bu kadar önemli?
- Müşteri kaybını azaltır: Telefonda zor kullanılan bir sitede form doldurmak ya da sipariş vermek can sıkar. Ziyaretçi, işi bitirmeden çıkabilir.
- Arama sonuçlarını etkiler: Google, siteleri değerlendirirken ağırlıklı olarak mobil sürümü esas alır. Telefondaki içeriğiniz eksikse, arama görünürlüğünüz de bundan etkilenebilir.
- Güven verir: Düzgün açılan, derli toplu bir site işletmenin işine özen gösterdiği izlenimini verir. Bozuk görünen bir sayfa ise tam tersi bir his bırakır.
- Reklam bütçesini korur: Sosyal medya ve arama reklamlarından gelen kişilerin büyük bölümü telefonla geliyorsa, kötü bir mobil sayfa ödediğiniz tıklamaları boşa harcatır.
Sitenizi beş dakikada test edin
Bunun için teknik bilgi gerekmez. Aşağıdaki adımları kendi telefonunuzla, mümkünse bir de farklı marka bir telefonla deneyin.
- Sitenizi tarayıcıda açın ve yakınlaştırma yapmadan bir paragraf okuyun. Gözünüzü zorluyorsa yazı küçüktür.
- Sayfayı parmağınızla sağa sola itin. Yana doğru kayıyorsa bir öğe ekrana sığmıyordur.
- Menüyü açın, her bağlantıya basın. Yanlış yere basmak kolaysa düğmeler küçük ya da birbirine yakındır.
- Telefon numaranıza dokunun. Arama ekranı açılmıyorsa ziyaretçiye gereksiz bir iş çıkarıyorsunuz demektir.
- Varsa iletişim formunu doldurun. Klavye alanları kapatıyor mu, gönderince sonuç net görünüyor mu, kontrol edin.
- Sitenizi mobil veriyle açın. Kablosuz ağda hızlı olan sayfa, zayıf çekimde uzun süre bekletebilir.
Daha ayrıntılı bir ölçüm isterseniz Google'ın ücretsiz PageSpeed Insights aracına sitenizin adresini yazın. Araç mobil performansı ayrıca puanlar ve neleri düzeltebileceğinizi listeler. Puana takılıp kalmayın; asıl önemli olan gerçek bir ziyaretçinin siteyi rahat kullanabilmesidir.
Sık görülen sorunlar ve çözümleri
Fazla büyük görseller
Fotoğraf makinesinden çıktığı gibi yüklenen görseller sayfayı yavaşlatır. Görselleri gösterileceği boyuta indirin, WebP gibi güncel bir biçimde sıkıştırın ve telefona küçük sürümün gitmesini sağlayın.
Küçük yazı ve dar satır aralığı
Telefonda gövde yazısı için genellikle 16 piksel civarı rahat bir başlangıçtır. Satır aralığını da biraz açık tutun. Uzun paragrafları bölmek, küçük ekranda okumayı belirgin biçimde kolaylaştırır.
Basması zor düğmeler
Düğmeler parmak ucuyla rahat basılacak büyüklükte olmalı ve aralarında boşluk bırakılmalıdır. En önemli işlemi (ara, sipariş ver, teklif al) ekranın kolay ulaşılan alt kısmında sürekli görünür yapmak da işe yarar.
Ekranı kapatan açılır pencereler
Sayfa açılır açılmaz çıkan kampanya pencereleri telefonda tüm ekranı kaplayabilir. Kapatma işareti de küçükse ziyaretçi siteden çıkıp gider. Bu pencereleri azaltın, kullanacaksanız kolay kapanır hale getirin.
Yalnız bilgisayarda çalışan öğeler
Fareyi üzerine getirince açılan menüler ya da görünen yazılar dokunmatik ekranda çalışmayabilir. Önemli bir bilgiyi bu tür etkileşimlerin arkasına saklamayın.
Nasıl başlamalı?
Yeni bir site yaptıracaksanız ya da mevcut sitenizi iyileştirecekseniz şu sırayı izleyebilirsiniz:
- Veriye bakın: Google Analytics gibi bir aracınız varsa, ziyaretçilerin hangi cihazlardan geldiğini ve en çok hangi sayfalara girdiğini öğrenin.
- Önceliği belirleyin: Ziyaretçinin telefonda yapmasını istediğiniz tek bir ana işlem seçin: aramak, WhatsApp'tan yazmak, sipariş vermek ya da konum bakmak.
- Önce telefonu tasarlayın: İçeriği küçük ekrana göre sıralamak, neyin gerçekten gerekli olduğunu görmenizi sağlar. Bilgisayar sürümü sonra bu yapının üzerine genişletilir.
- Metni kısaltın: Bilgisayarda kısa görünen bir paragraf telefonda ekranı doldurabilir. Başlıklar ve kısa listelerle içeriği taranabilir hale getirin.
- Gerçek cihazda deneyin: Tarayıcıdaki önizleme iyi bir başlangıçtır, ama son kontrolü gerçek telefonlarda yapın.
Yayına almadan önce kontrol listesi
- Hiçbir sayfada yatay kaydırma yok.
- Yazılar yakınlaştırmadan okunuyor.
- Telefon numarası ve WhatsApp bağlantısı tek dokunuşla çalışıyor.
- Formlar kısa ve telefonda rahat dolduruluyor.
- Görseller sıkıştırılmış, sayfa zayıf bağlantıda da makul sürede açılıyor.
- Menü, tek elle kullanılabiliyor.
- Bilgisayardaki önemli içerik telefonda da yer alıyor.
Bu listedeki maddelerin çoğunu kendiniz kontrol edebilirsiniz. Düzeltilecek çok şey çıkarsa ya da sıfırdan telefona uygun bir site gerekiyorsa, alpinnext.tr adresinden veya WhatsApp 0510 220 33 51 numarasından AlpinNext'e ulaşabilirsiniz.