ข้อมูลองค์ความรู้โดย
วีรพจน์ สันติวิมานแมน
ตำแหน่ง เว็บดีไซน์

10 ก้าวสู่ความสำเร็จ ของการทำ Mobile Site

ประเภททางด้าน IT หลัก :   Development & Integration
ประเภททางด้าน IT ย่อย :   Web Design
  ลงข้อมูลเมื่อ 10:38:14 08/01/2013
  Page View (3344) แบ่งปัน

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

แม้บทความนี้จะเน้นหนักเรื่องของ Mobile Site แต่ก่อนที่จะไปถึงจุดนั้น เชื่อว่าหลายคนมีคำถามนี้อยู่ในใจ นั่นคือ “เมื่อกล่าวถึงการเข้าใช้งานบนโทรศัพท์มือถือ เราควรพัฒนาในรูปแบบ Mobile Site ดี หรือควรทำเป็น Branded Application ดี”


และนี่คือสิ่งสิ่งที่คุณจะต้องพิจารณาและมันจะเป็นตัวบ่งชี้ว่าคุณควรไปในทิศทางไหน

ต้นทุน, การหารายได้ – แน่นอนว่าต้นทุนการทำ Mobile Site นั้นถูกกว่ามาก ไม่ต้องมาปวดหัวจัดการกับการพัฒนา Application ในหลายๆ แพลตฟอร์มทั้ง  iOS, Android, Blackberry และอื่นๆ และอย่างกรณีของ Apple ไหนยังต้องรอการอนุมัติอีก แต่ถ้าคุณคิดจะหารายได้จากการขายไอเทมต่างๆ บน Store นั่นค่อยเป็นอีกเรื่องหนึ่ง โดยที่นั่นมีระบบหน้าร้านและการชำระเงินไว้พร้อมแล้ว

การใช้งาน – ถ้าเน้นแค่การใช้งานเพื่อดูข้อมูลข่าวสาร และต้องการเข้าถึงคนกลุ่มใหญ่จากหลายๆ แพลตฟอร์ม Mobile Site เป็นสิ่งที่ตอบโจทย์ได้ดี

ฟีเจอร์ – แน่นอนว่า Mobile Site จะไม่สามารถทำอะไรที่หรูหราอลังการณ์ได้แบบ application ถ้ามีความต้องการที่้อยากสร้างประสบการณ์การใช้งาน การสร้างการมีส่วนร่วม (engagement)  อะไรที่ต้องดึงความสามารถจากเครื่องอย่างจริงจัง อาทิเช่น ต้องนำกล้องหรือฟังก์ชั่น GPS มาประยุกต์ใช้ในรูปแบบที่ advance การพัฒนาด้วย application  จะตอบโจทย์ในจุดนี้ได้

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

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

ผลสำรวจจาก Limelight Networks กล่าวว่า “กว่า 80% ของผู้ใช้จะไม่ดูข้อมูลบน Mobile Site ต่อ ถ้าไม่สามารถนำเสนอประสบการณ์ที่ดีพอ” พูดง่ายๆ ก็คือวันนี้แบรนด์ต่างๆ มี Mobile Site แล้วหรือยัง ไม่ใช่ว่าเว็บไซต์ของคุณจะเปิดได้บนโทรศัพท์ก็เพียงพอ แต่หมายถึงการที่ เปิดเข้าไปแล้วสามารถที่จะให้ประสบการณ์ที่ดี เห็นหน้าจอที่พอเหมาะพอดีกับเครื่องโทรศัพท์ ให้ข้อมูลที่จำเป็นและเพียงพอกับหน้าจอที่มีขนาดเล็ก ไม่ใช่ยัดเยียดทุกสิ่งทุกอย่างเข้าไป

GoMo คือหนึ่งในโครงการที่ทาง Google สร้างขึ้นมาและมีข้อมูลดีๆ ที่น่าสนใจให้อ่านอยู่มากมาย และนี่เป็นตัวอย่างปัจจัยสำคัญๆ 6 ประการในการทำ Mobile Site ให้ดี

1) ความเร็วนั้นสำคัญยี่ง
คุณลองคิดดูว่าการใช้งานผ่านหน้าจอโทรศัพท์เล็กๆ นั้นๆ ถ้าเกิดเปิดขึ้นมาต้องรอโหลดหน้าเพจนาน คงไม่มีใครทนรอเป็นแน่แท้ การออกแบบเพจให้โหลดได้เร็ว การจัดลำดับคอนเทนต์และฟีเจอร์ต่างๆ ว่าสิ่งไหนสำคัญกับผู้ใช้เป็นสิ่งที่ควรคำนึงถึงให้มาก อะไรที่ผู้ใช้ควรต้องเห็นก่อน เป็นต้น เครื่องมือ Analytic ต่างๆ ที่ใช้ดูพฤติกรรมผู้บริโภคจึงมีความสำคัญในการนำมาวิเคราะห์และพิจารณา

การออกแบบ bullet ให้ดูง่าย, การบีบอัดรูปให้เล็กและสามารถโหลดได้เร็วก็เป็นสิ่งที่ต้องทำเช่นเดียวกัน

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

  • มุ่งไปที่ข้อมูลที่ช่วยนำไปสู่ธุรกรรมเป้าหมายหลักเหล่านั้น เช่น รายละเอียดสินค้า
  • ลดขั้นตอนในการทำธุรกรรมให้น้อยที่สุด
  • ถ้ามีการกรอกฟอร์มอะไรก็ควรเป็นฟอร์มที่สั้นและ fields น้อยๆ
  • ใช้ check boxes, lists และพวก scroll menus เพื่อให้ง่ายต่อการป้อนข้อมูล
  • ต้องมี click-to-call ฟังก์ชั่นให้พร้อม ถ้าต้องการโทรติดต่อหาเบอร์โทรศัพท์ของบริษัทโดยตรง
  • และที่สำคัญต้องอย่าลืม Track และคอย Monitor ดูผลจากการทำธุรกรรมเหล่านั้นอย่างต่อเนื่อง

3) การท่องไปใน Mobile Site ต้องง่าย

  • ออกแบบออกมาให้อยู่ในแนวตั้ง แล้วใช่เลื่อนขึ้นลง เอาให้พอดีกับหน้าจอไม่ต้องมาคอยซูมเข้าออก
  • เมนูต่างๆ ออกแบบให้เป็นลำดับชัดเจน
  • มีปุ่ม back และ home ที่เห็นได้ชัด
  • ในเพจหนึ่งไม่ต้องมีลิงค์เยอะมาก 7 ลิงค์ก็มากพอแล้ว
  • อย่าลืมที่จะต้องติดตั้ง search box เอาไว้ในหน้าที่มีความซับซ้อน

4) ข้อมูล Local
ความสามารถของเครื่องโทรศัพท์ในยุคนี้ที่สามารถระบุตำแหน่งได้กลายเป็นเรื่องธรรมดามากๆ เมื่อเทียบกับ 10 ปีก่อน ผู้ใช้ส่วนใหญ่ก็ต้องการค้นหาข้อมูลที่อยู่ใกล้ๆ ในขณะนั้น จงอย่าลืมที่จะใส่ฟังก์ชั่นที่ช่วยให้พวกเขาหาร้านของคุณเจอ ไม่ว่าจะเป็นเมนูการค้นหาสาขาใกล้ๆ แสดงผลเป็นแบบแผนที่และทิศทาง นำเสนอโปรโมชั่นหรือดีลพิเศษต่างๆ ในตอนนั้น เป็นต้น

5) ยุคแห่งนิ้วโป้ง
พยายามออกแบบหน้าจอรองรับแม้แต่คนนิ้วใหญ่ก็ตาม ไม่ว่าจะเป็นปุ่มหรือช่องว่างต่างๆ ควรพอดี ป้องกันไม่ให้กดพลาด

6) ให้ประสบการณ์ที่ดีในแบบ seamless ทุกๆ ช่องทาง
ฟังก์ชั่นอะไรก็ตามที่เราคุ้นชินบน Desktop และให้ประสบการณ์ที่ดีควรต้องดึงมา อาทิเช่น การบันทึกข้อมูลการค้นหา, การบันทึกสินค้าที่อยุ่ในตะกร้าไม่ต้องมาค้นกันใหม่, คงไว้ซึ่งฟีเจอร์หลักๆ ที่มีอยู่ในแต่ละช่องทางให้เหมือนๆ กัน รวมถึงการแสดงข้อมูลสินค้าและผลิตภัณฑ์ของคุณก็ต้องตรงกัน

7) ออกแบบเพื่อรองรับการมองเห็น

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

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

  • เปิดให้ผู้ใช้มีสิทธิเลือกกลับไปอ่านแบบ Desktop เวอร์ชั่นได้เช่นกัน และต้องง่ายในการกลับมาดูแบบ Mobile Site
  • ให้ผู้ใช้เลือกได้ว่าจะดูด้วยเวอร์ชั่นไหนในภายหลัง
  • ใส่ข้อมูลที่สำคัญๆ บนหน้า Redirect Page เช่น ที่อยู่ของคุณหรือตำแหน่งร้าน

9) ทำให้เข้าถึงได้มากที่สุด
พยายามลดปัญหาข้อจำกัดของอุปกรณ์เพื่อให้เข้าถึงผู้ใช้ได้มากที่สุด อาทิเช่น

  • บางเครื่องอาจไม่รองรับ Flash พยายามหารูปแบบการนำเสนอที่ลดปัญหาดังกล่าว
  • ใช้ HTML5 สำหรับงานที่ต้องอินเตอร์แอคทีฟ และอนิเมชั่น
  • รองรับทั้งแบบที่อ่านแบบแนวตั้งและแนวนอนไว้ให้พร้อม

10) ฟังเสียงผู้บริโภคให้มาก

  • ใช้เครื่องมือต่างๆ ในการวิเคราะห์และ track ดูเพื่อทำความเข้าใจพฤติกรรมของผู้ใช้ของคุณ
  • อย่าลืมที่จะทำการทดสอบก่อนเปิดตัวใช้งานจริง นำฟีดแบคที่ได้จากผู้ทดสอบมาพิจารณาว่าใช้งานง่ายมากน้อยเพียงใด
  • พยายามพัฒนาและปรับปรุงเช่นนี้อย่างต่อเนื่อง

สำหรับใครที่สนใจข้อมูลเพิ่มเติมพร้อมกรณีศึกษาสามารถดูได้ที่โครงการ GoMo ของ Google

บทความจาก: http://thumbsup.in.th

แหล่งที่มา: HowtoGoMo, Econsultancy



องค์ความรู้ที่มีผู้อ่านมากสุด
การสร้างและตกแต่งตัวอักษร
การสร้างและตกแต่งตัวอักษร

โดย... วีรพจน์ สันติวิมานแมน

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

โดย... วีรพจน์ สันติวิมานแมน

สวมรอยเป็นไอพีอื่น ด้วย Proxy Switcher
Proxy Switcher เป็นโปรแกรมที่ใช้สำหรับค้นหา Proxy เพื่อนำเอามาใช้ก็คือการสวมรอยเป็นไอพีอื่น ๆ โดยภายนอกจะมองเห็นเราเป็น ไอพีที่เราสวมรอยนั้น

โดย... วีรพจน์ สันติวิมานแมน

ตัวช่วยอัตโนมัิติบน windows
-

โดย... วีรพจน์ สันติวิมานแมน

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

โดย... วีรพจน์ สันติวิมานแมน