การเขียนเว็บไซต์ Responsive พื้นฐาน ตามวิธีการ Mobile First

การเขียนเว็บไซต์  Responsive  พื้นฐาน ตามวิธีการ Mobile First Responsive Web Design เป็นอีกทางเลือกนึง ในการพัฒนาเว็บไซต์ที่กำลังได้รับความนิยมในขณะนี้ค่ะ โดยมีจุดประสงค์เพื่อ ทำให้ User ใช้งานได้ง่ายที่สุด โดย Responsive Web Design นั้น มีข้อดีคือจะใช้ source code ตัวเดียว ทำให้ประหยัดเวลาและค่าใช้จ่าย แต่จะสามารถปรับการแสดงผลได้สวยงาม รองรับหน้าจอ Smartphone, Tablet, และ Desktop ในเว็บไซต์เดียวได้อย่างไม่น่าเชื่อ

การเขียนเว็บไซต์ Responsive พื้นฐาน ตามวิธีการ Mobile First การออกแบบและเขียนโค้ดที่เริ่มต้นจากหน้าจอมือถือโดยการสร้างเว็บไซต์ใหม่ขึ้นมาเลย โดยดีไซน์ให้รองรับ Mobile ก่อน แล้วค่อยๆไล่หน้าจอที่ใหญ่่ขึ้นไป เน้นทำให้เว็บไซต์มีเฉพาะ Element ที่สำคัญจะได้โหลดไว ซึ่งทำให้การเรียกใช้งานโค้ดในมือถือน้อยลงจึงทำให้การเปิดเว็บไซต์ของเราในหน้าจอมือถือเร็วขึ้นนั่นเองค่ะ โดยเขียน CSS สำหรับ Mobile โดยไม่ต้องใช้ Media Query เลย จากนั้นค่อยพัฒนาให้เหมาะกับ Desktop Site โดยเติม CSS สำหรับ Desktop เข้าไป (ใช้ Media Query ช่วย)

ซึ่งวิธี Mobile-First Responsive Website นี้ต่อให้มือถือไม่รองรับ Media Query ก็จะเห็นเว็บแบบ Mobile อยู่แล้ว ส่วนถ้าผู้ใช้เปิดในคอมก็จะโหลด Component เพิ่มเติมสำหรับหน้าจอคอมเท่านั้น ซึ่งคนเปิดในมือถือก็จะได้เว็บที่เบา โหลดเร็ว ส่วนคนเปิดในคอมจะได้เว็บที่หนักขึ้น แต่ก็ถือว่ารับได้เพราะในคอมอินเตอร์เน็ตเร็วกว่านั่นเองคะ ส่วนการเขียนเว็บแบบ Mobile-First Responsive Website นี้จะมีข้อดี ข้อเสียอย่างไรบ้าง มาดูกันเลยคะ

ข้อดีของ Mobile-First Responsive Website

1. การทำเว็บไซต์แบบเริ่มใหม่ทั้งหมด ต่างกับที่ต้องทำเพิ่มเติมจากเว็บเดิม คือทำให้ Designer / Developer ทำงานได้ง่ายขึ้น ไม่ต้องมาคอยระวังทีว่าโค้ดเดิมจะพังมั้ย
2. รองรับ Mobile ได้ทันที โดยที่ Device นั้นไม่ต้องรองรับ Media Query ก็ได้
3. ปรับแต่งให้เปิดเว็บไซต์บนมือถือได้เร็ว โหลดไวขึ้น
4. ปรับแต่งให้รองรับหน้าจอหลายขนาดได้ง่าย เพราะเราทำจากเล็กไปใหญ่ เราจะเห็นหมดว่าพอขยายหน้าจอถึงไหนแล้วหน้าตาจะเป็นยังไง
5. เหมาะกับการพัฒนาเป็น Desktop Site ต่อไปในอนาคต

ข้อเสียของ Mobile-First Responsive Website

1. ใช้เวลาเยอะกว่าเว็บจะสามารถปล่อยให้ User เข้ามาใช้ได้ เพราะต้องสร้างขึ้นมาใหม่หมด กว่าจะเทส กว่าจะดีไซน์เสร็จ
2. การทำแบบ Mobile First ต้องปรับแนวคิดการทำเว็บไซต์แบบเก่าในสมองออกไป ซึ่งเราต้องให้ความรู้กับทีมงานเยอะ ๆ ถึงจะทำได้
3. การต้องดีไซน์เว็บใหม่อาจมีปัญหากับ Branding ขององค์กร บางครั้งผู้บริหารอยากได้โลโก้ใหญ่ หรืออยากได้สีนั้นสีนี้ ก็จะทำให้การทำเว็บไซต์ใหม่ล่าช้าขึ้นไปอีก
4. Interface ใหม่อาจทำให้ User สับสนในช่วงแรก เพราะฉะนั้นต้องใส่ใจให้คำตอบ User และรับ Feedback ตลอดเวลา

การทำเว็บไซต์แบบ Responsive พื้นฐาน ตามวิธีการ Mobile First นี้จะเห็นได้ว่า มีทั้งข้อดีและข้อเสีย ซึ่งก็ขึ้นอยู่กับปัจจัยหลายอย่าง เช่น เวลา งบประมาณ รูปแบบองค์กร ความสามารถของสมาชิกในทีม และผลลัพธ์ที่เราต้องการจากการทำเว็บไซต์แบบ Responsive นั่นเองคะ