Responsive Web Design VS Mobile Site แบบไหนดีกว่ากัน ?

28 Aug 2015

วัดกัน หมัดต่อหมัดระหว่าง Responsive Web Design กับ Mobile Site ใครจะอยู่ ใครจะไป
ทั้ง 2 แนวทางนี้มีทั้งข้อดีข้อด้อยแตกต่างกันอย่างไร และเหมาะกับใคร ลองมาดูกันต่อเลย


Responsive Web Design กับ Mobile Site อะไรดีกว่ากัน ?

Responsive Web Design

Responsive Web Design กับ Mobile Site อะไรดีกว่ากัน ?

Mobile Site

  • Responsive Web Design กับ Mobile Site มันต่างกันอย่างไร

Responsive Web Design กับ Mobile Site ต่างกันอย่างไร ?

เว็บไซต์เดียว
แต่แสดงผลแปรผันไปตามขนาดของอุปกรณ์

Responsive Web Design กับ Mobile Site ต่างกันอย่างไร ?

สร้างเว็บไซต์ย่อยหลายเว็บไซต์
เพื่อให้รองรับการแสดงผลในหน้าจอแต่ละขนาดที่แตกต่างกัน


  • Responsive Web Design กับ Mobile Site รองรับการใช้งานบน Mobile devices ไหม

Responsive Web Design กับ Mobile Site รองรับการใช้งานบน Mobile devices ไหม

แน่นอน
ถ้าไม่เขียนสคริปผิดนะ

Responsive Web Design กับ Mobile Site รองรับการใช้งานบน Mobile devices ไหม

แน่นอน
เพราะออกแบบมาสำหรับ Mobile devices แล้วนิ


  • การตอบสนองต่อหน้าจอที่ขนาดแตกต่างกัน

การตอบสนองต่อหน้าจอที่ขนาดแตกต่างกัน

ด้วยเว็บไซต์หลักเพียงเว็บเดียว
ก็สามารถแสดงผลที่แตกต่างกันบน Desktop แท็ปเล็ต และมือถือ

การตอบสนองต่อหน้าจอที่ขนาดแตกต่างกัน

รองรับการแสดงผล
ได้ทั้งบน Desktop แท็ปเล็ต และมือถือด้วยเช่นกัน


  • ในแง่ของ SEO Responsive Web Design กับ Mobile Site อะไรที่ดีกว่ากัน

ในแง่ของ SEO Responsive Web Design กับ Mobile Site อะไรที่ดีกว่ากัน

Responsive Web Design นั้นผ่าน Google mobile friendly test ได้อยู่แล้ว
เพราะเว็บไซต์สามารถปรับเปลี่ยนการแสดงผลไปตามขนาดของหน้าจอ แต่อาจมีข้อด้อยอยู่นิดคือ UX หรือการแสดงผล อาจไม่ได้สวยงามหมดจดเท่ากับการออกแบบมาเพื่อ Mobile โดยเฉพาะ จึงทำให้ Google จะจัดอันดับเว็บเหล่านี้ไว้ต่ำกว่า เว็บที่มี Mobile site เล็กน้อย

ในแง่ของ SEO Responsive Web Design กับ Mobile Site อะไรที่ดีกว่ากัน

สามารถผ่าน Google mobile friendly test ได้อย่างสบายๆ
เพราะ Google bot จะถูก redirect ไปยังหน้าเว็บ Mobile site ที่จัดเตรียมไว้โดยเฉพาะ ซึ่งจะทำให้การแสดงผล หรือ UX ออกมาสวยงามกว่าแบบ Responsive Web Design จึงส่งผลให้ Google จะจัดอันดับเว็บเหล่านี้ไว้เหนือกว่าเว็บที่พัฒนาแบบ Responsive Web Design


  • Responsive Web Design กับ Mobile Site แนวทางไหนง่ายกว่ากัน

Responsive Web Design กับ Mobile Site อันไหนง่ายกว่ากัน

Responsive Web Design ค่อนข้างมีข้อจำกัดหลายเรื่องและมีความยุ่งยากในการพัฒนา
เพราะการออกแบบและความเร็วในการโหลดไฟล์นั้นเป็นอุปสรรคสำคัญ ซึ่งนักพัฒนาจำเป็นต้องจัดเตรียมสคริป จัดการเรื่องขนาดของตัวอักษรและอัพโหลดรูปหลายรูปสำหรับการแสดงผลในหน้าจอขนาดต่างกันด้วย ซึ่งทั้งหมดนี้อาจทำให้เว็บไซต์มีจำนวนชุดคำสั่งที่มากกว่าปกติถึง 2 เท่า สำหรับบริษัทพัฒนาเว็บขนาดใหญ่ที่เชี่ยวชาญ สามารถแบ่งงานให้ทีมโปรแกรมเมอร์ร่วมกันพัฒนาและทดสอบเว็บไซต์บนหน้าจอหลายๆ ขนาดได้ไม่ยาก แต่สำหรับเว็บมาสเตอร์ทั่ว ๆ ไป อาจต้องเสียเวลาพัฒนาเว็บไซต์แบบ Responsive Web Design นี้นานกว่าปกติ

Responsive Web Design กับ Mobile Site อันไหนง่ายกว่ากัน

อุปสรรคของแนวทางนี้คือโทรศัพท์และแท็ปเล็ตที่มีอยู่ในตลาดผู้บริโภคนั้น มันช่างมากมายและแตกต่างกันมาก จนทำให้การพัฒนา Mobile site เพียงขนาดเดียวไม่เพียงพอ
แต่ปัญหาไม่ได้อยู่ที่การพัฒนาเว็บไซต์ ปัญหาที่นักพัฒนาเว็บและเจ้าของเว็บไซต์มักบ่นกัน คือ พวกเขาจะต้องดูและเว็บและอัพเดทข้อมูลอย่างน้อย 2 เว็บไซต์ ซึ่งก็ทำให้การดูแลเว็บไซต์เหล่านี้เป็นงานที่ค่อนข้างลำบาก และใช้เวลามากกว่าปกติ แต่ข้อดีคือ Mobile site นั้นจะมีการใส่ชุดโปรแกรมคำสั่งที่แยกจากเว็บไซต์หลัก และไม่ยุ่งเกี่ยวกัน ซึ่งมันไม่ได้ซับซ้อนอะไรมากนัก ดังนั้นจึงทำให้ทำงานง่ายกว่าแบบ Responsive Web Design


  • เรื่องการออกแบบล่ะ

การออกแบบเว็บแบบ Responsive Web Design

การออกแบบเว็บแบบ Responsive Web Design นั้นจำเป็นต้องคำนึงถึงองค์ประกอบ
ที่จะต้องแสดงในหน้าเว็บในขนาดที่แตกต่างกัน จึงถือเป็นข้อจำกัดที่ทำให้ไม่สามารถใส่ลูกเล่นได้มากนัก

การออกแบบ Mobile site

คุณสามารถใส่ลูกเล่นต่างๆ ลงใน Mobile site ได้อย่างเต็มที่
เพียงแค่คำถึงถึงขนาดของพื้นที่ในแนวกว้างเท่านั้น แถมคุณยังสามารถเพิ่มแนวคิดแบบ Responsive Web Design เข้าไปเพื่อให้เว็บไซต์มีความยืดหยุ่นรองรับ Mobile devices ได้หลายขนาด แต่สำหรับเว็บไซต์หลัก เพื่อการแสดงผลบน Desktop นั้น คุณสามารถใส่รายละเอียด และลูกเล่นได้อย่างไม่จำกัดอีกด้วย


  • ด้าน UX ล่ะ อะไรที่สร้างประสบการณ์ให้แก่ผู้ใช้ได้ดีกว่ากัน

ด้าน UX ล่ะ อะไรที่สร้างประสบการณ์ให้แก่ผู้ใช้ได้ดีกว่ากัน

เพราะจริงๆ แล้วโลกใบนี้ไม่ได้มี Superman ที่จะทำอะไรได้ดีเลิศไปหมดซะทุกอย่าง
ด้วยข้อจำกัดด้านการออกแบบทางสถาปัตยกรรม ข้อมูลที่ต้องรองรับหน้าจอหลายๆ ขนาด และมีชุดคำสั่งที่ซับซ้อนมากมาย นั่นจึงทำให้เว็บแบบ Responsive Web Design เป็นเว็บที่แค่สอบผ่านด้าน UX แต่ไม่ได้สร้างความประทับใจเท่า Mobile site

ด้าน UX ล่ะ อะไรที่สร้างประสบการณ์ให้แก่ผู้ใช้ได้ดีกว่ากัน

คงต้องยอมรับในเรื่องนี้ว่า Mobile site นั้นเป็นเว็บที่ถูกออกแบบมาสำหรับหน้าจอของมือถือ
ดังนั้นมันจึงแสดงผลที่สวยงามกว่า และโหลดเร็วกว่าแบบ Responsive Web Design แน่นอน


  • แล้วอะไรที่เหมาะกับการแสดงผลทั้งบน desktop และ mobile devices มากกว่ากัน

Responsive Web Design กับ Mobile Site แบบไหนดีกว่ากัน

Responsive Web Design นั้นถูกออกแบบมาเพื่อการนี้โดยเฉพาะ
ซึ่งจะช่วยให้เว็บไซต์มีความยืดหยุ่นและแปรผันไปตามขนาดของหน้าจอที่ใช้งาน เพียงแต่คุณจะต้องคำนึงเรื่องรายละเอียด และลูกเล่นที่จะนำมาใส่ลงในเว็บ เพราะมันจะต้องรองรับการแสดงผลในหน้าจอทุก ๆ ขนาด

แล้วอะไรที่เหมาะกับการแสดงผลทั้งบน desktop และ mobile devices มากกว่ากัน

Mobile site ก็เป็นอีก 1 ทางเลือกที่น่าสนใจ
เพราะต้องไม่ลืมว่าจริงๆแล้วคุณมีเว็บไซต์อย่างน้อย 2 เว็บ คือ เว็บไซต์หลักที่ออกแบบสำหรับ desktop และ mobile site สำหรับมือถือ ซึ่งจะทำให้คุณนำเสนอลูกเล่นเก๋ ๆ หรือรูปภาพขนาดใหญ่ได้อย่างสนุก


  • Responsive Web Design กับ Mobile Site แบบไหนโหลดเร็วกว่ากัน

Responsive Web Design กับ Mobile Site แบบไหนเร็วกว่ากัน

เป็นธรรมดาอยู่แล้วที่ของใหญ่กว่าย่อมต้องเคลื่อนไหวช้ากว่า
เพราะชุดคำสั่งของ Responsive Web Design นั้นมีความซับซ้อนมากมาย นั่นจึงเป็นสาเหตุให้เว็บไซต์แบบ Responsive Web Design นั้นโหลดช้ากว่า Mobile site

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 นี่แหละคือคำตอบ


  • มุมมองของผู้เขียน

Responsive Web Design และ Mobile Site

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

Responsive Web Design และ Mobile Site

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


  • เรื่องชื่อโดเมนเนมของเว็บไซต์

เรื่องชื่อโดเมนเนมของเว็บไซต์

คุณใช้ชื่อโดเมนเนมเพียงชื่อเดียว
ง่ายต่อการโปรโมท ง่ายต่อการจดจำ

เรื่องชื่อโดเมนเนมของเว็บไซต์

จริงๆ แล้ว Mobile site มันไม่จำเป็นต้องมีโดเมนเนมเฉพาะอะไรเลย
เพียงแค่มีชื่อที่ยาวขึ้นเล็กน้อย ทุกวันนี้ Google จะมองว่าคุณมี 2 เว็บไซต์แยกกัน ซึ่งมีการจัดอันดับที่แตกต่างกันด้วย Mobile site จะไปปรากฏในอันดับการค้นหาที่มาจากมือถือ และ Desktop ก็จะไปปรากฏอันดับในการค้นหาที่มาจาก Desktop


  • อนาคตของเว็บไซต์

อนาคตของเว็บไซต์ Responsive Web Design และ Mobile Site

ถ้าคุณไม่มีแผนที่จะปรับเปลี่ยนรูปแบบของเว็บไซต์ของคุณอยู่บ่อยๆ
RWD ถือเป็นทางเลือกที่ใช่เลย

อนาคตของเว็บไซต์ Responsive Web Design และ Mobile Site

ปกติการใช้งาน Mobile site มักจะใช้งานกันไม่นานนักประมาณ 6-8 เดือน
ก็จะมีการปรับเปลี่ยนรูปแบบไปตามกระแสนิยมและแคมเปญการตลาด ดังนั้นคุณจึงควรพัฒนาเว็บไซต์หลักด้วยแนวคิดแบบ Responsive Web Design ควบคู่ไปด้วย


  • Responsive Web Design กับ Mobile Site แนวทางไหนเหมาะกับใคร

อนาคตของเว็บไซต์ Responsive Web Design กับ Mobile Site แนวทางไหนเหมาะกับใคร

เป็นทางเลือกที่ดีสำหรับเว็บไซต์ที่ไม่มีความยุ่งยากซับซ้อนของข้อมูล
เช่น มีสินค้าจำนวนไม่มาก หรือไม่มีตารางข้อมูลขนาดใหญ่

อนาคตของเว็บไซต์ Responsive Web Design กับ Mobile Site แนวทางไหนเหมาะกับใคร

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


  • เพิ่มเติมเกี่ยวกับการทำ SEO ของแต่ละแนวทาง

Responsive Web Design นั้นรองรับการทำ SEO อยู่แล้ว

Responsive Web Design นั้นรองรับการทำ SEO อยู่แล้ว
แต่เพราะเว็บแบบ Responsive Web Design นั้นมักไม่นิยมใส่ content ที่เป็นตัวอักษรมากนัก เพราะเมื่อแสดงบนหน้าจอขนาดเล็กอย่างมือถือแล้ว จะไม่น่าอ่าน จึงอาจทำให้ใส่ keyword ลงในเนื้อหาได้ไม่มากนักด้วย

Content มีความสำคัญต่อการทำ SEO มาก

Content มีความสำคัญต่อการทำ SEO มาก
ด้วยแนวทางของ Mobile site นั้นค่อนข้างเหมาะกับเว็บไซต์ที่นำเสนอเนื้อหาหรือบทความยาวๆ กล่าวคือคุณสามารถสร้าง SEO content เพื่อใส่เนื้อหาได้อย่างครบถ้วนบน Responsive Web Design Desktop version จากนั้นก็นำเอาเนื้อหาเพียงบางส่วนที่มี keyword สำคัญมาวางใน Mobile site


  • สรุปว่า...

บทสรุป Responsive Web Design กับ Mobile Site เลือกแบบไหนดี ?

เป็นทางเลือกที่ดีที่สุดสำหรับเว็บไซต์ที่มีเนื้อหาไม่มาก ไม่ซับซ้อน ไม่ต้องการมีการเปลี่ยนแปลงดีไซน์และโครงสร้างของเว็บไซต์บ่อยๆ
โดยเฉพาะอย่างยิ่งหากคุณไม่มีคนและไม่มีเวลาในการมาอัพเดท content หลายๆ ที่พร้อมๆ กัน เพราะ Responsive Web Design นั้นจำเป็นจะต้องมีเว็บมาสเตอร์ที่เชี่ยวชาญมาช่วยจัดการในเรื่องการปรับเปลี่ยนดีไซน์ของเว็บไซต์

เหมาะกับเว็บไซต์ขนาดกลางและขนาดเล็กที่ไม่ซับซ้อน
เหมาะกับเว็บไซต์ที่มีจำนวนหน้าไม่มาก
มีชื่อโดเมนเนมเดียว จดจำง่าย
มีชุดคำสั่งโปรแกรมที่ซับซ้อน
โหลดช้า
บทสรุป Responsive Web Design กับ Mobile Site เลือกแบบไหนดี ?

เป็นทางเลือกที่ดีที่สุดสำหรับเจ้าของเว็บไซต์ที่ชอบเปลี่ยนแปลงดีไซน์บ่อยๆ
ให้อิสระแก่นักออกแบบในการใส่ลูกเล่นต่างๆ ลงในหน้าเว็บไซต์ และมีทีมงานในการใส่ content แต่ก็ต้องไม่ลืมว่าจริงๆ แล้วคุณจะมี 2 เว็บไซต์ให้ต้องดูแลโดยที่มีการแบ่งกลุ่มของผู้ใช้แยกกันอย่างชัดเจน แนะนำว่าก็ควรทำ Responsive Web Design ควบคู่ไปด้วย เหมาะกับเว็บขนาดใหญ่ที่มีความซับซ้อน

แยกกลุ่มผู้ใช้ตามประเภทของอุปกรณ์อย่างชัดเจน
ต้องการสร้างความประทับใจให้แก่ผู้ใช้ แต่ก็ได้เรื่อง SEO พ่วงมาด้วย
ต้องเสียเวลาอัพเดทหลายหลายที่
Automatic redirect script ด้วย

มุมมองของผู้เขียน

ทั้งนี้ผู้เขียนจะขอโฟกัสไปที่เว็บไซต์เพียงอย่างเดียวก่อน เพราะจริงๆ แล้วยังมีอีกวิธีการหนึ่ง ซึ่งก็คือ การสร้าง Mobile Application เพื่อให้ผู้ใช้สามารถดาว์นโหลดแอพไปติดตั้งบนอุปกรณ์พกพา (Mobile Devices) ของแต่ละคน เพื่อให้สามารถเข้าถึงบริการของท่านได้อย่างสะดวก

แต่ผู้เขียนเล็งเห็นว่า หากท่านจะต้องจ้างนักพัฒนา เพื่อมาสร้าง Mobile App ของท่านแล้ว ท่านอาจจำเป็นจะต้องสร้างอย่างน้อย 2 แพลตฟอร์ม (iOS และ Android) ซึ่งอาจทำให้ท่านต้องเสียค่าใช้จ่ายในการพัฒนาแอพและค่าโปรโมทแอพของท่านด้วยงบประมาณที่สูงขึ้น

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

ตัวอย่าง Responsive Web Design

Responsive Web Design

ตัวอย่าง Mobile Site

Mobile Site

ปิดท้าย

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

หากคุณอยากทราบว่า Responsive Web Design คืออะไร ? , Mobile Site คืออะไร ? แล้วทำไมถึงสำคัญมากในยุคนี้
ผู้เขียนขอแนะนำให้คุณลองไปอ่านภาคแรก: อนาคตของเว็บไซต์ เมื่อใครๆ ก็ใช้แต่โมบาย

« Back to Result