Grid คืออะไร ?

Grid คืออะไร ?

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

• Column คือ แถวที่อยู่ในตำแหน่งแนวตั้งของ Grid โดยจะมีขนาดพอดีตั้งแต่บนสุดถึงล่างสุด ของ Margins

• Margins คือ พื้นที่ว่างที่อยู่ข้างนอก Columns และ Rows โดยตัว Margins จะเป็นตัวกำหนดระยะห่างระหว่างขอบของ Artboard และ Element (ภายในเว็บ)

• Rows คือ แถวแนวนอนที่อยู่ใน Grid โดย Columns และ Rows ที่รวมกันอยู่ใน Grid จะเรียกว่า Modules

• Modules คือ ช่องที่เกิดจากการแบ่งเส้นของ Columns และ Rows

• Spatial Zone คือ การรวมตัวของ Modules ทั้งในแนวตั้งและแนวนอน เกิดเป็นพื้นที่ขนาดใหญ่ใน Grid

• Gutter หรือ Gaps คือ ช่องว่างสำหรับแบ่งแยก Rows และ Columns

• Markers เป็นส่วนที่อยู่มุมฝั่งใดฝั่งหนึ่งของ Header และ Footer โดยตัว Markers จะไว้ใช้ระบุหรือบอกตำแหน่งของเนื้อหาในทุกๆหน้า เช่น บอกจำนวนหน้าของหนังสือ หรือบอกชื่อของหนังสือ