Templates by BIGtheme NET
หน้าแรก / การสร้างเว็บไซต์ / 3. ออกแบบเว็บไซต์ / 3.2 การออกแบบระบบนำทาง (Site Navigation Design)

3.2 การออกแบบระบบนำทาง (Site Navigation Design)



ระบบ Navigation

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

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

องค์ประกอบของระบบ Navigation

1. เครื่องนำทาง

  • เมนูหลัก เป็นเมนูสำหรับลิงค์ไปยังหน้าหัวข้อหลักของเว็บไซต์ มักอยู่ในรูปของลิงค์ที่เป็นข้อความหรือภาพกราฟฟิก และมักถูกจัดวางอยู่ด้านบนในเว็บเพจทุกหน้า
  • เมนูเฉพาะกลุ่ม เป็นเมนูที่เชื่อโยงเว็บเพจปัจจุบันกับเว็บเพจอื่นภายในกลุ่มย่อยที่มี เนื้อหาเกี่ยวเนื่องกัน มักอยู่ในรูปแบบของลิงค์ข้อความหรือกราฟฟิกเช่นกัน
  • เครื่องมือเสริม สำหรับช่วยเสริมการทำงานของเมนู มีได้หลายรูปแบบ เช่น ช่องค้นหาข้อมูล (Search Box) , เมนูแบบดร็อปดาวน์ (Drop-Down menu) , แผนผังเว็บไซต์ (Site Map), อิมเมจแมพ (Image Map)

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

ตัวอย่าง ระบบ Navigation เว็บไซต์ดารานักร้อง ที่มีข้อมูลไม่กี่หน้า
navigation

ตัวอย่าง ระบบ Navigation เว็บไซต์ร้านหนังสือ Asia Books
navigation

.

ลักษณะของระบบเนวิเกชั่นที่ดี

  • อยู่ในตำแหน่งที่เห็นได้ชัดและเข้าถึงง่าย เช่น ส่วนบนหรือด้านขวาของเว็บเพจ
  • เข้าใจง่ายหรือมีข้อความกำกับชัดเจน ผู้ชมใช้ได้ทันทีโดยไม่ต้องเสียเวลาศึกษา
  • มีความสม่ำเสมอ วางอยู่ในตำแหน่งเดียวกันของทุกหน้าเว็บเพจ และใช้รูปแบบ สีสัน เหมือนกัน ทำให้ผู้ใช้รู้สึกคุ้นเคย
  • บอกผู้ใช้ว่ากำลังอยู่ที่ตำแหน่งใดของเว็บไซต์
  • มีการตอบสนองเมื่อใช้งาน เช่น เปลี่ยนสีเมื่อผู้ชมชี้เมาส์หรือคลิก
  • จำนวนรายการพอเหมาะ ไม่มากเกินไป
  • มีหลายทางให้เลือกใช้ เช่น เมนูกราฟฟิก , เมนูข้อความ, ช่องค้นหาข้อมูล (Search Box), เมนูดร็อปดาวน์ (Drop-down menu) , แผนผังเว็บไซต์ (Site Map)
  • มีลิงค์ให้คลิกกลับไปยังโฮมเพจได้เสมอ เพื่อให้ผู้ชมกลับไปเริ่มต้นใหม่ในกรณีที่หลงทางไม่รู้ว่าตัวเองอยู่ที่ตำแหน่งใด

คุณอาจสนใจเรื่องนี้

แนวทางการดีไซน์บล็อกยุคใหม่ (ตอน2)

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

2 ความคิดเห็น

  1. ยังงี้ เนวิเกชันเก่งต้องปรับปรุงอะไรบ้างไหมครับะพี่จอย

  2. เว็บอย่างเก่งเป็น blog อ่ะ ข้อมูลไม่ได้ซับซ้อนอะไร คนเข้า blog บ่อยๆ ก็ใช้งานเป็นอยู่แล้วแหละค่ะ ว่าแต่หน้าแรกหมวดหมู่มันหายไปไหนแล้วล่ะ และเวลาคลิกเข้าไปอ่านเรื่องแล้วถ้ามีปุ่ม Previous Next มันก็ทำให้คลิกง่ายดี ช่วยเพิ่ม page view ได้

Leave a Reply

Your email address will not be published. Required fields are marked *