วิธีตรวจสอบการเข้าเว็บไซต์ผ่านโทรศัพท์มือถือ

วิธีตรวจสอบการเข้าเว็บไซต์ผ่านโทรศัพท์มือถือ

วันนี้เป็นวันที่ไม่ค่อยมีความสุขเท่าไหร่ เพราะอะไรไม่ต้องรู้หรอกค่ะ ^^ เรามาคุยกันถึงสิ่งดีๆ ดีกว่า หลังจากไม่เรื่องที่ทำให้ไม่สบายใจ เราก็ไม่รู้จะทำอะไรดี แต่ด้วยสัญชาติญาณของโปรแกรมเมอร์ (ก็ว่าไปงั้น) เลยหาไอเดียร์ทำเว็บแก้เครียดดีกว่า [รุสึกเหมือนจะเครียมากกว่าเดิม 555] บอกได้เลยว่าเป็นครั้งแรกที่ได้แตะ HTML5 หลังจากมันมีมานานพอสมควร อย่าถามว่าที่ผ่านมาทำไมไม่คิดจะทำหละ ตอบได้คำเดียวว่า ขี้เกียจ :P เข้าเรื่องได้ละจ๊ะ ^^

ปล. ตอนนี้หลายๆ คนก็คงจะรู้จัก HTML5  กับ CSS3 มาพอสมควร ในบทความนี้จะไม่พูถึงโครงสร้างใดๆ ทั้งนั้นเพราะมันมีเยอะแล้ว แต่เราจะเล่าสิ่งที่เรากำลังทำหรือพบเจอให้สำหรับคนที่เริ่มต้นเหมือนกับเราได้เข้ามาอ่านนะจ๊ะดาลี่

เคยมีความสงสัยบางมั้ยว่าทำไมเวลาเข้าเว็บบางเว็บโดยเข้าผ่าน Browers จากคอมพิวเตอร์หรือน็ตบุค การแสดงผลมันช่างต่างกับ การแสดงผลในจอโทรศัพท์??   เด็กสมองช้างอย่าเรายังเคยคิดเลยว่าคนเขียนโค้ดนี่เก่งจริงๆ เขียนให้เว็บรู้ได้ด้วยว่าเข้าเว็บจากมือถือหรือจากคอมพิวเตอร์ โดยทำให้ทุกอย่างมันเด้งไปอยู่ ณ ตำแหน่งที่ต้องการให้แสดง จัดเรียงตัวตามขนาดหน้าจอโทรศัพเข้าเราได้  (แม่งเจ๋งหวะ!!) แต่หารู้ไม่เลยว่ามันไม่ได้เจ๋งขนาดนั้น ทุกสิ่งมีคำตอบในตัวของมันเอง

การจะทำแบบนั้นได้ไม่ยากเลย จากความคิดของเราถูกแค่ครึ่งเดียว คือ เค้าทำให้รู้ได้ว่าเข้าเว็บจากมือถือ หรือ คอมพิวเตอร์ แต่มันจะฉลาดได้ขนาดนั้นก็ต่อเมื่อมันมี Script ที่ช่วยเช็ค ซึ่ง Script นี้ มีทั้งที่เป็นโค้ด php และ JavaScript จะใช้อันไหนก็ได้แล้วแต่ความชอบ

มาทำความเข้าใจกับการทำงานก่อนที่จะไปดูโค้ด ขั้นตอนการทำงานมีไม่มาก คือ

1. เช็คดูว่าเข้าเว็บ Browers จากอุปกรณ์อะไร

2. ถ้าข้าผ่านโทรศัพท์มือถือ ให้ redirect ไปยังหน้า http://m.yourdomain.com หรือหน้าอื่นที่ต้องการ

3. ถ้าเข้าผ่านคอมพอวเตอร์ ให้ไปที่  http://www.yourdomain.com

ส่วนตัวอย่างโค้ดจะมีให้แต่ JavaScript  เพราะมันสั้นมาก ถึงมากที่สุดดด ><

<script type="text/javascript">

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

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

}

</script>

แต่ถ้าหากใครต้องการโค้ดที่เป็น PHP สามารถดูได้ที่ 

สร้างฟังก์ชัน ตรวจสอบ การเข้าเว็บไซต์ ผ่านมือถือ ด้วย php

เมื่อทราบแล้วหลายคนก็คงคิดเบาๆ ว่า นี้เราต้องทำ subdomain “http://m.yourdomain.com” ขึ้นมาแล้วเขียนหน้าเว็บ index.html สำหรับแสดงบนโทรศัพทร์มือถืออีกหรอเนี่ย ตอบเบาๆให้นะคะว่า ถั่วต้มคะ ^^ แต่อาจจะเขียนแค่เมนูแสดงหน้าแรกแต่ส่วนเนื้อหาก็สามารถดึงจากฐานข้อมูลได้เลย ไม่ต้องลงข้อมูลใหม่นะคะ แลดูจะสิ้นเปลือง

สรุปคือ ไม่ว่าจะแสดงผลทางโทรศัพท์มือถือ หรือ คอมพิวเตอร์เนื้อหาที่แสดงเป็นเนื้อหาเดียวกัน ต่างกันแค่รูปแบบหน้าจอแสดงผลเท่านั้นเอง