IA แบบพลาดๆ 10 ประการ

0

สถาปัตยกรรมข้อมูล ก็เช่นเดียวกับบ้านเรือน สถาปัตยกรรมรอบๆตัว ในโลกนี้ ที่มีทั้งดี และไม่ดี พลาด และไม่พลาด วันนี้ เฮียจา (Jacob Nielson) บิดาแห่งศาสตร์เรื่อง Web Usability จะมาแจงให้ฟังว่า สิบประการที่เฮียเห็นว่าพลาดกันจริง พลาดกันจังนี้
มีอะไรบ้าง

และเพื่อศักดิ์ศรีติ๊งต๊องของผู้เขียน
ไม่เคยมีล่ะที่จะแปลเขามาเป๊ะๆ
ขอเล่าในแบบฉบับของตัวเองเป็นภาษาไทยก็แล้วกัน

ข้อผิดพลาด แบ่งเป็นเรื่องโครงสร้าง 5 ประการ
และเรื่อง Navigation อีก 5 ประการ ดังจะกล่าวบทไป

เรื่องพลาดๆของโครงสร้าง

พลาด! ที่ 1
ไม่มีโครงสร้าง

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

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

พลาด! ที่ 2
โครงสร้างกับ search ไม่สอดคล้องกัน

แม้ว่าเดี๋ยวนี้ผู้ใช้จะใช้วิธี search เพื่อมาเจอไซต์เรา
และจะมาแลนดิ้งที่หน้าไหนของไซต์เราก็ได้โดยไม่ต้องผ่าน navigation จากหน้าแรก
แต่มันก็ไม่ได้แปลว่า เราตัด Navigation ทิ้งไปได้เลย หรือทำเอาแบบเข้าใจว่าผู้ใช้รู้จักไซต์เราดีแล้ว
เพราะผู้ใช้ ก็ยังต้องสนใจอยู่ว่า
1. โอ้ว?นี่เราอยู่ที่ไหนกัน (Where am I?)
2. โอ้ว?นี่เราสามารถทำอะไรตรงนี้ได้บ้าง (What can I do here?)
3. โอ้ว?นี่เราจะไปไหนต่อได้จากตรงนี้ (Where can I go from here?)

พลาด! ที่ 3
ไม่มี Section Overview หรือ Category Landing Page

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

ถ้าเปรียบเป็นอวัยวะ
การที่ไม่มีหน้า Category Landing Page
บางครั้งก็จะเหมือนกับมือที่ไม่มีฝ่ามือ
เป็นแขนมาแล้วอยู่ๆนิ้วก็งอกจากปลายแขนมาห้านิ้วเลย
สยึมกึ๋ยพิลึก

ดูตัวอย่างจากไซต์ http://www.bcc.co.uk
หน้าส่วนข่าวศิลปะ บันเทิง และหน้าที่ไปตัวข่าวนั้นๆ

หน้าแรก ข่าวบันเทิง

หน้าแรก ข่าวบันเทิง

หน้ารายละเอียดข่าว

หน้ารายละเอียดข่าว

พลาด! ที่ 4
Polyhierachy ที่สุดโต่ง

Polyhierachy มีความหมายเป็นภาษาคนขึ้นมาอีกหน่อยว่า
การที่สิ่งหนึ่งๆ มี parent node มากกว่า 1
ในโลกกายภาพ ยากที่จะเกิดขึ้น หรือถ้าเกิดขึ้นก็จะเกิดความสับสนอย่างชัดเจน
เช่น คนๆนี้ ต้องเกิดจากพ่อ 1 และแม่ 1 เท่านั้น
ใบไม้ 1 ใบ ต้องงอกออกมาจากกิ่งๆเดียว จากลำต้นๆเดียว
ของ 1 อย่าง อยู่ได้ทีละ 1 สถานที่เท่านั้น
อย่างนี้ไม่สับสน
แต่เมื่อไหร่ที่มีความซ้อนทับ เหลื่อมล้ำ
อย่างเช่น เขาพระวิหาร หรือน้องปอย หรือนิโคตินเจล
ก็จะเกิด common problem ของโลกกายภาพในการระบุ parent node

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

พลาด! ที่ 5
Microsite หรือ Subsite ไม่สอดคล้องกับไซต์หลัก

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

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

ตัวอย่างเช่นไซต์โตโยต้า
http://www.toyota.co.th/th/toyota2009_home.htm
หน้าแรก โตโยต้าประเทศไทย หน้าแรก โตโยต้าประเทศไทย
พอหนูอยากดู Yaris ดูก็กระโดดมาที่นี่
http://www.toyota.co.th/th/models/yaris/yaris2009_home.htm
หน้าแรก รถยนต์ โตโยต้า ยาริส

หน้าแรก รถยนต์ โตโยต้า ยาริส

?แล้วพอหนูอยากดูรถรุ่นอื่นล่ะคะพี่ หนูต้องทำยังไง
หนูจะคำนวณค่าผ่อนค่าดาวน์ตรงไหน
หนูกลับไม่ได้ ไปไม่ถึงค่ะพี่

เรื่องพลาดๆของ Navigation

พลาด! ที่ 6
ไม่มี Navigation

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

อีกอย่างหนึ่งคือ การทำ Navigation ไปเหมือนโฆษณาเกินไป
ผู้ใช้จะเกิด Banner Blindness Bleed
นั่นคือ มองข้ามสิ่งที่คิดว่าเป็นโฆษณาไป
แล้วจะทำให้มองไม่เห็นว่านั่นคือ Navigation หรือเนื้อหาจริงๆ

เพิ่งไปเจอเว็บไทยรัฐโฉมใหม่
http://www.thairath.co.th/
ที่นำเอาแบนเนอร์โฆษณาไปรวมเป็นพื้นที่เดียวกับพาดหัวข่าว
โดยให้มัน Rotate ไปเรื่อยๆ
นัยหนึ่งนั้น ก็เป็นการจัดการพื้นที่หน้าในแบบหนึ่ง
แต่ข้อเสีย(หรือข้อดี?) ของมันคือ ถ้าเป็นมือใหม่ของเว็บนี้
อาจจะเผลอคลิกกดได้ หรือสับสนว่าจะมองข้ามหรือมองมันดี
คิดในแง่ดี CTR อาจจะสูง เพราะกดพลาดเยอะ
แต่นั่น ก็ทำให้ CTR มันเพี้ยนเพราะกดพลาดเยอะได้เช่นกัน
ถ้ามองในแง่รายได้ ก็อาจจะชอบ
แต่ผู้ใช้เรื่องมาก สับสนง่ายอย่างเรา ไม่ชอบแน่ๆ

หน้าแรก ไทยรัฐออนไลน์

หน้าแรก ไทยรัฐออนไลน์

พลาด! ที่ 7
Navigation ที่ควบคุมไม่ได้

มักเกิดได้จากทั้งการออกแบบที่ต้องการใส่ความครีเอทลงไปเกินเหตุ
และการออกแบบที่ไม่ได้คิดอะไรเลย
ไม่ว่าจะเป็นการทำ Navigation ที่ดุ๊กดิ๊กเลื่อนไปเลื่อนมาให้ผู้ใช้เล่นไล่จับ
หรือการทำ Popup มาบัง Navigation ไม่ให้กดได้

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

พลาด! ที่ 8
Navigation ที่ไม่คงเส้นคงวา

นักออกแบบที่มักจะพลาดข้อนี้ มักจะเป็นเพื่อนกับพี่ข้อที่ 7 ไม่ก็เป็นคนเดียวกัน
ไซต์ที่ทำให้ผู้อื่นใช้งาน ก็ควรทำให้เขาเหล่านั้นเข้าใจและเรียนรู้การใช้งานได้อย่างรวดเร็ว
ไม่หยุมหยิม จุกจิก และเป็นแบบเดียวกันทั้งไซต์
ซึ่งไม่ได้แปลว่าแต่ละหน้าต้องมี Navigation ไปสู่ทุกหน้าเหมือนๆกัน
แต่แต่ละหน้าต้องมี
1. Pattern ในการ Browse อย่างเดียวกัน เช่น เข้าไปในหน้าที่มาจากหน้าหลัก
ถึงจะมี Local Navigation ย่อยออกมา
2. Global Navigation แบบเดียวกัน ไม่ใช่เดี๋ยวมีหน้า Home เดี๋ยวไม่มี

พลาด! ที่ 9
เทคนิก Navigation ที่มากเกินไป

พี่ข้อนี้ก็คงเป็นเพื่อนหรือคนๆเดียวกับข้อ 7 กับ 8 ได้
พฤติกรรมตอบสนองเมื่อผู้ใช้คลิก ต้องเหมือนกัน
ไม่ใช่เดี๋ยว Highlight เดี๋ยวไม่ Highlight
เดี๋ยวกดได้เดี๋ยวกดไม่ได้โดยที่ไม่มีบอกใบ้เอาไว้
มี Navigation หลายๆที่เปะปะไม่เป็นระเบียบ

พลาด! ที่ 10
เมนูเข้าใจเอง เออเอง

การใช้ศัพท์แสงในวงการ อาจจะทำให้เราดูดีมีความรู้จริงเกี่ยวกับเรื่องนั้นๆ
แต่ต้องดูผู้ฟังด้วย
นักพฤกษศาสตร์ อาจจะคุยกันเรื่อง CONVOLVULACEAE
ในขณะที่ชาวบ้านเรียกว่า ผักบุ้ง
ตากล้องอาจจะพูดว่า F กว้าง F แคบ
ในขณะที่ชาวบ้านพูดว่า หน้าชัดหลังเบลอ
ฉะนั้น การตั้ง Label ให้กับ Navigation Menu นั้น
ก็ไม่ต่างอะไรกับการสื่อสารกับคนอื่น
เราต้องรู้ว่า ผู้ใช้ของเราเป็นใคร
พวกเขาใช้ศัพท์แบบใดในการพูดคุยกันเรื่องนั้นๆ
และถึงเขาเข้าใจศัพท์บางประเภท แต่ศัพท์ประเภทใดที่เขาใช้กันจริงๆ

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

10 ข้อนี้ เป็นข้อใหญ่ๆที่ยังมีรายละเอียดปลีกย่อยมากมายให้เมาท์
แต่ก็พอจะเป็นแนวทางที่ดีในการวางโครงสร้างเว็บโดยคร่าวๆได้แล้ว : -)

โครงร่างจากที่เฮียจาเขียนไว้ที่นี่
http://www.useit.com/alertbox/ia-mistakes

Comments

comments

Share.

About Author

ทีมงาน MarketingByte.com ที่คอยเจาะลึก วิเคราะห์ หาข้อมูลต่างๆ มาเพื่อบริการข้อมูลด้านการตลาดออนไลน์เพื่อคนไทย ติดตามเราทาง Social Media : www.facebook.com/marketingbyte หรือ www.twitter.com/mktbyte

Leave a Reply

%d bloggers like this: