Web Sitenize Mobil Erişimi Algılayıp Mobil Versiyona Yönlendirme

Mayıs 21 11:15 2015 Yazar: A.Gökhan, M.Sc. Bu yazıyı yazdır

Son dönemde mobil cihazların kullanım oranının artması ile birlikte web site ve mobil geliştiricileri de bu bağlamda yeniliklere ayak uydurmak zorunda kaldılar. Bu da yazılım ve dijital sektörün kendine özgü iç dinamiğinin dışında ek bir hareket ve canlılık katarak yaşayan bir organizma olmasını sağlamaktadır. Özellikle teknoloji ve dünya devi Google tarafından arama motoru algoritmasının değiştirildiği ve mobil cihazlar için de arayüz desteği veren web sitelerinin üst sıralara çıkmasına yardımcı olunacağını açıklamasından sonra mobil dizayn ve programlama mevcut önemini daha da arttırmıştır.

Bu yazıyı okuyorsanız bir web geliştiricisi veya mobil uygulama yazılımcısı olduğunuzu düşünebiliriz. Bu noktada, geliştirdiğimiz web sitelerinin mobil cihaz erişimini algılayıp bunu mobil versiyon sub domain veya klasöre yönlendirme işlemini yapmakta vakit kaybetmeyelim.

Öncelikle yeni bir HTML sayfa oluşturalım. Hatta sadece uzantısı .html olsun. İçerisinde yalnızca merhaba dünya yazsın. Bu şu esnada pek önemli değil. Aynı sayfanın içerisine bir de JavaScript ekleyelim. Bütün işi yapacak olan JavaScript kodlarımız toplam 2-3 satır kadar.

<script>
//JavaScript Dokuman
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
	window.location ="http://m.phpservisi.com";
}
</script>

//JavaScript Dokuman

if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {

window.location ="http://m.phpservisi.com";

}

</script>

Yukarıdaki kodlar erişim sağlayan kişinin kabaca web sitesini çalıştırma isteği gönderdiği tarayıcıyı bir String veri türünde değer olarak döndürmektedir. Örneğin JavaScript kullanarak bir navigator.userAgent özelliği çalıştırıp dönen sonucu ekrana yazdıralım:

<script>
var tarayici = navigator.userAgent;
document.write(tarayici);
</script>

var tarayici = navigator.userAgent;

document.write(tarayici);

</script>

Yukarıdaki kodları Google Chrome internet tarayıcısında ve Windows 8 işletim sistemi üzerinden çalıştırdığımda aşağıdaki gibi bir çıktı aldım.

Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.152 Safari/537.36

1	Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.152 Safari/537.36

Biz de en yukarıda yazdığımız kodlarda işletim sistemi/tarayıcı araması içerisinde Android, webOS, Apple ürün ve türevleri ve BlackBerry olması durumunda m.phpservisi.com gibi bir mobil adrese yönlendirme yaparak, işlemimizi sonlandırmış oluyoruz. Böylelikle mobil cihazdan erişim sağlayan kullanıcıyı saptayıp, görevi tamamladık.

Sonraki yazılarda görüşmek dileğiyle.