Responsive Web Design
Mobile Site
เว็บไซต์เดียว
แต่แสดงผลแปรผันไปตามขนาดของอุปกรณ์
สร้างเว็บไซต์ย่อยหลายเว็บไซต์
เพื่อให้รองรับการแสดงผลในหน้าจอแต่ละขนาดที่แตกต่างกัน
แน่นอน
ถ้าไม่เขียนสคริปผิดนะ
แน่นอน
เพราะออกแบบมาสำหรับ Mobile devices แล้วนิ
ด้วยเว็บไซต์หลักเพียงเว็บเดียว
ก็สามารถแสดงผลที่แตกต่างกันบน Desktop แท็ปเล็ต และมือถือ
รองรับการแสดงผล
ได้ทั้งบน Desktop แท็ปเล็ต และมือถือด้วยเช่นกัน
Responsive Web Design นั้นผ่าน Google mobile friendly test ได้อยู่แล้ว
เพราะเว็บไซต์สามารถปรับเปลี่ยนการแสดงผลไปตามขนาดของหน้าจอ แต่อาจมีข้อด้อยอยู่นิดคือ UX หรือการแสดงผล อาจไม่ได้สวยงามหมดจดเท่ากับการออกแบบมาเพื่อ Mobile โดยเฉพาะ จึงทำให้ Google จะจัดอันดับเว็บเหล่านี้ไว้ต่ำกว่า เว็บที่มี Mobile site เล็กน้อย
สามารถผ่าน Google mobile friendly test ได้อย่างสบายๆ
เพราะ Google bot จะถูก redirect ไปยังหน้าเว็บ Mobile site ที่จัดเตรียมไว้โดยเฉพาะ ซึ่งจะทำให้การแสดงผล หรือ UX ออกมาสวยงามกว่าแบบ Responsive Web Design จึงส่งผลให้ Google จะจัดอันดับเว็บเหล่านี้ไว้เหนือกว่าเว็บที่พัฒนาแบบ Responsive Web Design
Responsive Web Design ค่อนข้างมีข้อจำกัดหลายเรื่องและมีความยุ่งยากในการพัฒนา
เพราะการออกแบบและความเร็วในการโหลดไฟล์นั้นเป็นอุปสรรคสำคัญ ซึ่งนักพัฒนาจำเป็นต้องจัดเตรียมสคริป จัดการเรื่องขนาดของตัวอักษรและอัพโหลดรูปหลายรูปสำหรับการแสดงผลในหน้าจอขนาดต่างกันด้วย ซึ่งทั้งหมดนี้อาจทำให้เว็บไซต์มีจำนวนชุดคำสั่งที่มากกว่าปกติถึง 2 เท่า สำหรับบริษัทพัฒนาเว็บขนาดใหญ่ที่เชี่ยวชาญ สามารถแบ่งงานให้ทีมโปรแกรมเมอร์ร่วมกันพัฒนาและทดสอบเว็บไซต์บนหน้าจอหลายๆ ขนาดได้ไม่ยาก แต่สำหรับเว็บมาสเตอร์ทั่ว ๆ ไป อาจต้องเสียเวลาพัฒนาเว็บไซต์แบบ Responsive Web Design นี้นานกว่าปกติ
อุปสรรคของแนวทางนี้คือโทรศัพท์และแท็ปเล็ตที่มีอยู่ในตลาดผู้บริโภคนั้น มันช่างมากมายและแตกต่างกันมาก จนทำให้การพัฒนา Mobile site เพียงขนาดเดียวไม่เพียงพอ
แต่ปัญหาไม่ได้อยู่ที่การพัฒนาเว็บไซต์ ปัญหาที่นักพัฒนาเว็บและเจ้าของเว็บไซต์มักบ่นกัน คือ พวกเขาจะต้องดูและเว็บและอัพเดทข้อมูลอย่างน้อย 2 เว็บไซต์ ซึ่งก็ทำให้การดูแลเว็บไซต์เหล่านี้เป็นงานที่ค่อนข้างลำบาก และใช้เวลามากกว่าปกติ แต่ข้อดีคือ Mobile site นั้นจะมีการใส่ชุดโปรแกรมคำสั่งที่แยกจากเว็บไซต์หลัก และไม่ยุ่งเกี่ยวกัน ซึ่งมันไม่ได้ซับซ้อนอะไรมากนัก ดังนั้นจึงทำให้ทำงานง่ายกว่าแบบ Responsive Web Design
การออกแบบเว็บแบบ Responsive Web Design นั้นจำเป็นต้องคำนึงถึงองค์ประกอบ
ที่จะต้องแสดงในหน้าเว็บในขนาดที่แตกต่างกัน จึงถือเป็นข้อจำกัดที่ทำให้ไม่สามารถใส่ลูกเล่นได้มากนัก
คุณสามารถใส่ลูกเล่นต่างๆ ลงใน Mobile site ได้อย่างเต็มที่
เพียงแค่คำถึงถึงขนาดของพื้นที่ในแนวกว้างเท่านั้น แถมคุณยังสามารถเพิ่มแนวคิดแบบ Responsive Web Design เข้าไปเพื่อให้เว็บไซต์มีความยืดหยุ่นรองรับ Mobile devices ได้หลายขนาด แต่สำหรับเว็บไซต์หลัก เพื่อการแสดงผลบน Desktop นั้น คุณสามารถใส่รายละเอียด และลูกเล่นได้อย่างไม่จำกัดอีกด้วย
เพราะจริงๆ แล้วโลกใบนี้ไม่ได้มี Superman ที่จะทำอะไรได้ดีเลิศไปหมดซะทุกอย่าง
ด้วยข้อจำกัดด้านการออกแบบทางสถาปัตยกรรม ข้อมูลที่ต้องรองรับหน้าจอหลายๆ ขนาด และมีชุดคำสั่งที่ซับซ้อนมากมาย นั่นจึงทำให้เว็บแบบ Responsive Web Design เป็นเว็บที่แค่สอบผ่านด้าน UX แต่ไม่ได้สร้างความประทับใจเท่า Mobile site
คงต้องยอมรับในเรื่องนี้ว่า Mobile site นั้นเป็นเว็บที่ถูกออกแบบมาสำหรับหน้าจอของมือถือ
ดังนั้นมันจึงแสดงผลที่สวยงามกว่า และโหลดเร็วกว่าแบบ Responsive Web Design แน่นอน
Responsive Web Design นั้นถูกออกแบบมาเพื่อการนี้โดยเฉพาะ
ซึ่งจะช่วยให้เว็บไซต์มีความยืดหยุ่นและแปรผันไปตามขนาดของหน้าจอที่ใช้งาน เพียงแต่คุณจะต้องคำนึงเรื่องรายละเอียด และลูกเล่นที่จะนำมาใส่ลงในเว็บ เพราะมันจะต้องรองรับการแสดงผลในหน้าจอทุก ๆ ขนาด
Mobile site ก็เป็นอีก 1 ทางเลือกที่น่าสนใจ
เพราะต้องไม่ลืมว่าจริงๆแล้วคุณมีเว็บไซต์อย่างน้อย 2 เว็บ คือ เว็บไซต์หลักที่ออกแบบสำหรับ desktop และ mobile site สำหรับมือถือ ซึ่งจะทำให้คุณนำเสนอลูกเล่นเก๋ ๆ หรือรูปภาพขนาดใหญ่ได้อย่างสนุก
เป็นธรรมดาอยู่แล้วที่ของใหญ่กว่าย่อมต้องเคลื่อนไหวช้ากว่า
เพราะชุดคำสั่งของ Responsive Web Design นั้นมีความซับซ้อนมากมาย นั่นจึงเป็นสาเหตุให้เว็บไซต์แบบ Responsive Web Design นั้นโหลดช้ากว่า Mobile site
คุณได้แยกเว็บไซต์สำหรับ Mobile devices ที่มีขนาดกะทัดรัดเหมาะสำหรับมือถือ
ไฟล์ย่อมจะเล็กกะทัดรัดตามไปด้วย จึงเป็นเหตุผลให้ Mobile site สามารถดาว์นโหลดได้เร็วกว่าเว็บปกติทั่วไป เรื่องความเร็วก็เป็นอีกเรื่องที่ Google คำนึงถึงมาก ๆ ขนาดที่ทำตัวทดสอบออกมาให้ใช้กันเลยทีเดียว Google page speed insights
หากคุณมีกำลังคนน้อย ขอแนะนำแนวทางของ Responsive Web Design
เพราะด้วยความที่เป็นเว็บเดียวแล้วรองรับการแสดงผลบนทุก devices คุณจึงง่ายมาก ๆ ที่จะจัดการข้อมูล และอัพเดทเนื้อหาได้จาก CMS ที่เดียว
คุณจะต้องอัพเดทเนื้อหาอย่างน้อย 2 ที่
เพราะเว็บไซต์ของคุณถูกออกแบบให้ทำงานแยกกันโดยสิ้นเชิง แต่ถ้าคุณมีคนน้อยและกังวลว่าจะทำการอัพเดทไม่ไหว ก็ขอแนะนำว่าคุณควรจะโฟกัสไปที่เว็บหนึ่งเว็บใดก่อน เช่น ตั้งค่าให้ Mobile site เป็นเว็บหลักไปเลย แล้วปรับให้เว็บสำหรับ desktop เป็น Responsive Web Design ซะ
ก็นี่แหละคือเรื่องที่พวกเราสงสัยกันและได้เข้ามาอ่านบทความจนถึงตรงนี้ จริงๆ แล้ว
ถ้าเว็บของคุณไม่ซับซ้อน แถมคุณยังมีกำลังคนน้อยด้วย all-in-one อย่าง Responsive Web Design ก็ถือเป็นทางเลือกที่ดีนะ
แม้คุณจะมองว่า Desktop มันกำลังจะตก trend แต่ก็ต้องไม่ลืมว่าธุรกิจของคุณมีใครเป็นลูกค้ากลุ่มเป้าหมาย
ถ้าหากธุรกิจของคุณเป็นประเภท B2B หรือ B2G แล้วละก็ Desktop version จะมีความสำคัญมากกว่า Mobile version แน่นอน แต่ถ้าลูกค้าของคุณคือ C – consumer แล้วละก็ Mobile site นี่แหละคือคำตอบ
ลองจินตนาการว่าคุณมียานพาหนะที่สามารถวิ่งบนถนนหรือแล่นในน้ำได้
มันคงเป็นอะไรที่เจ๋งสุดๆ แต่ถ้าคุณต้องไปขับแข่งกับรถสปอร์ตล่ะ มันอาจจะวิ่งไม่เร็วเท่าที่คุณต้องการ หรือถ้าแล่นลงทะเลไปเที่ยวเกาะล่ะมันคงพาคุณไปได้ แต่ก็คงไม่ได้สะดวกสบายเท่ากับการนั่งเรือยอร์ชไป
ลองจินตนาการดูว่าหากคุณมีรถยนต์สปอร์ตอยู่หนึ่งคัน และมีเรือยอร์ชอีกหนึ่งลำ
เวลาคุณขับไปไหนก็มีแต่คงมองแถมยังซิ่งวิ่งเร็วเป็นจรวดอีก หรือเมื่อคุณจะไปเที่ยวทะเล แล้วคุณมีเรือยอร์ชส่วนตัว ขับไปเที่ยวเกาะนู้นเกาะนี้ได้ไม่อายใคร ซึ่งทั้งรถสปอร์ตและเรือยอร์ชมันถูกออกแบบมาให้เหมาะกับงานที่แตกต่างกันชัดเจน
คุณใช้ชื่อโดเมนเนมเพียงชื่อเดียว
ง่ายต่อการโปรโมท ง่ายต่อการจดจำ
จริงๆ แล้ว Mobile site มันไม่จำเป็นต้องมีโดเมนเนมเฉพาะอะไรเลย
เพียงแค่มีชื่อที่ยาวขึ้นเล็กน้อย ทุกวันนี้ Google จะมองว่าคุณมี 2 เว็บไซต์แยกกัน ซึ่งมีการจัดอันดับที่แตกต่างกันด้วย Mobile site จะไปปรากฏในอันดับการค้นหาที่มาจากมือถือ และ Desktop ก็จะไปปรากฏอันดับในการค้นหาที่มาจาก Desktop
ถ้าคุณไม่มีแผนที่จะปรับเปลี่ยนรูปแบบของเว็บไซต์ของคุณอยู่บ่อยๆ
RWD ถือเป็นทางเลือกที่ใช่เลย
ปกติการใช้งาน Mobile site มักจะใช้งานกันไม่นานนักประมาณ 6-8 เดือน
ก็จะมีการปรับเปลี่ยนรูปแบบไปตามกระแสนิยมและแคมเปญการตลาด ดังนั้นคุณจึงควรพัฒนาเว็บไซต์หลักด้วยแนวคิดแบบ Responsive Web Design ควบคู่ไปด้วย
เป็นทางเลือกที่ดีสำหรับเว็บไซต์ที่ไม่มีความยุ่งยากซับซ้อนของข้อมูล
เช่น มีสินค้าจำนวนไม่มาก หรือไม่มีตารางข้อมูลขนาดใหญ่
เป็นทางเลือกที่ดีสำหรับเว็บไซต์ที่มีความซับซ้อนของข้อมูล หรือมีสินค้าจำนวนมาก
แต่แนวทางนี้คุณจะต้องแยกผู้ใช้ออกเป็น 2 กลุ่มที่ชัดเจนคือกลุ่มที่ใช้มือถือ และกลุ่มที่ใช้ Desktop
Responsive Web Design นั้นรองรับการทำ SEO อยู่แล้ว
แต่เพราะเว็บแบบ Responsive Web Design นั้นมักไม่นิยมใส่ content ที่เป็นตัวอักษรมากนัก เพราะเมื่อแสดงบนหน้าจอขนาดเล็กอย่างมือถือแล้ว จะไม่น่าอ่าน จึงอาจทำให้ใส่ keyword ลงในเนื้อหาได้ไม่มากนักด้วย
Content มีความสำคัญต่อการทำ SEO มาก
ด้วยแนวทางของ Mobile site นั้นค่อนข้างเหมาะกับเว็บไซต์ที่นำเสนอเนื้อหาหรือบทความยาวๆ กล่าวคือคุณสามารถสร้าง SEO content เพื่อใส่เนื้อหาได้อย่างครบถ้วนบน Responsive Web Design Desktop version จากนั้นก็นำเอาเนื้อหาเพียงบางส่วนที่มี keyword สำคัญมาวางใน Mobile site
เป็นทางเลือกที่ดีที่สุดสำหรับเว็บไซต์ที่มีเนื้อหาไม่มาก ไม่ซับซ้อน ไม่ต้องการมีการเปลี่ยนแปลงดีไซน์และโครงสร้างของเว็บไซต์บ่อยๆ
โดยเฉพาะอย่างยิ่งหากคุณไม่มีคนและไม่มีเวลาในการมาอัพเดท content หลายๆ ที่พร้อมๆ กัน เพราะ Responsive Web Design นั้นจำเป็นจะต้องมีเว็บมาสเตอร์ที่เชี่ยวชาญมาช่วยจัดการในเรื่องการปรับเปลี่ยนดีไซน์ของเว็บไซต์
เหมาะกับเว็บไซต์ขนาดกลางและขนาดเล็กที่ไม่ซับซ้อน | |
เหมาะกับเว็บไซต์ที่มีจำนวนหน้าไม่มาก | |
มีชื่อโดเมนเนมเดียว จดจำง่าย | |
มีชุดคำสั่งโปรแกรมที่ซับซ้อน | |
โหลดช้า |
เป็นทางเลือกที่ดีที่สุดสำหรับเจ้าของเว็บไซต์ที่ชอบเปลี่ยนแปลงดีไซน์บ่อยๆ
ให้อิสระแก่นักออกแบบในการใส่ลูกเล่นต่างๆ ลงในหน้าเว็บไซต์ และมีทีมงานในการใส่ content แต่ก็ต้องไม่ลืมว่าจริงๆ แล้วคุณจะมี 2 เว็บไซต์ให้ต้องดูแลโดยที่มีการแบ่งกลุ่มของผู้ใช้แยกกันอย่างชัดเจน แนะนำว่าก็ควรทำ Responsive Web Design ควบคู่ไปด้วย เหมาะกับเว็บขนาดใหญ่ที่มีความซับซ้อน
แยกกลุ่มผู้ใช้ตามประเภทของอุปกรณ์อย่างชัดเจน | |
ต้องการสร้างความประทับใจให้แก่ผู้ใช้ แต่ก็ได้เรื่อง SEO พ่วงมาด้วย | |
ต้องเสียเวลาอัพเดทหลายหลายที่ | |
Automatic redirect script ด้วย |
ทั้งนี้ผู้เขียนจะขอโฟกัสไปที่เว็บไซต์เพียงอย่างเดียวก่อน เพราะจริงๆ แล้วยังมีอีกวิธีการหนึ่ง ซึ่งก็คือ การสร้าง Mobile Application เพื่อให้ผู้ใช้สามารถดาว์นโหลดแอพไปติดตั้งบนอุปกรณ์พกพา (Mobile Devices) ของแต่ละคน เพื่อให้สามารถเข้าถึงบริการของท่านได้อย่างสะดวก
แต่ผู้เขียนเล็งเห็นว่า หากท่านจะต้องจ้างนักพัฒนา เพื่อมาสร้าง Mobile App ของท่านแล้ว ท่านอาจจำเป็นจะต้องสร้างอย่างน้อย 2 แพลตฟอร์ม (iOS และ Android) ซึ่งอาจทำให้ท่านต้องเสียค่าใช้จ่ายในการพัฒนาแอพและค่าโปรโมทแอพของท่านด้วยงบประมาณที่สูงขึ้น
แต่ถ้าหากท่านมีงบประมาณที่มากพอ และมีวัตถุประสงค์ที่ชัดเจน ในการสร้างแอพ เพื่อเพิ่มช่องทางการให้บริการและการติดต่อสื่อสารกับผู้ใช้ของท่านแล้ว ผู้เขียนก็อยากแนะนำให้ท่านมี Mobile App ไว้ด้วยเช่นกัน
เนื้อหาทั้งหมดนี้ อาจช่วยให้คุณเข้าใจและตัดสินใจ ในการเลือกใช้แนวทางที่เหมาะสม ในการพัฒนาเว็บไซต์ใหม่ที่จะตอบโจทย์ผู้ใช้มากยิ่งขึ้น เพราะยุคนี้คือยุคของผู้บริโภคอย่างแท้จริง ซึ่งนั่นหมายถึง หมดเวลาสำหรับเว็บไซต์แบบธรรมดาที่ไม่รองรับการใช้งานบนมือถือแล้ว
หากคุณอยากทราบว่า Responsive Web Design คืออะไร ? , Mobile Site คืออะไร ? แล้วทำไมถึงสำคัญมากในยุคนี้
ผู้เขียนขอแนะนำให้คุณลองไปอ่านภาคแรก: อนาคตของเว็บไซต์ เมื่อใครๆ ก็ใช้แต่โมบาย