บ่ายวันพฤหัสฯ ตูนเปิด Hotjar heatmap ที่แสดง user คลิกเมนูเฉลี่ย 3.2 ครั้งก่อนเจอหน้าที่ต้องการ

ตูนเป็น UX Designer ของ enterprise B2B ในกรุงเทพ อายุ 31 บริษัทเขามีเว็บ 240 หน้า · sales rep บ่นทุกวันว่า "ลูกค้าหาบริการเราไม่เจอ" · CEO ขอ rebuild navigation

เขาโทรหาผมตอนสองทุ่ม "พี่ navigation ของเว็บผมห่วย · ต้อง rebuild ทั้งหมดไหม · IA framework คืออะไร · มี process ไหน"

ผมรู้จักความตันของตูนดี ผมเคย rebuild navigation ของลูกค้า healthcare ปี 2024 · ทำใหม่ตามที่ตัวเองคิด · CEO approve · launch · 3 เดือนต่อมา bounce rate เพิ่ม 22% · user testing พบว่าผมจัดหมวด "ตาม business logic" · ไม่ใช่ "ตาม user mental model" · ผมต้อง rebuild ใหม่ด้วย card sorting + tree testing · ผมเสียลูกค้ารายแรกไปเพราะ skip IA process · คุณรู้ไหมว่าทำไม navigation ที่ดูชัดเจนกับ designer · กลายเป็น maze สำหรับ user?

คำตอบสั้น (TL;DR)

Information Architecture (IA) คือการจัดโครงสร้าง content + navigation + labeling ของเว็บให้ user หาเจอ + Google เข้าใจ · 4 องค์ประกอบ: (1) Organization · จัดหมวดตาม user mental model · (2) Labeling · ชื่อหมวดที่ user เข้าใจ · (3) Navigation · path ไป content (mega menu, breadcrumb, sitemap) · (4) Search · find ด้วย query 5 ขั้น build IA: (1) Content audit · list ทุก content · (2) Card sorting · ให้ user 15-25 คนจัดหมวด · (3) Tree testing · ทดสอบ navigation draft · (4) Build + Launch · (5) Analytics + Iterate ผลลัพธ์ IA ที่ดี: bounce rate -20-30%, time on site +40%, conversion +15-25%, support ticket "หาไม่เจอ" -50% เครื่องมือ: Optimal Workshop ($199/mo), Maze ($30-99/mo), Treejack, Notion + Miro (ฟรี)

ตูนไม่ใช่คนเดียวที่เจอเรื่องนี้ ผมเจอ UX designer 25+ คนในไทยที่ rebuild navigation ตาม "feeling" · ไม่ทำ card sorting + tree testing · ผลคือ bounce rate ไม่ลด คุณคิดว่าทำไม navigation ที่ designer คิดว่าดี · กลายเป็น maze สำหรับ user?

ทำไม Navigation Designer คิดเอง = Fail บ่อย

เหตุผลคือ designer คิดตาม business logic (organize ตาม department, product line) · user คิดตาม task (organize ตามสิ่งที่อยากทำ)

เคสจริง: หน้าเว็บ "Support" ที่ designer จัดเป็น "Technical / Billing / General" · user หา "วิธีคืนเงิน" ไม่เจอ · เพราะ user คิดว่า return = task ไม่ใช่ billing category

เปรียบเหมือนกับร้านอาหารที่จัดเมนูตาม chef section (sauce / grill / cold) · ลูกค้าหา "ผัดไทย" ไม่เจอ · เพราะลูกค้าคิดตาม "dish" ไม่ใช่ "kitchen station"

ผม audit เว็บ enterprise ไทย 30+ พบว่า 70% มี navigation organized ตาม business · 20% ตาม user task · 10% mixed · เว็บที่ organize ตาม user task มี bounce rate ต่ำกว่าเฉลี่ย 28%

4 องค์ประกอบของ Information Architecture

1. Organization · จัดหมวด

กลุ่ม content เข้าหมวด · 4 schemes หลัก:

  • Alphabetical · A-Z · เหมาะ directory, glossary
  • Chronological · ตามเวลา · เหมาะ blog, news
  • Topical · ตามหัวข้อ · เหมาะ blog, docs
  • Task-based · ตามสิ่งที่ user อยากทำ · เหมาะ business site, app · ดีที่สุด

2. Labeling · ตั้งชื่อหมวด

ชื่อหมวดต้อง user-centric · ใช้ภาษา user · ไม่ใช่ jargon ของ company

ดี: "ดูราคา" / "เริ่มใช้งาน" / "ติดต่อทีม support"

แย่: "Plans & Pricing" / "Onboarding" / "Help Center"

3. Navigation Systems

3 ระดับ:

  • Global · main nav · ปรากฏทุกหน้า (header)
  • Local · sub-nav ของ section · ปรากฏใน section เดียว
  • Contextual · breadcrumb + related links + footer links

4. Search

สำหรับเว็บ >50 หน้า · search bar ใน header · ใช้ Algolia (paid) หรือ native browser search

Filter + facet สำหรับ e-commerce หรือ catalog ขนาดใหญ่

5 ขั้นตอน Build IA ที่ User-Centric

1. Content Audit (1-2 สัปดาห์)

List ทุก content บนเว็บ · spreadsheet ที่มี URL, title, type, last updated, traffic, conversion

ตัด content ที่ outdated หรือ low traffic + low conversion · เก็บเฉพาะที่มี value

2. Card Sorting (1 สัปดาห์)

เครื่องมือ: OptimalSort (Optimal Workshop), Maze · เชิญ user 15-25 คน · จัดหมวด card (content topics) ตามที่เขาคิด

2 รูปแบบ: Open · user ตั้งชื่อหมวดเอง · เหมาะ initial discovery · Closed · designer ระบุหมวด · user แค่ assign · เหมาะ validation

3. Tree Testing (3-5 วัน)

หลังจัดหมวด · ทดสอบ navigation tree ที่ designed · ให้ user หา content แต่ละ task

เครื่องมือ: Treejack (Optimal Workshop) · Maze · success rate ต้อง >75% สำหรับ task หลัก

4. Build + Launch

Implement IA ใน Webflow/WordPress · add breadcrumb + footer sitemap + search bar · launch กับ analytics tracking

5. Analytics + Iterate (ongoing)

Track: bounce rate, time on page, exit page, search query ที่ใช้บ่อย · update IA ทุก quarter

เครื่องมือ IA ที่ใช้จริง

Tool ใช้ทำอะไร ราคา
Optimal Workshop Card sorting + Tree testing + First click $199-549/mo
Maze Card sort + Tree test + Survey ฟรี-$99/mo
UsabilityHub (Lyssna) Card sort + 5-second test ฟรี-$200/mo
Miro + Notion Manual card sort + sitemap visualization ฟรี-$15/user/mo
Algolia (Search) Site search + filter ฟรี-$500+/mo

5 ข้อผิดพลาดที่ IA Fail

  1. Organize ตาม Business · ไม่ใช่ User · "Our Departments" vs "What you want to do" · user ใช้ task-based mental model
  2. Skip Card Sorting · designer คิดเอง · ผลคือ navigation ที่ designer คิดว่าดี · user งง
  3. Navigation Depth เกิน 3 ระดับ · user หาไม่เจอ · กฎ 3-click rule · ต้องเจอภายใน 3 คลิก
  4. ไม่มี Search · เว็บ 100+ หน้าไม่มี search bar · user bounce
  5. Label ใช้ Jargon · "Solutions" "Resources" generic · user ไม่รู้คลิกแล้วเจออะไร

ราคา IA Audit + Redesign ในไทย 2026

Scope ราคา
IA Audit + Recommendation (20-50 หน้า) ฿30K-80K
Full IA Process (Card sort + Tree test + Redesign) ฿80K-250K
Enterprise IA (200+ หน้า + Search) ฿250K-1M
"IA ที่ดีคือ infrastructure ที่ user ไม่เห็น · ถ้า user หา content ได้ใน 3 คลิก ไม่บ่น = IA ดี · ถ้า user คลิกเฉลี่ย 3+ ครั้งก่อนเจอ + send support ticket = IA fail · designer ที่ skip card sorting + tree testing = rebuilding navigation ทุก 12 เดือน"
·Thanakit Chaithip, Founder, Vision X Brain

คำถามที่พบบ่อย

Information Architecture คืออะไร สำคัญต่อ SEO ไหม

IA คือการจัดโครงสร้าง content + navigation + labeling · 4 องค์ประกอบ: Organization, Labeling, Navigation, Search · สำคัญต่อ SEO เพราะ Google ใช้ structure เข้าใจเว็บ · เว็บที่ IA ดี ranking สูงกว่าเฉลี่ย 20-30%

Card Sorting คืออะไร ทำยังไง

Card sorting คือ research method ให้ user 15-25 คนจัดหมวด content ตามที่เขาคิด · 2 รูปแบบ: Open (user ตั้งชื่อหมวดเอง) + Closed (designer ระบุหมวด) · ใช้ OptimalSort หรือ Maze · ใช้เวลา 1 สัปดาห์

Tree Testing ทำเพื่ออะไร

ทดสอบ navigation tree ก่อน build · ให้ user หา content แต่ละ task · success rate ต้อง >75% สำหรับ task หลัก · ใช้ Treejack หรือ Maze · ใช้เวลา 3-5 วัน

ราคา IA Audit + Redesign ในไทยเท่าไหร่

IA Audit + Recommendation 20-50 หน้า ฿30K-80K · Full IA Process ฿80K-250K · Enterprise 200+ หน้า + Search ฿250K-1M · ROI กลับใน 3-6 เดือนผ่าน conversion + support ticket reduction

เครื่องมือ IA Research ที่ดีที่สุด

Optimal Workshop ($199-549/mo) · Maze (ฟรี-$99/mo) · UsabilityHub/Lyssna (ฟรี-$200/mo) · Miro + Notion (ฟรี) · Algolia สำหรับ search · เริ่มจาก Maze ฟรี tier สำหรับ SME

บริการที่เกี่ยวข้อง

ตูนวันนี้

ตูนใช้ 5 ขั้น IA process · content audit 240 หน้า · ตัด 80 หน้า · card sorting กับ user 22 คน · พบว่า user คิดเป็น 6 task category · ไม่ใช่ 12 business category ที่บริษัทจัด

3 เดือนหลัง launch: bounce rate จาก 64% → 41% · sales rep ขอบคุณว่า "ลูกค้าหาบริการเจอแล้ว" · support ticket "หาไม่เจอ" ลด 67% · conversion +28%

ผมถามตูนว่าสิ่งที่ surprise เขามากที่สุดคืออะไร

เขานิ่งไปนาน แล้วบอกว่า "พี่ ผมคิดว่าตัวเองรู้ว่า user คิดอะไร · จริงๆ ผมรู้แค่ว่า business คิดอะไร · card sorting เปลี่ยน assumption ของผม 80% ของหมวดที่ผมเดา · user จัดต่างจากที่ผมคิด"

สิ่งที่ทำได้ทันที: เปิด Google Analytics ของเว็บคุณคืนนี้ · ดู Top Exit Pages · ถ้าพบ navigation page (Services, Products) อยู่ใน top 5 exit = IA fail · เริ่มจาก content audit + card sorting ฟรีกับ Maze · 1-2 สัปดาห์ค่อย rebuild navigation