• WebSite

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

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

ส่วนประกอบของหน้าเว็บเพจ แบ่งออกเป็น 3 ส่วนหลักๆ คือ

 

1. ส่วนหัวของหน้า (Page Header)
เป็นส่วนที่อยู่ตอนบนสุดของหน้า และเป็นส่วนที่สำคัญที่สุดของหน้า เพราะเป็นส่วนที่ดึงดูดผู้ชมให้ติดตามเนื้อหาภายในเว็บไซต์ มักใส่ภาพกราฟฟิกเพื่อ

สร้างความประทับใจ ส่วนใหญ่ประกอบด้วย

  • โลโก้ (Logo) เป็นสิ่งที่เว็บไซต์ควรมี เป็นตัวแทนของเว็บไซต์ได้เป็นอย่างดี และยังทำให้เว็บน่าเชื่อถือ
  • ชื่อเว็บไซต์
  • เมนูหลักหรือลิงค์ (Navigation Bar) เป็นจุดเชื่อมโยงไปสู่เนื้อหาของเว็บไซต์

2.ส่วนของเนื้อหา (Page Body)
เป็นส่วนที่อยู่ตอนกลางของหน้า ใช้แสดงข้อมูลเนื้อหาของเว็บไซต์ ซึ่งประกอบด้วยข้อความ, ตารางข้อมูล ภาพกราฟิก วีดีโอ และอื่นๆ และอาจมีเมนูหลัก หรือเมนูเฉพาะกลุ่มวางอยู่ในส่วนนี้ด้วย

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

3. ส่วนท้ายของหน้า (Page Footer)
เป็นส่วนที่อยู่ด้านล่างสุดของหน้า จะมีหรือไม่มีก็ได้ มักวางระบบนำทางที่เป็นลิงค์ข้อความง่าย ๆ และอาจแสดงข้อมูลเพิ่มเติมเกี่ยวกับเนื้อหาภายในเว็บไซต์ เช่น เจ้าของเว็บไซต์, ข้อความแสดงลิขสิทธิ์, วิธีการติดต่อกับผู้ดูแลเว็บไซต์, คำแนะนำการใช้เว็บไซต์ เป็นต้น

โดยปกติส่วนหัวและส่วนท้ายมักแสดงเหมือนกันในทุกหน้าของเว็บเพจ

ตัวอย่าง แสดงส่วนประกอบของหน้าเว็บเพจ (trendypet.com)

 

โครงสร้างและรูปแบบของเว็บเพจ
ในหน้าเว็บเพจหนึ่งๆ ประกอบไปด้วยส่วนหัวของหน้า (Page Header), ส่วนเนื้อหา และการเชื่อมโยง (Page Body) และส่วนท้ายของหน้า (Page Footer)

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

การแบ่งพื้นที่ของหน้าเว็บเพจเพื่อแสดงส่วนประกอบต่างๆ
ทำได้หลายรูปแบบ เช่น
แบ่งแบบอิสระ

 

แบ่ง 2 ส่วน

 

 

แบ่ง 3 ส่วน     จะมีส่วน Footer หรือไม่ก็ได้

 

 

 

ตัวอย่างเว็บไซต์

 

 

ส่วนเนื้อหายังสามารถแบ่งสัดส่วนเพื่อแสดงเนื้อหาต่างๆ ได้อีก

 

 

ตัวอย่างเว็บไซต์

 

 

 

 

 

ขอบคุณข้อมูล wordpress