Yardım Merkezi
Takıldığınız her noktada yanınızdayız. Yardım merkezimizde en sık sorulan soruların cevaplarını bulabilir, adım adım rehberlerle sorunlarınızı kolayca çözebilirsiniz.
Google, mobil uyumlu olmayan siteleri arama sonuçlarında geri plana atar. Ziyaretçilerin %60'tan fazlası siteye telefondan giriyorsa ve düzgün görüntüleyemiyorsa, hem trafik hem dönüşüm kaybediyorsunuz. Bu rehber, sitenizi adım adım mobil uyumlu hale getirir.
Ön Koşullar
1. Viewport Meta Etiketini Ekleyin
Viewport etiketi olmayan bir site, mobil cihazda masaüstü genişliğinde render edilir — içerik küçülür, okunmaz hale gelir. HTML dosyanızın <head> bölümüne şu satırı ekleyin:
2. Sabit Genişlik Değerlerinden Kurtulun
CSS'de piksel cinsinden sabit genişlik tanımları (width: 960px gibi) mobilde yatay kaydırmaya yol açar. Bu değerleri yüzde tabanlı veya max-width ile değiştirin:
3. Esnek Grid Yapısı Kurun
Yan yana dizilmiş sütunlar mobilde alt alta gelmeli. Bunun için CSS Flexbox veya Grid kullanın:
4. Görselleri Esnek Yapın
Sabit boyutlu görseller mobilde taşar. Tüm görsel ve medya öğelerine şu temel CSS kuralını uygulayın:
5. Yazı Boyutlarını Mobil İçin Ayarlayın
Masaüstünde okunabilir yazı, mobilde çok küçük kalabilir. Media query ile ekran boyutuna göre yazı boyutu tanımlayın:
6. Dokunma Hedeflerini Büyütün
Küçük butonlar ve linkler, parmakla tıklamayı zorlaştırır. Google'ın önerisi: tüm tıklanabilir öğeler en az 48x48px olmalı ve aralarında yeterli boşluk bulunmalı.
7. Mobil Navigasyon Yapısını Düzenleyin
Masaüstündeki yatay menü mobilde genellikle çalışmaz. Hamburger menü veya akordiyon yapı kullanmanız gerekir. WordPress kullanıyorsanız kullandığınız tema büyük ihtimalle bunu zaten destekliyordur — tema ayarlarından mobil menü seçeneğini kontrol edin. Özel kodlu bir site için JavaScript toggle menü kurabilirsiniz:
Sonucu Test Edin
Değişikliklerinizi uyguladıktan sonra şu araçlarla doğrulayın:
Sık Sorulan Sorular
Tema değiştirmeden mobil uyumluluk sağlanabilir mi? Evet. Viewport etiketi, esnek görseller ve birkaç media query çoğu zaman yeterlidir. Ancak temada yapısal sorunlar varsa (tablolarla yapılmış düzen gibi) tema değişikliği kaçınılmaz olabilir.
Sitenin tasarımını sıfırdan yaptırmak mı, yoksa mevcut siteyi uyarlamak mı daha doğru? Eğer mevcut tasarım 5 yıldan eskiyse ya da tablolarla kodlanmışsa sıfırdan responsive tasarım daha sürdürülebilir bir çözümdür. Webimonline tasarım hizmetleri sayfasında kurumsal mobil uyumlu tasarım seçeneklerini inceleyebilirsiniz.
Mobil uyumluluk SEO'yu etkiler mi? Doğrudan etkiler. Google, 2019'dan bu yana Mobile-First Indexing kullanıyor: sitenizi önce mobil versiyonundan tarıyor. Mobil uyumsuz siteler sıralamada kayıpla karşılaşır.