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

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

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

รูปแบบของลินช์และฮอร์ตัน (Lynch and Horton. 1999 : 27 – 30) แห่งศูนย์สื่อการเรียนการสอนระดับสูง มหาวิทยาลัยเยล (Yale University) ซึ่งมีชื่อเสียงในด้านการออกแบบเว็บ มีความชัดเจนและครอบคลุมมากที่สุด ซึ่งสามารถสรุปโครงสร้างของเว็บออกเป็น 4 รูปแบบใหญ่ ๆ ดังนี้

1.เว็บที่มีโครงสร้างแบบเรียงลำดับ (Sequential Structure)

เว็บที่มีโครงสร้างแบบเรียงลำดับ (Sequential Structure)

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

2.เว็บที่มีโครงสร้างแบบลำดับขั้น(Hiereachy Structure)

เว็บที่มีโครงสร้างแบบลำดับขั้น(Hiereachy Structure)

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

 

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

3.โครงสร้างแบบตาราง (Grid Structure)

โครงสร้างแบบตาราง (Grid Structure)

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

 

4. โครงสร้างแบบใยแมงมุม (Web Structure)

โครงสร้างแบบใยแมงมุม (Web Structure)

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

การออกแบบโครงสร้างเว็บ

การออกแบบโครงสร้างเว็บ

หลักการสร้างเว็บไซต์

การออกแบบโครงสร้างเว็บ
สิ่งที่ต้องพิจารณาในการสร้างเว็บเพื่อการศึกษาคือ โครงสร้างหลักของเว็บ เนื่องจากการจัดการข้อมูลเพื่อการเรียนการสอนมีความแตกต่างกัน กลุ่มผู้เรียนที่แตกต่างและเนื้อหาของเว็บแตกต่างกัน โครงสร้างของเว็บก็จะมีผลต่อการเรียนการสอนเช่นกัน (McCormack and Jones, 1998)
โครงสร้างของเว็บโดยพื้นฐานจะมี 2 ลักษณะคือ
1. โครงสร้างเว็บแบบตื้น เป็นโครงสร้างเว็บในลักษณะที่มีการเชื่อมโยงจากหน้าแรกหรือหน้าที่หลักไปยังเนื้อหาโดยตรง โดยไม่มีเว็บเพจที่เป็นเนื้อหาเชื่อมโยงต่อไปอีกมากนัก สามารถกลับมายังหน้าแรกหรือหน้าหลักของของเว็บไซต์ได้ในทันที อาจจะมีการเชื่อมโยงของเนื้อหาต่อไปอีกบ้างแต่ไม่ต่อเนื่องเป็นลำดับลึกลงไปเหมือนกับโครงสร้างของเว็บแบบลึก โครงสร้างลักษณะนี้จึงเป็นโครงสร้างที่มีเนื้อหาแยกเป็นหน่วยย่อย ๆ หรือมีเนื้อหาเฉพาะเรื่องไม่เกี่ยวข้องกัน ทำให้ไม่ต้องเชื่อมโยงเว็บเพจต่อไปเรื่อย ๆ เว็บแบบตื้นอาจจะมีเนื้อหามากก็ได้ แต่ไม่เชื่อมโยงลึกลงไปอีก การออกแบบเว็บเพจอาจเป็นแบบหน้าเดียวสั้น ๆ หรือแบบแถบเลื่อนยาวลงไปมากก็ได้ เนื้อหาจบในหน้านั้นและไม่เชื่อมโยงไปอีก

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

ความรู้เบื้องต้นเกี่ยวกับเว็บไซต์

ความรู้เบื้องต้นเกี่ยวกับเว็บไซต์

หลักการสร้างเว็บไซต์

โฮมเพจ (Homepage) หมายถึง เว็บเพจที่เป็นหน้าแรกของเว็บไซต์ ที่เข้าถึงได้ทันทีเมื่อเข้าสู่ระบบอินเทอร์เน็ตโดยการพิมพ์โดเมนเนมหรือยูอาร์แอลซึ่งเป็นที่ติดตั้งของเว็บไซต์

เว็บเพจ (Web page) หมายถึง เอกสารที่สร้างขึ้นโดยในรูปแบบของ HTML หรือโปรแกรมการสร้างเว็บโดยเฉพาะ จะแสดงผลได้เฉพาะโปรแกรมบราวเซอร์ และต้องติดตั้งในเว็บเซอร์เวอร์เพื่อเข้าไปอ่านข้อมูลได้โดยผ่านระบบอินเทอร์เน็ต เว็บเพจจะมี 2 ลักษณะใหญ่คือ
– เว็บเพจแบบหน้าเดียว (Single page) หรือแบบสั้น (Short page) หมายถึง เว็บเพจที่แสดงผลข้อมูลหรือเนื้อหาเพียงหน้าเดียวมีขนาดเท่ากับหน้าจอคอมพิวเตอร์พอดี หรือมีแถบเลื่อนลงมาด้านล่างสั้น ๆ หรือมีรูปแบบเป็นกรอบพอดีหน้าจอภาพ
– เว็บเพจแบบแถบเลื่อน (Scroll page) หรือแบบยาว (Long page) หมายถึง เว็บเพจที่แสดงผลข้อมูลหรือเนื้อหาเป็นแนวยาวจากด้านบนลงมายังด้านล่างของหน้าจอภาพ โดยมีแถบเลื่อนอยู่ด้านข้างสำหรับเลื่อนหน้าจอภาพ เพื่อดูข้อมูลที่แสดงผลหน้าจอภาพ

Follow by Email
Facebook
GOOGLE
TWITTER
YOUTUBE