1. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
หน่วยที่ 2
หลักเริ่มต้นการใช้งานโปรแกรม
สาระการเรียนรู้
2.1 ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ต
2.2 กระบวนการพัฒนาเว็บไซต์
2.3 หลักการออกแบบเว็บไซต์
วัตถุประสงค์เชิงพฤติกรรม
2.1 บอกลักษณะทั่วไปเกี่ยวกับอินเตอร์เน็ตได้
2.2 อธิบายกระบวนการพัฒนาเว็บไซต์ได้
2.3 บอกหลักการออกแบบเว็บไซต์ได้

2. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
ในยุคเริ่มต้นที่คอมพิวเตอร์เกิดขึ้นใหม่ๆนั้น การใช้งานยังจากัดอยู่ในวงแคบ เน้นการใช้งานเฉพาะเครื่องเดี่ยวๆ ไม่มี
การเชื่อมต่อคอมพิวเตอร์เข้าด้วยกัน การย้ายข้อมูลจากเครื่องหนึ่งไปใช้งานกับอีกเครื่องหนึ่งทาได้โดยใช้แผ่นบันทึกหรือหน่วยบันทึก
ข้อมูลแล้วนาไปใช้กับอีกเครื่อง
ต่อมาได้มีแนวคิดที่จะเชื่อมโยงคอมพิวเตอร์หลายๆ เครื่องเข้าด้วยกันเพื่อให้สามารถรับส่งข้อมูลซึ่งกันและกันได้ เรียกว่า
เครือข่ายคอมพิวเตอร์ หรือ คอมพิวเตอร์เน็ตเวิร์ค(Computer Network)หมายถึง การเชื่อมโยงคอมพิวเตอร์หลายๆ เครื่องหรือตั้งแต่ 2
เครื่องขึ้นไปเข้าด้วยกันผ่านตัวกลาง เช่น สายเคเบิล เพื่อให้คอมพิวเตอร์แต่ละเครื่องสามารถรับส่งข้อมูลตลอดจนการนาทรัพยากรมาใช้
ร่วมกันได้
ในระยะแรกระบบเครือข่ายคอมพิวเตอร์จะเป็นเครือข่ายเล็กๆ ภายในหน่วยงานเดียวกัน หรืออาณาเขตไม่ไกลกันมากนัก เช่น
ภายในบริษัทเดียวกัน ช่วยให้แต่ละแผนกสามารถแบ่งปันข้อมูลและทางานร่วมกันได้สะดวกมากยิ่งขึ้น ต่อมาได้นาเอาระบบย่อยของแต่
ละหน่วยงานเชื่อมโยงเข้าเป็นเครือข่ายเดียวกัน ทาให้ระบบเครือข่ายคอมพิวเตอร์ขยายวงกว้างออกไปเป็นเครือข่ายระหว่างเมืองและใน
ที่สุดก็ได้ขยายครอบคลุมไปทั่วทั้งโลกอย่างในปัจจุบัน
อินเทอร์เน็ต (Internet) เป็นเครือข่ายคอมพิวเตอร์สาธารณะที่ใหญ่ที่สุดในโลกซึ่งรวมเอาเครือข่ายย่อยเป็นจานวนมาก
ต่อเชื่อมเข้าด้วยกันภายใต้มาตรฐานเดียวกันจนเป็นเครือข่ายคอมพิวเตอร์ขนาดใหญ่ มาตรฐานของเครือข่ายอินเทอร์เน็ตประกอบด้วย 3
มาตรฐาน คือ อินเทอร์เน็ต โปรโตคอล(Internet Protocal – IP) ซิมเปิล เมล ทรานซ์เฟอร์ โปรโตคอล(Simple Mail Transfer
Protocal – SMTP) และโดเมน เนม ซิสเต็ม(Domain Name System-DNS) ด้วยมาตรฐานดังกล่าวทาให้คอมพิวเตอร์ทั่วโลกสามารถ
เชื่อมโยงเป็นเครือข่ายเดียวกันได้และเป็นแพล็ตฟอร์ม(Platform) ของเวิลด์ ไวด์ เว็บ (world Wide Web – WWW)
อินเตอร์เน็ตกาเนิดขึ้นในปี พ.ศ. 2512 โดยองค์กรทางทหารของสหรัฐอเมริกาชื่อ U.S. Defense Department ซึ่งมี
วัตถุประสงค์เพื่อให้เครือข่ายมีความมั่นคง ไม่เสียหาย แม้ส่วนใดส่วนหนึ่งของระบบเครือข่ายถูกทาลาย เครือข่ายได้รับการพัฒนาขึ้นใช้
ชื่อว่า อาร์พาเน็ต(ARPAnet)ย่อมาจาก Advance Research Project Agency ได้ชื่อว่าเป็นต้นกาเนิดของอินเทอร์เน็ต
อินเทอร์เน็ตมีพื้นฐานบริการที่หลากหลาย เช่น การรับส่งอีเมล(E-mail) การรับส่งแฟ้มข้อมูล(FTP)การค้นหาข่าวสารหรือ
ข้อมูล(Gopher)และการสนทนา(Chat)เป็นต้น ด้วยบริการที่หลากหลายดังกล่าวทาให้อินเทอร์เน็ตได้รับความนิยมมากและแพร่กระจาย
ไปทั่วโลกอย่างรวดเร็ว
2.1 ความรู้พื้นฐานเกี่ยวกับอินเทอร์เน็ต

3. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
2.1.1 ลักษณะของ เวิลด์ ไวด์ เว็บ(world Wide Web – WWW)
เวิลด์ ไวด์ เว็บ (WWW) มีลักษณะเป็นระบบเครือข่ายสื่อสารที่โยงใยไปทั่วโลก ให้บริการการสื่อสารข้อมูลบอินเตอร์เน็ตหลาย
รูปแบบ ทั้งข้อมูลข่าวสาร ภาพกราฟิก และระบบมัลติมีเดีย รวมทั้งความสามารถในการโต้ตอบระหว่างผู้ให้บริการได้ เวิลด์ไวด์เว็บ
สามารถทางานได้ในเครื่องคอมพิวเตอร์และโปรแกรมระบบปฏิบัติการ(Operating System) ทุกชนิด(Cross Platform) ข้อมูลข่าวสาร
ทั้งหมดของเวิลด์ไวล์เว็บจะกระจายเก็บอยู่ในศูนย์อินเตอร์เน็ตต่างทั่วโลกและมีการปรับปรุงให้ทันสมัยอยู่ตลอดเวลา ลักษณะการ
นาเสนอข้อมูลบนเว็บจะเป็น Graphic User Interface คือใช้รูปภาพเป็นตัวเชื่อมต่อสื่อสารกับผู้ใช้ ทาให้สะดวกต่อการใช้งานเป็นอย่าง
มาก
หลักการทางานของเว็บประกอบด้วย 2 ส่วน คือ ส่วนที่เป็นเครื่องส่งข้อมูล เรียกว่า เครื่องให้บริการ หรือเซิร์ฟเวอร์(Server)และ
ส่วนที่เป็นเครื่องรับข้อมูล หรือไคลแอนด์(Client)โดยที่เมื่อสร้างเว็บไซต์เสร็จแล้วก็นาเว็บไซต์ไปบันทึกไว้ที่เครื่องให้บริการ เมื่อผู้ใช้
ต้องการอ่านข้อมูลก็ต่อเชื่อมเข้าสู่ระบบและดาวน์โหลดข้อมูลมาไว้ในเครื่องรับข้อมูลหรือคอมพิวเตอร์ไคลแอนด์
2.1.2 เว็บเพจ(Webpage)
เว็บไซต์(Web Site) หมายถึง เว็บเพจหลายๆมารวมกัน และระบุที่อยู่ในอินเทอร์เน็ตหรือยูอาร์แอล
เว็บเพจ(Web Page) คือ หน้าเอกสารเว็บที่สร้างขึ้นด้วยภาษา HTML(Hypertext Markup Language)ซึ่งโปรแกรม
เบราเซอร์จะทาหน้าที่แปลภาษา HTML ออกมาเป็นหน้าเอกสารทางจอภาพคอมพิวเตอร์ เว็บเพจอาจจะประกอบด้วยข้อความ
ภาพกราฟิก หรือภาพเคลื่อนไหวอาจมีเสียงประกอบด้วยก็ได้ ทาให้ดึงดูดความสนใจ และทาให้เวิลด์ ไวด์ เว็บ ได้รับความนิยมเป็นอย่าง
มากในปัจจุบัน
เว็บเพจแต่ละหน้าจะถูกระบุด้วยที่อยู่ของเว็บเพจที่เรียกว่า URL(Uniform ResourceLocator) นั่นเอง และในเว็บเพจ
ยังมี จุดเชื่อมโยง(Links) หรือ ไฮเปอร์ลิงก์(Hyperlink) ที่เป็นข้อความหรือภาพที่ให้คลิกเม้าส์เพื่อเชื่อมโยง ไปยังที่อยู่ของ
เว็บเพจอื่นๆ ด้วยการระบุด้วย URL
ตัวอย่าง URL : http://www.klvschool.com/main.html

4. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
2.1.3 โดเมนเนม(Domain Name)
การเชื่อมต่ออินเทอร์เน็ตจะต้องกาหนดที่อยู่(address)ของผู้ใช้งาน เรียกว่า ไอพีแอดเดรส(IP address) เพื่อนใช้ในการอ้าง
ตาแหน่งที่อยู่ของเครื่องคอมพิวเตอร์แต่ละเครื่อง เช่น 158.108.2.71 เป็นต้น ไอพีแอดเดรสเป็นระบบตัวเลขทาให้จาได้ยากและไม่สื่อ
ความหมายในระบบอินเทอร์เน็ต จึงได้มีการตั้งชื่อใหม่ให้เกิดความสะดวกต่อการใช้งานเรียกว่า ระบบโดเมนเนม หรือดีเอ็นเอส(DNS-
Domain Name System) เป็นระบบที่แปลงตัวเลขไอพีแอดเดรสให้เป็นชื่อที่อ่านและเข้าใจง่ายและสอดคล้องกับหน่วยงานหรือองค์กร
นั้นๆ
2.1.4 เว็บ เบราว์เซอร์(Web Browser)
เว็บเบราว์เซอร์ (web browser) เบราว์เซอร์ หรือ โปรแกรมดูเว็บ คือโปรแกรมคอมพิวเตอร์ ที่ผู้ใช้สามารถดูข้อมูลและโต้ตอบ
กับข้อมูลสารสนเทศที่จัดเก็บในหน้าเวบที่สร้างด้วยภาษาเฉพาะ เช่น ภาษาเอชทีเอ็มแอล (html) ที่จัดเก็บไว้ที่ระบบบริการเว็บหรือเว็บ
เซิร์ฟเวอร์ หรือระบบคลังข้อมูลอื่น ๆ โดยโปรแกรมค้นดูเว็บเปรียบเสมือนเครื่องมือในการติดต่อกับเครือข่ายคอมพิวเตอร์ขนาดใหญ่ที่
เรียกว่าเวิลด์ไวด์เว็บ โดยมี เว็บเบราว์เซอร์ (web browser) ที่เป็นที่นิยมอย่างแพร่หลาย เช่น Internet Explorer, Mozilla Firefox,
Google Chrome, Safari เป็นต้น
2.1.5 ภาษาเอชทีเอ็มแอล(HTML)
ภาษาเอชทีเอ็มแอล(HTML) ย่อมาจากคาว่า Hypertext Markp Language เป็นภาษาที่ใช้สาหรับสร้างเว็บเพจ โดยจะได้รับการ
แปลหรือแสดงผลโดยเว็บ เบราว์เซอร์ ซึ่งสามารถแสดงได้ทั้ง ข้อความ ภาพ เสียง และภาพเคลื่อนไหว
รูปแบบโครงสร้างภาษา HTML ประกอบด้วย ส่วนเริ่มต้นของคาสั่ง เรียกว่า Tag เปิดและส่วนจบของคาสั่ง เรียกว่า Tag ปิด โดย
Tag ปิด จะมีเครื่องหมาย Slash(/)
ภาษา HTML แสดงผลด้วยเว็บเบราว์เซอร์
ภาษา HTML จึงมีโครงสร้างที่ง่าย เหมาะสาหรับผู้เริ่มต้นสร้างเว็บเพจ และใช้งานร่วมกับโปรแกรมสร้างเว็บเพจอื่นๆ เพื่อทาให้
เว็บเพจสวยงามและมีประสิทธิภาพมากยิ่งขึ้น

5. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
การที่จะสร้างพัฒนาเว็บเพจและนาเว็บไซต์เข้าสู่ระบบเวิลด์ ไวด์ เว็บ ให้คนอื่นเข้ามาเยี่ยมชมได้นั้น มีกระบวนการ
ที่ผู้พัฒนาเว็บไซต์จะต้องศึกษาและปฏิบัติตาม ดังนี้
2.2.1 การวางแผนการทางาน
การสร้างเว็บไซต์ก็เหมือนกันจาเป็นต้องมีการวางแผนการทางานให้รอบด้านก่อนที่จะเริ่มลงมือทา โดยมีหลักที่ต้องกาหนดในการ
วางแผน ดังนี้
1. ระยะเวลาการทางาน เป็นการกาหนดช่วงเวลาที่จะใช้ในการสร้างเว็บ
2. ทีมงานหรือผู้ร่วมงาน ปกติการสร้างเว็บต้องทางานเป็นทีม อย่างน้อยต้องมีผู้เชี่ยวชาญ 3 ฝ่าย คือ ผู้เชี่ยวชาญด้าน
ภาษา HTML หรือโปรแกรมสร้างเว็บเพจ ผู้เชี่ยวชาญด้านการออกแบบและตกแต่งภาพและผู้เชี่ยวชาญด้านเนื้อหา
หรือบรรณาธิการ
3. งบประมาณ เป็นการกาหนดค่าใช้จ่าย
4. อุปกรณ์หรือเครื่องมือช่วยงาน เช่น เครื่องคอมพิวเตอร์ เครื่องสแกนเนอร์และรูปภาพประกอบ เป็นต้น
5. ปัญหาและอุปสรรค
2.2.2 การรวบรวมและวิเคราะห์โครงสร้าง
เป็นขั้นตอนหนึ่งที่ต่อจากการวางแผน เป็นการแผนงานไปปฏิบัติ โดยการรวบรวมข้อมูลที่จาเป็นต้องใช้ในการสร้างเว็บ ตาม
หัวข้อที่เลือกไว้ ทั้งเนื้อหา ภาพ เสียงและภาพเคลื่อนไหว เก็บรวบรวมเป็นไฟล์ข้อมูล หรือใส่แฟ้มแยกเป็นหมวดหมู่ เพื่อความสะดวกใน
การนามาใช้งาน
2.2.3 การออกแบบและการสร้างเว็บไซต์ เป็นขั้นตอนการนาข้อมูลทั้งหมดมาสร้างเป็นเว็บไซต์ด้วยภาษา HTML หรือเครื่องมือในการ
สร้างเว็บอื่นๆ หลักสาคัญในการออกแบบและสร้างเว็บ คือ
1. กาหนดจุดประสงค์เว็บไซต์ โดยวางเป้าหมายของผู้เข้าชมว่าจะเป็นกลุ่มใด
2. เลือกเว็บเบราว์เซอร์ เป็นการเลือกเว็บเบราว์เซอร์ที่ใช้แสดงผลเว็บไซต์ จะได้กาหนดขนาดกว้าง ยาว และลักษณะ
การวางองค์ประกอบเว็บให้สวยงามและแสดงผลได้เร็ว
3. วางโครงร่างของเว็บไซต์ กาหนดโครงร่างว่ามีทั้งหมดกี่เว็บเพจ แต่ละเว็บเพจมีเนื้อหาอะไรบ้าง ควรเขียนเป็นแผนผัง
เว็บไซต์ออกมาบนกระดาษ
4. ออกแบบหน้าตาเว็บ เป็นขั้นตอนในการลงมือสร้างเว็บเพจแต่ละหน้าตามที่ได้ออกแบบไว้ พร้อมกับทดสอบผ่านเว็บ
เบราว์เซอร์ (แบบ Offline)
2.2.4 ทดสอบและปรับปรุงเว็บไซต์
การทดสอบแบบออฟไลน์ โดยที่ยังไม่ได้นาเว็บไซต์เข้าสู่อินเทอร์เน็ต แต่ก็สามารถแสดงผลได้เหมือนจริงผ่านเว็บ
เบราว์เซอร์ เช่น IE เพื่อตรวจสอบตัวอย่างเว็บที่สร้างไว้ เช่น ขนาดตัวอักษร ขนาดภาพ การใช้สี ตาราง ฯลฯ ว่าเหมาะสมหรือไม่ พร้อม
กับการปรับปรุงจนเป็นที่น่าพอใจ
2.2.5 เผยแพร่ผ่านเว็บไซต์
เป็นการเผยแพร่ให้คนทั่วไปได้รู้จัก หรือเรียกว่าการอัพโหลด (Upload) โดยเจ้าของเว็บจะต้องจดทะเบียนโดเมนเนม และเช่า
พื้นที่โฮสต์ ก็สามารถนาเว็บเพจอัพโหลดขึ้นสู่อินเทอร์เน็ต และประชาสัมพันธ์ให้คนทั่วไปได้รู้จัก การที่จะทาให้คนรับรู้ และเข้ามาใช้
บริการเว็บไซต์ได้มากนั้นจะต้องมีการประชาสัมพันธ์อย่างต่อเนื่องและใช้เวลาพอสมควร และถ้าจะให้ดีควรมีเคาน์เตอร์ (Counter) หรือ
ตัวจดสถิติผู้เข้าชม ก็จะช่วยให้ประเมินได้ว่าเว็บไซต์ของเราได้รับความสนใจมากน้อยเพียงใด
2.2 กระบวนการพัฒนาเว็บไซต์

6. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
2.2.6 การพัฒนาเว็บไซต์
เป็นการปรับปรุงเนื้อหา ภาพประกอบหรืออัพเดท (Update) เว็บไซต์ ถือเป็นขั้นตอนสาคัญเพราะในโลกของอินเทอร์เน็ต
มีการเปลี่ยนแปลงอย่างรวดเร็วอยู่ตลอดเวลา ผู้ชมเว็บมักจะใช้เวลาในการค้นหาและเปิดผ่านเว็บไซต์ต่างๆ อย่างรวดเร็วหากพบว่า
เว็บไซต์ของเราไม่ได้เปลี่ยนแปลงหรือมีข้อมูลใหม่ๆ เพิ่มขึ้นเลย ผู้เข้าชมเว็บก็จะลดจานวนลงไปเรื่อยๆ จนกลายเป็นเว็บที่ไม่มีผู้คนเข้ามา
เลยหรือเป็นเว็บที่ตายแล้ว
ดังนั้นการปรับปรุงเว็บไซต์อยู่เสมออาจจะวันละครั้ง หรือสัปดาห์ละครั้ง โดยเพิ่มข้อมูล ข่าวสารใหม่ๆ อยู่เป็นประจาก็จะทาให้
เว็บไซต์ทันสมัย ผู้คนเข้าชมเป็นประจาและมากขึ้นจนพัฒนาเป็นเว็บไซต์ยอดนิยมได้ในที่สุด
การออกแบบเว็บไซต์เป็นการวางโครงสร้างทั้งหมดของเว็บไซต์ ว่าแต่ละหน้าจะประกอบด้วยเนื้อหาอะไรบ้าง
มีภาพประกอบ ตาราง ฯลฯ ตลอดจนการเชื่อมโยงเว็บเพจแต่ละหน้าเข้าด้วยกัน
2.3.1 รูปแบบโครงสร้างเว็บไซต์
การออกแบบโครงสร้างเว็บไซต์ สามารถทาได้หลายแบบ ขึ้นอยู่กับลักษณะของข้อมูล ความชอบของผู้ออกแบบ ตลอดจน
กลุ่มเป้าหมายที่ต้องการนาเสนอ โครงสร้างของเว็บไซต์ประกอบไปด้วย 4 รูปแบบใหญ่ๆ ได้ดังนี้
1. เว็บที่มีโครงสร้างแบบเรียงลาดับ (Sequential Structure)
เป็นโครงสร้างแบบที่นิยมใช้กันมากที่สุดเนื่องจากง่ายต่อการจัดระบบข้อมูล ข้อมูลที่นิยมจัดด้วยโครงสร้างแบบนี้มักเป็นข้อมูล
ที่มีลักษณะเป็นเรื่องราวตามลาดับของเวลา เช่น การเรียงลาดับตามตัวอักษร ดรรชนี สารานุกรม หรืออภิธานศัพท์ โครงสร้างแบบนี้
เหมาะกับเว็บไซต์ที่มีขนาดเล็ก เนื้อหาไม่ซับซ้อนใช้การลิงก์ (Link) ไปทีละหน้า ทิศทางของการเข้าสู่เนื้อหา (Navigation) ภายในเว็บจะ
เป็นการดาเนินเรื่องในลักษณะเส้นตรง โดยมี ปุ่มเดินหน้า-ถอยหลังเป็นเครื่องมือหลักในการกาหนดทิศทาง ข้อเสียของโครงสร้างระบบนี้
คือ ผู้ใช้ไม่สามารถกาหนดทิศทางการเข้าสู่เนื้อหาของตนเองได้ ทาให้เสียเวลาเข้าสู่เนื้อ
2. เว็บที่มีโครงสร้างแบบลาดับขั้น (Hierarchical Structure)
เป็นวิธีที่ดีที่สุดวิธีหนึ่งในการจัดระบบโครงสร้างที่มีความซับซ้อนของข้อมูล โดยแบ่งเนื้อหา ออกเป็นส่วนต่างๆ และมี
รายละเอียดย่อยๆ ในแต่ละส่วนลดหลั่นกันมาในลักษณะแนวคิดเดียวกับ แผนภูมิองค์กร จึงเป็นการง่ายต่อการทาความเข้าใจกับ
โครงสร้างของเนื้อหาในเว็บลักษณะนี้ ลักษณะเด่นเฉพาะของ เว็บประเภทนี้คือการมีจุดเริ่มต้นที่จุดร่วมจุดเดียว นั่นคือ โฮมเพจ
(Homepage) และเชื่อมโยงไปสู่เนื้อหา ในลักษณะเป็นลาดับจากบนลงล่าง
2.3 หลักการออกแบบเว็บไซต์

7. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
เว็บที่มีโครสร้างประเภทนี้ จัดเป็นอีกรูปแบบหนึ่งที่ง่ายต่อการใช้งาน ซึ่งรูปแบบโครงสร้าง คล้ายกับต้นไม้ต้นหนึ่งที่มีการแตกกิ่ง
ออกไปเป็น กิ่งใหญ่ กิ่งเล็ก ใบไม้ ดอก และผล เป็นต้น ข้อดีของโครงสร้างรูปแบบนี้ก็คือ ง่ายต่อการแยกแยะเนื้อหาของผู้ใช้และจัดระบบ
ข้อมูล ของผู้ออกแบบ นอกจากนี้สามารถดูแลและปรับปรุงแก้ไขได้ง่ายเนื่องจากมีการแบ่งเป็นหมวดหมู่ ที่ชัดเจน ส่วนข้อเสียคือในส่วน
ของการออกแบบโครงสร้างต้องระวังอย่าให้โครงสร้างที่ไม่สมดุล นั่นคือ มีลักษณะที่ลึกเกินไป หรือตื้นเกินไป โครงสร้างที่ลึกเกินไปเป็น
ลักษณะ ของโครงสร้างที่เนื้อหาในแต่ละส่วนมากเกินไปทาให้ผู้ใช้ต้องเสียเวลานานในการเข้าสู่เนื้อหาที่ต้องการ เพราะต้องคลิกปุ่มหน้า
ต่อไป (Next) หลายครั้ง
3. เว็บที่มีโครงสร้างแบบตาราง (Grid Structure)
โครงสร้างรูปแบบนี้มีความซับซ้อนมากกว่ารูปแบบที่ผ่านมา การออกแบบเพิ่มความยืดหยุ่น ให้แก่การเข้าสู่เนื้อหาของผู้ใช้ โดย
เพิ่มการเชื่อมโยงซึ่งกันและกันระหว่างเนื้อหาแต่ละส่วน เหมาะแก่ การแสดงให้เห็นความสัมพันธ์กันของเนื้อหา การเข้าสู่เนื้อหาของผู้ใช้
จะไม่เป็นลักษณะเชิงเส้นตรง เนื่องจากผู้ใช้สามารถเปลี่ยนทิศทางการเข้าสู่เนื้อหาของตนเองได้ เช่น ในการศึกษาข้อมูลประวัติศาสตร์
สมัยสุโขทัย อยุธยา ธนบุรี และรัตนโกสินทร์ โดยในแต่ละสมัยแบ่งเป็นหัวข้อย่อยเหมือนกันคือ การปกครอง ศาสนา วัฒนธรรม และ
ภาษา ในขณะที่ผู้ใช้กาลังศึกษาข้อมูลทางประวัติศาสตร์เกี่ยวกับ การปกครองในสมัยอยุธยา ผู้ใช้อาจศึกษาหัวข้อศาสนาเป็นหัวข้อต่อไป
ก็ได้ หรือจะข้ามไปดูหัวข้อ การปกครองในสมัยรัตนโกสินทร์ก่อนก็ได้เพื่อเปรียบเทียบลักษณะข้อมูลที่เกิดขึ้นคนละสมัยกัน
ในการจัดระบบโครงสร้างแบบนี้ เนื้อหาที่นามาใช้แต่ละส่วนควรมีลักษณะที่เหมือนกัน และ สามารถใช้รูปแบบร่วมกัน หลักการ
ออกแบบคือนาหัวข้อทั้งหมดมาบรรจุลงในที่เดียวกันซึ่งโดยทั่วไป จะเป็นหน้าแผนภาพ (Map Page) ที่แสดงในลักษณะเดียวกับ
โครงสร้างของเว็บ เมื่อผู้ใช้คลิกเลือก หัวข้อใด ก็จะเข้าไปสู่หน้าเนื้อหา (Topic Page) ที่แสดงรายละเอียดของหัวข้อนั้นๆ และภายใน
หน้านั้น ก็จะมีการเชื่อมโยงไปยังหน้ารายละเอียดของหัวข้ออื่นที่เป็นเรื่องเดียวกัน นอกจากนี้ยังสามารถนา โครงสร้างแบบเรียงลาดับ
และแบบลาดับขั้นมาใช้ร่วมกันได้อีกด้วย ถึงแม้โครงสร้างแบบนี้ อาจจะสร้างความยุ่งยากในการเข้าใจได้ และอาจเกิดปัญหาการคงค้าง
ของหัวข้อ (Cognitive Overhead) ได้ แต่จะเป็นประโยชน์ที่สุดเมื่อผู้ใช้ได้เข้าใจถึงความสัมพันธ์ ระหว่างเนื้อหา ในส่วนของการ
ออกแบบจาเป็นจะต้องมีการวางแผนที่ดี เนื่องจากมีการเชื่อมโยงที่เกิดขึ้น ได้หลายทิศทาง นอกจากนี้การปรับปรุงแก้ไขอาจเกิดความ
ยุ่งยากเมื่อต้องเพิ่มเนื้อหาในภายหลัง
4. เว็บที่มีโครงสร้างแบบใยแมงมุม (Web Structure)
โครงสร้างประเภทนี้จะมีความยืดหยุ่นมากที่สุด ทุกหน้าในเว็บสามารถจะเชื่อมโยงไปถึงกัน ได้หมด เป็นการสร้างรูปแบบการเข้า
สู่เนื้อหาที่เป็นอิสระ ผู้ใช้สามารถกาหนดวิธีการเข้าสู่เนื้อหาได้ด้วย ตนเอง การเชื่อมโยงเนื้อหาแต่ละหน้าอาศัยการโยงใยข้อความที่มีมโน
ทัศน์ (Concept) เหมือนกัน ของแต่ละหน้าในลักษณะของไฮเปอร์เท็กซ์หรือไฮเปอร์มีเดีย โครงสร้างลักษณะนี้จัดเป็นรูปแบบที่ ไม่มี
โครงสร้างที่แน่นนอนตายตัว (Unstructured) นอกจากนี้การเชื่อมโยงไม่ได้จากัดเฉพาะเนื้อหา ภายในเว็บนั้นๆ แต่สามารถเชื่อมโยงออก
ไปสู่เนื้อหาจากเว็บภายนอกได้

8. กลุ่มสาระ : การงานอาชีพและเทคโนโลยี
ชื่อวิชา : การสร้างเว็บไซต์ รหัสวิชา ง 23203
หัวข้อ : หน่วยที่ 2 เริ่มต้นการใช้งานโปรแกรม
ใบเนื้อหา หน้าที่
แผ่นที่ :
ลักษณะการเชื่อมโยงในเว็บนั้น นอกเหนือจากการใช้ไฮเปอร์เท็กซ์หรือไฮเปอร์มีเดีย กับข้อความที่มีมโนทัศน์ (Concept) เหมือนกันของ
แต่ละหน้าแล้ว ยังสามารถใช้ลักษณะการเชื่อมโยง จากรายการที่รวบรวมชื่อหรือหัวข้อของเนื้อหาแต่ละหน้าไว้ ซึ่งรายการนี้จะปรากฏอยู่
บริเวณใด บริเวณหนึ่งในหน้าจอ ผู้ใช้สามารถคลิกที่หัวข้อใดหัวข้อหนึ่งในรายการเพื่อเลือกที่จะเข้าไปสู่หน้าใดๆ ก็ได้ตามความต้องการ
ข้อดีของรูปแบบนี้คือง่ายต่อผู้ใช้ในการท่องเที่ยวบนเว็บ โดยผู้ใช้สามารถกาหนดทิศทาง การเข้าสู่เนื้อหาได้ด้วยตนเอง แต่ข้อเสียคือถ้ามี
การเพิ่มเนื้อหาใหม่ๆ อยู่เสมอจะเป็นการยากในการ ปรับปรุง นอกจากนี้การเชื่อมโยงระหว่างข้อมูลที่มีมากมายนั้นอาจทาให้ผู้ใช้เกิดการ
สับสนและ เกิดปัญหาการคงค้างของหัวข้อ (Cognitive Overhead) ได้