Mobil uyumlu web sitesi nedir? Rehber

Müşterilerinizin büyük bölümü web sitenize bilgisayardan değil telefondan giriyor. Bir restoran aramak, bir kuaförün adresini öğrenmek ya da bir servisin telefon numarasına ulaşmak için insanlar genellikle cep telefonunu kullanır. Bu nedenle sitenizin telefon ekranında nasıl göründüğü, masaüstünde nasıl göründüğü kadar önemlidir.

Bu yazıda mobil uyumlu web sitesinin ne olduğunu, neyi kapsadığını ve bir sitenin mobilde iyi çalışıp çalışmadığını nasıl kontrol edeceğinizi anlatıyoruz.

Mobil uyumlu site ne demek?

Mobil uyumlu (responsive) bir site, ekran genişliğine göre kendini yeniden düzenler. Masaüstünde üç sütun görünen bir bölüm, telefonda tek sütun olarak dizilir. Menü, butonlar ve metinler ekran boyutuna uyarlanır.

Mobil uyumlu olmayan bir sitede ise kullanıcı şu sorunlarla karşılaşır:

Yazılar çok küçük olduğu için yakınlaştırmak zorunda kalır.
Yanlara kaydırmak gerekir ve sayfa ekrana sığmaz.
Butonlar birbirine çok yakın olduğu için yanlış dokunur.
Menü açılmaz ya da ekranın dışına taşar.

Neden önemli?

Mobil uyum, üç nedenle kritiktir:

Kullanıcı deneyimi. Zor kullanılan bir site, ziyaretçinin hemen çıkmasına neden olur.
Dönüşüm. Telefonla arayan ya da WhatsApp'tan yazan müşteri, sitenizde tek dokunuşla ulaşabilmelidir.
Arama motoru. Google, sitelerin önce mobil sürümünü değerlendirir. Yani mobilde zayıf bir site, masaüstünde mükemmel görünse bile arama sonuçlarında geride kalabilir.

Mobil uyumlu sitede olması gerekenler

Bir sitenin mobilde iyi çalıştığını anlamak için şu kontrol listesini kullanabilirsiniz:

Okunabilir yazı boyutu. Metin, yakınlaştırmadan rahatça okunabilmeli. Gövde metni için genellikle makul bir büyüklük yeterlidir.
Dokunma alanları yeterince büyük. Butonlar ve bağlantılar, parmakla rahat basılabilecek kadar geniş olmalı ve birbirine çok yakın durmamalı.
Yatay kaydırma yok. Sayfa genişliği ekranı aşmamalı. Bu, mobil uyumlu tasarımın en temel kontrolüdür.
Telefon numarası tek dokunuşla aranabilir. Numaranız, tıklanınca telefon uygulamasını açan bir bağlantı olmalı.
WhatsApp butonu kolay görünür. Sağ alt köşede sabit bir buton, birçok müşterinin hızlıca yazmasını sağlar.
Form kısa ve net. Mobilde her ek alan, doldurmayı zorlaştırır. Ad, telefon ve kısa bir mesaj çoğu zaman yeterlidir.
Menü sade. Mobil menü, en önemli sayfalara kısa yoldan ulaşmalıdır.
Görseller ekrana uyar. Büyük görseller, sayfayı gereksiz yere uzatmamalı.

Sık yapılan hatalar

Masaüstü tasarımını küçültmek. Büyük bir tasarımı telefonda sadece küçültmek, okunamayan ve kullanılamayan bir sayfa üretir. Mobil düzen ayrıca düşünülmelidir.
Açılır pencereler (pop-up). Sayfa açılır açılmaz ekranı kaplayan bir pencere, mobilde özellikle rahatsız edicidir ve kapatması zor olabilir.
Aşırı büyük başlıklar. Ekranın yarısını kaplayan başlıklar, asıl içeriği aşağıya iter.
Sabit öğelerin üst üste binmesi. Sabit bir buton, önemli bir metnin veya formun üzerini kapatabilir.

Form ve dokunma alanlarında dikkat edilecekler

Telefonda form doldurmak masaüstüne göre daha zordur. Klavye ekranın yarısını kaplayabilir ve küçük alanlara basmak kolay değildir. Bu nedenle:

Her alanın üstünde açık bir etiket bulunsun. Yalnızca silik bir ipucu metni yeterli değildir.
Doğru klavye türü açılsın: telefon alanında sayısal tuş takımı, e-posta alanında @ işaretli klavye gibi.
Gönder butonu formun altında, ekranda rahat erişilebilir bir yerde olsun.
Hata mesajı hangi alanda sorun olduğunu söylesin. Yalnızca "hata oluştu" yazısı kullanıcıyı çaresiz bırakır.
Gönderimden sonra açık bir onay mesajı görünsün ve müşteri ne olacağını bilsin.

Bu küçük ayrıntılar, müşterinin formu tamamlayıp tamamlamamasında belirleyici olabilir.

Kendi telefonunuzda nasıl test edersiniz?

En iyi test, gerçek bir telefondan yapılan kontroldür. Şu adımları izleyin:

Sitenizi kendi telefonunuzda açın ve ana sayfadan başlayarak her menüyü dolaşın.
Telefon numarasına ve WhatsApp butonuna dokunup çalıştığını doğrulayın.
İletişim formunu gerçekten doldurup gönderin ve bildirimin size ulaştığını kontrol edin.
Yatay ve dikey konumda sayfanın nasıl göründüğüne bakın.
Bir arkadaşınızdan da farklı bir telefonla aynı adımları denemesini isteyin.

Tarayıcılarda geliştirici araçlarıyla farklı ekran boyutlarını simüle etmek de yardımcı olur, ancak gerçek cihaz testinin yerini tutmaz.

Hanbisan olarak yaklaşımımız

Hanbisan'ın tanıtım sitesi paketlerinde mobil uyum baştan tasarlanır. Her sayfa önce telefon ekranında düşünülür, sonra masaüstüne uyarlanır. Telefon araması, WhatsApp butonu, harita ve iletişim formu, mobilde test edilerek teslim edilir.

Tanıtım sitesi paketlerimiz 24.900 TL'den başlar (KDV hariç; KDV dahil 29.880 TL), teslim genelde 7-10 iş günüdür.

Sonuç

Mobil uyumlu bir site, müşterinin ilk dokunuşta size ulaşabilmesi demektir. Yazı boyutu, dokunma alanları, telefon bağlantısı ve sade bir menü, bu kalitenin temelini oluşturur. Sitenizi bu hafta kendi telefonunuzda açıp on dakika kontrol etmek, en hızlı başlangıçtır.

Fiyat almak için 7/24 0850 255 0180'i arayabilirsiniz.

Sık sorulan sorular

Mobil uyumlu olup olmadığımı nasıl anlarım?

Sitenizi telefonunuzda açın, yatay kaydırma olup olmadığına, yazıların rahat okunup okunmadığına ve butonlara kolayca dokunulup dokunulmadığına bakın. Bu üç nokta sorunsuzsa büyük ihtimalle mobil uyumlusunuz.

Ayrı bir mobil site yapmam gerekir mi?

Genellikle hayır. Tek bir sitenin ekrana uyum sağlaması, ayrı bir mobil site açmaktan daha sürdürülebilirdir.

WhatsApp butonu mobilde ne işe yarar?

Müşteri, form doldurmak yerine tek dokunuşla size yazabilir. Özellikle hizmet ve randevu işlerinde bu, ilk temasın en hızlı yoludur.

Mobil uyum sonradan eklenebilir mi?

Mevcut bir site çoğu zaman düzenlenebilir. Ancak eski ve sabit genişlikli tasarımlar için yeniden yapılandırma daha verimli olabilir.