โครงสร้างของเว็บไซต์

โครงสร้างเว็บไซต์

การออกแบบโครงสร้างเว็บไซต์ (Site Structure Design)

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

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

1. รวบรวมข้อมูล เนื้อหาที่จะนำมาสร้างเว็บ แล้วนำมาจัดหมวดหมู่ และลำดับเนื้อหาก่อนหลัง (ตัดส่วนที่ไม่จำเป็นออก) แล้ววางโครงสร้างเว็บไซต์ในภาพรวมทั้งหมด

2. จัดทำแผนผังโครงสร้างการเชื่อมโยงไฟล์ เป็นแผนผังที่แสดงโครงสร้างข้อมูล ลำดับชั้น และการเชื่อมโยงส่วนต่างๆ อย่างชัดเจน

3. ออกแบบหน้าแรกของเว็บไซต์ หรือที่เรียกว่า Home page

ขั้นตอนการออกแบบเว็บไซต์


ขั้นแรกออกแบบโครงสร้างเว็บไซต์

ขั้นที่สองออกแบบการเชื่อมโยงไฟล์


ขั้นที่สามออกแบบหน้าโฮมเพ็จ (Home Page)

ตัวอย่างการออกแบบโครงสร้างเว็บไซต์ ร้านขายคอมพิวเตอร์และอุปกรณ์



ตัวอย่างการออกแบบโครงสร้างเว็บไซต์

เรื่องไม้มงคล


ตัวอย่างการออกแบบโครงสร้างเว็บไซต์

เรื่องกระต่าย

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


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

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


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

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

- เมนูเฉพาะกลุ่ม เป็นเมนูที่เชื่อโยงเว็บเพจปัจจุบันกับเว็บเพจอื่นภายในกลุ่มย่อยที่มี เนื้อหาเกี่ยวเนื่องกัน มักอยู่ในรูปแบบของลิงค์ข้อความหรือกราฟฟิกเช่นกัน

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


2. เครื่องมือบอกตำแหน่ง (Location Indicator)

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

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

- อยู่ในตำแหน่งที่เห็นได้ชัดและเข้าถึงง่าย เช่น ส่วนบนหรือด้านขวาของเว็บเพจ

- เข้าใจง่ายหรือมีข้อความกำกับชัดเจน ผู้ชมใช้ได้ทันทีโดยไม่ต้องเสียเวลาศึกษา

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

- บอกผู้ใช้ว่ากำลังอยู่ที่ตำแหน่งใดของเว็บไซต์

- มีการตอบสนองเมื่อใช้งาน เช่น เปลี่ยนสีเมื่อผู้ชมชี้เมาส์หรือคลิก

- จำนวนรายการพอเหมาะ ไม่มากเกินไป

- มีหลายทางให้เลือกใช้ เช่น เมนูกราฟฟิก , เมนูข้อความ, ช่องค้นหาข้อมูล (Search Box), เมนูดร็อปดาวน์ (Drop-down menu),

แผนผังเว็บไซต์ (Site Map)

- มีลิงค์ให้คลิกกลับไปยังโฮมเพจได้เสมอ เพื่อให้ผู้ชมกลับไปเริ่มต้นใหม่ในกรณีที่หลงทางไม่รู้ว่าตัวเองอยู่ที่ตำแหน่งใด



ที่มา : https://sites.google.com/site/hellomysitebylooknamkampong/hnwy-thi-2-khorngsrang-laea-kar-xxkbaeb-webphec/kar-xxkbaeb-khorngsrang-websit